"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.sizes = void 0;
exports.useCommonSVGProps = useCommonSVGProps;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _reactNativeSvg = require("react-native-svg");
var _useTheme = require("../theme/use-theme.js");
var _tokens = require("../styles/tokens.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/**
 * Style prop for Bloom icons. Icons render via `<Svg>`, which is a View-like
 * host, so the style must be View-compatible. A `color` field is allowed as a
 * convenience for consumers who set fill via the CSS `color` shorthand (the
 * icon reads this as a fallback fill when no explicit `fill` prop is given).
 *
 * Note: we intentionally avoid `TextStyle` here — React Native 0.84 introduced
 * `cursor: CursorValue` on `ViewStyle` while `expo/types/react-native-web`
 * augments `TextStyle.cursor` to `string`, and the resulting invariance
 * breaks assignment of `StyleProp<TextStyle>` to `<Svg>`'s style slot.
 */

const sizes = exports.sizes = {
  '2xs': 8,
  xs: 12,
  sm: 16,
  md: 20,
  lg: 24,
  xl: 28,
  '2xl': 32,
  '3xl': 48
};
function useCommonSVGProps(props) {
  const {
    colors
  } = (0, _useTheme.useTheme)();
  const reactId = _react.default.useId();
  const {
    fill,
    size,
    gradient,
    ...rest
  } = props;
  const style = _reactNative.StyleSheet.flatten(rest.style);
  const _size = Number(size ? sizes[size] : rest.width || sizes.md);
  let _fill = fill ?? style?.color ?? colors.primary;
  let gradientDef = null;
  if (gradient && _tokens.gradients[gradient]) {
    const id = `${reactId}-${gradient}`;
    const config = _tokens.gradients[gradient];
    _fill = `url(#${id})`;
    gradientDef = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Defs, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.LinearGradient, {
        id: id,
        x1: "0",
        y1: "0",
        x2: "100%",
        y2: "0",
        gradientTransform: "rotate(45)",
        children: config.values.map(([stop, fillColor]) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNativeSvg.Stop, {
          offset: String(stop),
          stopColor: fillColor
        }, String(stop)))
      })
    });
  }
  return {
    fill: _fill,
    size: _size,
    style,
    gradient: gradientDef,
    ...rest
  };
}
//# sourceMappingURL=common.js.map