react-native-figma-shadow 0.1.0-alpha.1

package/lib/commonjs/index.js

@@ -0,0 +1,106 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Shadow = Shadow;
+Object.defineProperty(exports, "computeBleed", {
+  enumerable: true,
+  get: function () {
+    return _parseShadow.computeBleed;
+  }
+});
+exports.default = void 0;
+Object.defineProperty(exports, "parseBoxShadow", {
+  enumerable: true,
+  get: function () {
+    return _parseShadow.parseBoxShadow;
+  }
+});
+var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
+var _FigmaShadowViewNativeComponent = _interopRequireDefault(require("./FigmaShadowViewNativeComponent"));
+var _parseShadow = require("./parseShadow");
+var _jsxRuntime = require("react/jsx-runtime");
+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 resolveRadii(props) {
+  const base = props.borderRadius ?? 0;
+  return {
+    tl: props.borderTopLeftRadius ?? base,
+    tr: props.borderTopRightRadius ?? base,
+    br: props.borderBottomRightRadius ?? base,
+    bl: props.borderBottomLeftRadius ?? base
+  };
+}
+
+/**
+ * Wraps its children and paints a pixel-consistent CSS-style shadow behind them
+ * on both platforms.
+ *
+ * Layout is neutral: the shadow bleeds into space the component reserves with
+ * negative margins, so siblings are laid out as if only the children were there.
+ */
+function Shadow(props) {
+  const {
+    shadow = '',
+    backgroundColor,
+    highQuality = false,
+    style,
+    children,
+    // Pulled out so they are not spread onto the native view (which only takes
+    // per-corner radii); `backgroundColor` is forwarded below as `fillColor` to
+    // avoid colliding with RN's built-in view prop.
+    borderRadius: _borderRadius,
+    borderTopLeftRadius: _btl,
+    borderTopRightRadius: _btr,
+    borderBottomRightRadius: _bbr,
+    borderBottomLeftRadius: _bbl,
+    ...rest
+  } = props;
+  const layers = (0, _react.useMemo)(() => (0, _parseShadow.parseBoxShadow)(shadow), [shadow]);
+  const bleed = (0, _react.useMemo)(() => (0, _parseShadow.computeBleed)(layers), [layers]);
+  const radii = resolveRadii(props);
+  const geometry = {
+    marginLeft: -bleed.left,
+    marginTop: -bleed.top,
+    marginRight: -bleed.right,
+    marginBottom: -bleed.bottom,
+    paddingLeft: bleed.left,
+    paddingTop: bleed.top,
+    paddingRight: bleed.right,
+    paddingBottom: bleed.bottom
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+    style: [styles.outer, style],
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_FigmaShadowViewNativeComponent.default, {
+      ...rest,
+      shadow: shadow,
+      fillColor: backgroundColor,
+      highQuality: highQuality,
+      borderTopLeftRadius: radii.tl,
+      borderTopRightRadius: radii.tr,
+      borderBottomRightRadius: radii.br,
+      borderBottomLeftRadius: radii.bl,
+      bleedLeft: bleed.left,
+      bleedTop: bleed.top,
+      bleedRight: bleed.right,
+      bleedBottom: bleed.bottom,
+      pixelRatio: _reactNative.PixelRatio.get(),
+      style: [styles.native, geometry],
+      children: children
+    })
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  outer: {
+    // The shadow bleeds past this layout box; an ancestor with `overflow:
+    // hidden` will clip it, exactly as it would in CSS.
+    overflow: 'visible'
+  },
+  native: {
+    overflow: 'visible'
+  }
+});
+var _default = exports.default = Shadow;
+//# sourceMappingURL=index.js.map

package/lib/commonjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_FigmaShadowViewNativeComponent","_interopRequireDefault","_parseShadow","_jsxRuntime","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","resolveRadii","props","base","borderRadius","tl","borderTopLeftRadius","tr","borderTopRightRadius","br","borderBottomRightRadius","bl","borderBottomLeftRadius","Shadow","shadow","backgroundColor","highQuality","style","children","_borderRadius","_btl","_btr","_bbr","_bbl","rest","layers","useMemo","parseBoxShadow","bleed","computeBleed","radii","geometry","marginLeft","left","marginTop","top","marginRight","right","marginBottom","bottom","paddingLeft","paddingTop","paddingRight","paddingBottom","jsx","View","styles","outer","fillColor","bleedLeft","bleedTop","bleedRight","bleedBottom","pixelRatio","PixelRatio","native","StyleSheet","create","overflow","_default","exports"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/package.json

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

package/lib/commonjs/parseShadow.js

@@ -0,0 +1,145 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.computeBleed = computeBleed;
+exports.hasVisibleShadow = hasVisibleShadow;
+exports.parseBoxShadow = parseBoxShadow;
+/**
+ * A minimal `box-shadow` parser used on the JS side purely to compute how far
+ * the shadow bleeds past the element box. The authoritative parse (colors,
+ * rendering) happens in the shared C++ core; this only needs geometry.
+ */
+
+// A Gaussian with sigma = blur / 2; 3 sigma (= 1.5 * blur) captures 99.7% of it.
+const BLUR_EXTENT_FACTOR = 1.5;
+function splitTopLevel(input, delimiter) {
+  const out = [];
+  let depth = 0;
+  let current = '';
+  for (const ch of input) {
+    if (ch === '(') {
+      depth++;
+    } else if (ch === ')') {
+      depth = Math.max(0, depth - 1);
+    }
+    if (ch === delimiter && depth === 0) {
+      out.push(current);
+      current = '';
+    } else {
+      current += ch;
+    }
+  }
+  out.push(current);
+  return out;
+}
+function tokenize(layer) {
+  const out = [];
+  let depth = 0;
+  let current = '';
+  for (const ch of layer) {
+    if (ch === '(') {
+      depth++;
+    } else if (ch === ')') {
+      depth = Math.max(0, depth - 1);
+    }
+    if (/\s/.test(ch) && depth === 0) {
+      if (current) {
+        out.push(current);
+        current = '';
+      }
+    } else {
+      current += ch;
+    }
+  }
+  if (current) {
+    out.push(current);
+  }
+  return out;
+}
+function parseLength(token) {
+  const match = /^(-?\d*\.?\d+)(px|dp|dip|pt)?$/i.exec(token.trim());
+  if (!match) {
+    return null;
+  }
+  return parseFloat(match[1]);
+}
+function parseBoxShadow(input) {
+  if (!input) {
+    return [];
+  }
+  let s = input.trim();
+  const colon = s.indexOf(':');
+  if (colon !== -1) {
+    const head = s.slice(0, colon).trim().toLowerCase();
+    if (head === 'box-shadow' || head === 'boxshadow') {
+      s = s.slice(colon + 1).trim();
+    }
+  }
+  if (s.endsWith(';')) {
+    s = s.slice(0, -1).trim();
+  }
+  if (!s || s.toLowerCase() === 'none') {
+    return [];
+  }
+  const layers = [];
+  for (const part of splitTopLevel(s, ',')) {
+    const trimmed = part.trim();
+    if (!trimmed) {
+      continue;
+    }
+    let inset = false;
+    const lengths = [];
+    for (const token of tokenize(trimmed)) {
+      if (token.toLowerCase() === 'inset') {
+        inset = true;
+        continue;
+      }
+      const len = parseLength(token);
+      if (len !== null) {
+        lengths.push(len);
+      }
+      // anything else (a color) is irrelevant to bleed
+    }
+    if (lengths.length < 2) {
+      continue;
+    }
+    layers.push({
+      offsetX: lengths[0],
+      offsetY: lengths[1],
+      blur: Math.max(0, lengths[2] ?? 0),
+      spread: lengths[3] ?? 0,
+      inset
+    });
+  }
+  return layers;
+}
+function computeBleed(layers) {
+  const bleed = {
+    left: 0,
+    top: 0,
+    right: 0,
+    bottom: 0
+  };
+  for (const layer of layers) {
+    if (layer.inset) {
+      continue;
+    }
+    const extent = layer.blur * BLUR_EXTENT_FACTOR + Math.max(0, layer.spread);
+    bleed.right = Math.max(bleed.right, extent + Math.max(0, layer.offsetX));
+    bleed.left = Math.max(bleed.left, extent + Math.max(0, -layer.offsetX));
+    bleed.bottom = Math.max(bleed.bottom, extent + Math.max(0, layer.offsetY));
+    bleed.top = Math.max(bleed.top, extent + Math.max(0, -layer.offsetY));
+  }
+  return {
+    left: Math.ceil(bleed.left),
+    top: Math.ceil(bleed.top),
+    right: Math.ceil(bleed.right),
+    bottom: Math.ceil(bleed.bottom)
+  };
+}
+function hasVisibleShadow(layers) {
+  return layers.length > 0;
+}
+//# sourceMappingURL=parseShadow.js.map

package/lib/commonjs/parseShadow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BLUR_EXTENT_FACTOR","splitTopLevel","input","delimiter","out","depth","current","ch","Math","max","push","tokenize","layer","test","parseLength","token","match","exec","trim","parseFloat","parseBoxShadow","s","colon","indexOf","head","slice","toLowerCase","endsWith","layers","part","trimmed","inset","lengths","len","length","offsetX","offsetY","blur","spread","computeBleed","bleed","left","top","right","bottom","extent","ceil","hasVisibleShadow"],"sourceRoot":"../../src","sources":["parseShadow.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/FigmaShadowViewNativeComponent.js

@@ -0,0 +1,5 @@
+"use strict";
+
+import codegenNativeComponent from 'react-native/Libraries/Utilities/codegenNativeComponent';
+export default codegenNativeComponent('FigmaShadowView');
+//# sourceMappingURL=FigmaShadowViewNativeComponent.js.map

package/lib/module/FigmaShadowViewNativeComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["codegenNativeComponent"],"sourceRoot":"../../src","sources":["FigmaShadowViewNativeComponent.ts"],"mappings":";;AAEA,OAAOA,sBAAsB,MAAM,yDAAyD;AA2B5F,eAAeA,sBAAsB,CAAc,iBAAiB,CAAC","ignoreList":[]}

package/lib/module/index.js

@@ -0,0 +1,88 @@
+"use strict";
+
+import React, { useMemo } from 'react';
+import { PixelRatio, StyleSheet, View } from 'react-native';
+import FigmaShadowView from './FigmaShadowViewNativeComponent';
+import { computeBleed, parseBoxShadow } from './parseShadow';
+import { jsx as _jsx } from "react/jsx-runtime";
+export { parseBoxShadow, computeBleed } from './parseShadow';
+function resolveRadii(props) {
+  const base = props.borderRadius ?? 0;
+  return {
+    tl: props.borderTopLeftRadius ?? base,
+    tr: props.borderTopRightRadius ?? base,
+    br: props.borderBottomRightRadius ?? base,
+    bl: props.borderBottomLeftRadius ?? base
+  };
+}
+
+/**
+ * Wraps its children and paints a pixel-consistent CSS-style shadow behind them
+ * on both platforms.
+ *
+ * Layout is neutral: the shadow bleeds into space the component reserves with
+ * negative margins, so siblings are laid out as if only the children were there.
+ */
+export function Shadow(props) {
+  const {
+    shadow = '',
+    backgroundColor,
+    highQuality = false,
+    style,
+    children,
+    // Pulled out so they are not spread onto the native view (which only takes
+    // per-corner radii); `backgroundColor` is forwarded below as `fillColor` to
+    // avoid colliding with RN's built-in view prop.
+    borderRadius: _borderRadius,
+    borderTopLeftRadius: _btl,
+    borderTopRightRadius: _btr,
+    borderBottomRightRadius: _bbr,
+    borderBottomLeftRadius: _bbl,
+    ...rest
+  } = props;
+  const layers = useMemo(() => parseBoxShadow(shadow), [shadow]);
+  const bleed = useMemo(() => computeBleed(layers), [layers]);
+  const radii = resolveRadii(props);
+  const geometry = {
+    marginLeft: -bleed.left,
+    marginTop: -bleed.top,
+    marginRight: -bleed.right,
+    marginBottom: -bleed.bottom,
+    paddingLeft: bleed.left,
+    paddingTop: bleed.top,
+    paddingRight: bleed.right,
+    paddingBottom: bleed.bottom
+  };
+  return /*#__PURE__*/_jsx(View, {
+    style: [styles.outer, style],
+    children: /*#__PURE__*/_jsx(FigmaShadowView, {
+      ...rest,
+      shadow: shadow,
+      fillColor: backgroundColor,
+      highQuality: highQuality,
+      borderTopLeftRadius: radii.tl,
+      borderTopRightRadius: radii.tr,
+      borderBottomRightRadius: radii.br,
+      borderBottomLeftRadius: radii.bl,
+      bleedLeft: bleed.left,
+      bleedTop: bleed.top,
+      bleedRight: bleed.right,
+      bleedBottom: bleed.bottom,
+      pixelRatio: PixelRatio.get(),
+      style: [styles.native, geometry],
+      children: children
+    })
+  });
+}
+const styles = StyleSheet.create({
+  outer: {
+    // The shadow bleeds past this layout box; an ancestor with `overflow:
+    // hidden` will clip it, exactly as it would in CSS.
+    overflow: 'visible'
+  },
+  native: {
+    overflow: 'visible'
+  }
+});
+export default Shadow;
+//# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","PixelRatio","StyleSheet","View","FigmaShadowView","computeBleed","parseBoxShadow","jsx","_jsx","resolveRadii","props","base","borderRadius","tl","borderTopLeftRadius","tr","borderTopRightRadius","br","borderBottomRightRadius","bl","borderBottomLeftRadius","Shadow","shadow","backgroundColor","highQuality","style","children","_borderRadius","_btl","_btr","_bbr","_bbl","rest","layers","bleed","radii","geometry","marginLeft","left","marginTop","top","marginRight","right","marginBottom","bottom","paddingLeft","paddingTop","paddingRight","paddingBottom","styles","outer","fillColor","bleedLeft","bleedTop","bleedRight","bleedBottom","pixelRatio","get","native","create","overflow"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/package.json

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

package/lib/module/parseShadow.js

@@ -0,0 +1,139 @@
+"use strict";
+
+/**
+ * A minimal `box-shadow` parser used on the JS side purely to compute how far
+ * the shadow bleeds past the element box. The authoritative parse (colors,
+ * rendering) happens in the shared C++ core; this only needs geometry.
+ */
+
+// A Gaussian with sigma = blur / 2; 3 sigma (= 1.5 * blur) captures 99.7% of it.
+const BLUR_EXTENT_FACTOR = 1.5;
+function splitTopLevel(input, delimiter) {
+  const out = [];
+  let depth = 0;
+  let current = '';
+  for (const ch of input) {
+    if (ch === '(') {
+      depth++;
+    } else if (ch === ')') {
+      depth = Math.max(0, depth - 1);
+    }
+    if (ch === delimiter && depth === 0) {
+      out.push(current);
+      current = '';
+    } else {
+      current += ch;
+    }
+  }
+  out.push(current);
+  return out;
+}
+function tokenize(layer) {
+  const out = [];
+  let depth = 0;
+  let current = '';
+  for (const ch of layer) {
+    if (ch === '(') {
+      depth++;
+    } else if (ch === ')') {
+      depth = Math.max(0, depth - 1);
+    }
+    if (/\s/.test(ch) && depth === 0) {
+      if (current) {
+        out.push(current);
+        current = '';
+      }
+    } else {
+      current += ch;
+    }
+  }
+  if (current) {
+    out.push(current);
+  }
+  return out;
+}
+function parseLength(token) {
+  const match = /^(-?\d*\.?\d+)(px|dp|dip|pt)?$/i.exec(token.trim());
+  if (!match) {
+    return null;
+  }
+  return parseFloat(match[1]);
+}
+export function parseBoxShadow(input) {
+  if (!input) {
+    return [];
+  }
+  let s = input.trim();
+  const colon = s.indexOf(':');
+  if (colon !== -1) {
+    const head = s.slice(0, colon).trim().toLowerCase();
+    if (head === 'box-shadow' || head === 'boxshadow') {
+      s = s.slice(colon + 1).trim();
+    }
+  }
+  if (s.endsWith(';')) {
+    s = s.slice(0, -1).trim();
+  }
+  if (!s || s.toLowerCase() === 'none') {
+    return [];
+  }
+  const layers = [];
+  for (const part of splitTopLevel(s, ',')) {
+    const trimmed = part.trim();
+    if (!trimmed) {
+      continue;
+    }
+    let inset = false;
+    const lengths = [];
+    for (const token of tokenize(trimmed)) {
+      if (token.toLowerCase() === 'inset') {
+        inset = true;
+        continue;
+      }
+      const len = parseLength(token);
+      if (len !== null) {
+        lengths.push(len);
+      }
+      // anything else (a color) is irrelevant to bleed
+    }
+    if (lengths.length < 2) {
+      continue;
+    }
+    layers.push({
+      offsetX: lengths[0],
+      offsetY: lengths[1],
+      blur: Math.max(0, lengths[2] ?? 0),
+      spread: lengths[3] ?? 0,
+      inset
+    });
+  }
+  return layers;
+}
+export function computeBleed(layers) {
+  const bleed = {
+    left: 0,
+    top: 0,
+    right: 0,
+    bottom: 0
+  };
+  for (const layer of layers) {
+    if (layer.inset) {
+      continue;
+    }
+    const extent = layer.blur * BLUR_EXTENT_FACTOR + Math.max(0, layer.spread);
+    bleed.right = Math.max(bleed.right, extent + Math.max(0, layer.offsetX));
+    bleed.left = Math.max(bleed.left, extent + Math.max(0, -layer.offsetX));
+    bleed.bottom = Math.max(bleed.bottom, extent + Math.max(0, layer.offsetY));
+    bleed.top = Math.max(bleed.top, extent + Math.max(0, -layer.offsetY));
+  }
+  return {
+    left: Math.ceil(bleed.left),
+    top: Math.ceil(bleed.top),
+    right: Math.ceil(bleed.right),
+    bottom: Math.ceil(bleed.bottom)
+  };
+}
+export function hasVisibleShadow(layers) {
+  return layers.length > 0;
+}
+//# sourceMappingURL=parseShadow.js.map

package/lib/module/parseShadow.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BLUR_EXTENT_FACTOR","splitTopLevel","input","delimiter","out","depth","current","ch","Math","max","push","tokenize","layer","test","parseLength","token","match","exec","trim","parseFloat","parseBoxShadow","s","colon","indexOf","head","slice","toLowerCase","endsWith","layers","part","trimmed","inset","lengths","len","length","offsetX","offsetY","blur","spread","computeBleed","bleed","left","top","right","bottom","extent","ceil","hasVisibleShadow"],"sourceRoot":"../../src","sources":["parseShadow.ts"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,24 @@
+import type { ViewProps } from 'react-native';
+import type { Float, WithDefault } from 'react-native/Libraries/Types/CodegenTypes';
+export interface NativeProps extends ViewProps {
+    /** A CSS `box-shadow` value, exactly as copied from Figma / a stylesheet. */
+    shadow?: string;
+    /** Optional fill painted inside the content box, below inset shadows. */
+    fillColor?: string;
+    borderTopLeftRadius?: WithDefault<Float, 0>;
+    borderTopRightRadius?: WithDefault<Float, 0>;
+    borderBottomRightRadius?: WithDefault<Float, 0>;
+    borderBottomLeftRadius?: WithDefault<Float, 0>;
+    /** Bleed insets (device-independent px) computed on the JS side. */
+    bleedLeft?: WithDefault<Float, 0>;
+    bleedTop?: WithDefault<Float, 0>;
+    bleedRight?: WithDefault<Float, 0>;
+    bleedBottom?: WithDefault<Float, 0>;
+    /** `PixelRatio.get()` — passed so the raster matches the screen density. */
+    pixelRatio?: WithDefault<Float, 1>;
+    /** Use the slower, exact rounded-corner quadrature. */
+    highQuality?: WithDefault<boolean, false>;
+}
+declare const _default: import("react-native/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
+export default _default;
+//# sourceMappingURL=FigmaShadowViewNativeComponent.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FigmaShadowViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/FigmaShadowViewNativeComponent.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,2CAA2C,CAAC;AAGpF,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,6EAA6E;IAC7E,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,mBAAmB,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAC5C,oBAAoB,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAC7C,uBAAuB,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAChD,sBAAsB,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAE/C,oEAAoE;IACpE,SAAS,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IACjC,UAAU,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IACnC,WAAW,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAEpC,4EAA4E;IAC5E,UAAU,CAAC,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IAEnC,uDAAuD;IACvD,WAAW,CAAC,EAAE,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;CAC3C;;AAED,wBAAsE"}

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

@@ -0,0 +1,40 @@
+import React from 'react';
+import { type StyleProp, type ViewProps, type ViewStyle } from 'react-native';
+export type { EdgeInsets, ParsedShadowLayer } from './parseShadow';
+export { parseBoxShadow, computeBleed } from './parseShadow';
+export interface ShadowProps extends Omit<ViewProps, 'style'> {
+    /**
+     * A CSS `box-shadow` value — the exact string Figma's "Copy as CSS" produces,
+     * or what you already use on the web. Supports multiple comma-separated
+     * shadows, `inset`, spread, and any CSS color. Renders identically on iOS and
+     * Android.
+     */
+    shadow?: string;
+    /** Uniform corner radius for the shadow shape. Match your child's radius. */
+    borderRadius?: number;
+    borderTopLeftRadius?: number;
+    borderTopRightRadius?: number;
+    borderBottomRightRadius?: number;
+    borderBottomLeftRadius?: number;
+    /**
+     * Fill painted inside the content box, below any inset shadow and below the
+     * children. Use this (instead of a background on the child) when you want an
+     * inset shadow to sit above the fill, like CSS.
+     */
+    backgroundColor?: string;
+    /** Opt into the slower, exact rounded-corner convolution. */
+    highQuality?: boolean;
+    /** Applied to the outer layout box. */
+    style?: StyleProp<ViewStyle>;
+    children?: React.ReactNode;
+}
+/**
+ * Wraps its children and paints a pixel-consistent CSS-style shadow behind them
+ * on both platforms.
+ *
+ * Layout is neutral: the shadow bleeds into space the component reserves with
+ * negative margins, so siblings are laid out as if only the children were there.
+ */
+export declare function Shadow(props: ShadowProps): React.JSX.Element;
+export default Shadow;
+//# 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,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,cAAc,CAAC;AAKtB,YAAY,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7D,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC;IAC3D;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB,6DAA6D;IAC7D,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,uCAAuC;IACvC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAE7B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAYD;;;;;;GAMG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,qBAuDxC;AAaD,eAAe,MAAM,CAAC"}

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

@@ -0,0 +1,22 @@
+/**
+ * A minimal `box-shadow` parser used on the JS side purely to compute how far
+ * the shadow bleeds past the element box. The authoritative parse (colors,
+ * rendering) happens in the shared C++ core; this only needs geometry.
+ */
+export interface ParsedShadowLayer {
+    offsetX: number;
+    offsetY: number;
+    blur: number;
+    spread: number;
+    inset: boolean;
+}
+export interface EdgeInsets {
+    left: number;
+    top: number;
+    right: number;
+    bottom: number;
+}
+export declare function parseBoxShadow(input: string | undefined | null): ParsedShadowLayer[];
+export declare function computeBleed(layers: ParsedShadowLayer[]): EdgeInsets;
+export declare function hasVisibleShadow(layers: ParsedShadowLayer[]): boolean;
+//# sourceMappingURL=parseShadow.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"parseShadow.d.ts","sourceRoot":"","sources":["../../../src/parseShadow.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAmDD,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,iBAAiB,EAAE,CAuCpF;AAED,wBAAgB,YAAY,CAAC,MAAM,EAAE,iBAAiB,EAAE,GAAG,UAAU,CAkBpE;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,iBAAiB,EAAE,GAAG,OAAO,CAErE"}