{"version":3,"sources":["../src/image/index.native.tsx"],"names":["forwardRef","Image","useTheme","useState","radiusTokens","jsx","View","RNImage"],"mappings":";;;;;;;;;AAuBO,IAAM,QAAQA,gBAAA,CAAgC,SAASC,MAAAA,CAC5D,EAAE,KAAK,GAAA,EAAK,KAAA,EAAO,MAAA,EAAQ,WAAA,EAAa,MAAM,OAAA,EAAS,MAAA,EAAQ,QAAA,EAAU,KAAA,IACzE,GAAA,EACA;AACA,EAAA,MAAM,EAAE,MAAA,EAAO,GAAIC,eAAA,EAAS;AAC5B,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,eAAyC,SAAS,CAAA;AAC5E,EAAA,MAAM,WAAA,GACJ,OAAO,MAAA,KAAW,QAAA,GAAW,SAAS,MAAA,GAASC,WAAA,CAAa,MAAM,CAAA,GAAI,MAAA;AAExE,EAAA,MAAM,cAAA,GAA4B;AAAA,IAChC,KAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,YAAA,EAAc,WAAA;AAAA,IACd,QAAA,EAAU,QAAA;AAAA,IACV,eAAA,EAAiB,KAAA,KAAU,SAAA,GAAY,MAAA,CAAO,aAAA,GAAgB;AAAA,GAChE;AAEA,EAAA,IAAI,KAAA,KAAU,WAAW,QAAA,EAAU;AACjC,IAAA,uBAAOC,cAAA,CAACC,gBAAA,EAAA,EAAK,KAAA,EAAO,cAAA,EAAiB,QAAA,EAAA,QAAA,EAAS,CAAA;AAAA,EAChD;AAEA,EAAA,uBACED,cAAA,CAACC,gBAAA,EAAA,EAAK,KAAA,EAAO,cAAA,EACX,QAAA,kBAAAD,cAAA;AAAA,IAACE,iBAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,MAAA,EAAQ,EAAE,GAAA,EAAK,GAAA,EAAI;AAAA,MACnB,kBAAA,EAAoB,GAAA;AAAA,MACpB,UAAA,EAAY,GAAA;AAAA,MACZ,MAAA,EAAQ,MAAM,QAAA,CAAS,QAAQ,CAAA;AAAA,MAC/B,OAAA,EAAS,MAAM,QAAA,CAAS,OAAO,CAAA;AAAA,MAC/B,KAAA,EAAO,EAAE,KAAA,EAAO,MAAA,EAAQ,MAAA,EAAQ,MAAA,EAAQ,OAAA,EAAS,KAAA,KAAU,QAAA,GAAW,CAAA,GAAI,CAAA,EAAG,GAAG,KAAA;AAAM;AAAA,GACxF,EACF,CAAA;AAEJ,CAAC","file":"image.native.cjs","sourcesContent":["/**\n * Image (native). RN <Image> with the same prop shape as web.\n */\nimport { forwardRef, useState } from \"react\";\nimport { Image as RNImage, View, type ImageProps as RNImageProps, type ImageStyle, type ViewStyle } from \"react-native\";\nimport { useTheme } from \"@plyxui/styles\";\nimport { radius as radiusTokens, type RadiusKey } from \"@plyxui/core\";\n\nexport type ImageFit = \"cover\" | \"contain\" | \"stretch\" | \"center\";\n\nexport interface ImageProps {\n  src: string;\n  alt: string;\n  width?: number;\n  height?: number;\n  aspectRatio?: number;\n  fit?: ImageFit;\n  radius?: RadiusKey | number;\n  placeholder?: React.ReactNode;\n  fallback?: React.ReactNode;\n  style?: ImageStyle;\n}\n\nexport const Image = forwardRef<RNImage, ImageProps>(function Image(\n  { src, alt, width, height, aspectRatio, fit = \"cover\", radius, fallback, style },\n  ref,\n) {\n  const { colors } = useTheme();\n  const [state, setState] = useState<\"loading\" | \"loaded\" | \"error\">(\"loading\");\n  const radiusValue =\n    typeof radius === \"number\" ? radius : radius ? radiusTokens[radius] : undefined;\n\n  const containerStyle: ViewStyle = {\n    width,\n    height,\n    aspectRatio,\n    borderRadius: radiusValue,\n    overflow: \"hidden\",\n    backgroundColor: state === \"loading\" ? colors.containerFill : undefined,\n  };\n\n  if (state === \"error\" && fallback) {\n    return <View style={containerStyle}>{fallback}</View>;\n  }\n\n  return (\n    <View style={containerStyle}>\n      <RNImage\n        ref={ref}\n        source={{ uri: src }}\n        accessibilityLabel={alt}\n        resizeMode={fit as RNImageProps[\"resizeMode\"]}\n        onLoad={() => setState(\"loaded\")}\n        onError={() => setState(\"error\")}\n        style={{ width: \"100%\", height: \"100%\", opacity: state === \"loaded\" ? 1 : 0, ...style }}\n      />\n    </View>\n  );\n});\n"]}