@amityco/react-native-social-uikit 4.1.0 → 4.1.1-11cdc854.0

package/lib/commonjs/social/elements/PostMediaElement/PostMediaElement.js

@@ -0,0 +1,280 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PostMediaElement = PostMediaElement;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _reactNativeSvg = require("react-native-svg");
+var _Typography = require("../../../core/components/Typography/Typography");
+var _useAuth = _interopRequireDefault(require("../../../core/hooks/useAuth"));
+var _xml = require("../../../core/assets/icons/xml");
+var _getFrameRatio = require("../../utils/getFrameRatio");
+var _getIndicatorConfig = require("../../utils/getIndicatorConfig");
+var _styles = require("./styles");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function isMediaPost(post) {
+  return post.dataType === 'image' || post.dataType === 'video';
+}
+function getAttachmentRatio(post) {
+  if (!post) return _getFrameRatio.DEFAULT_FRAME_RATIO;
+  if (post.dataType === 'image') {
+    const image = post.getImageInfo();
+    return (0, _getFrameRatio.getFrameRatio)(image === null || image === void 0 ? void 0 : image.getWidth(), image === null || image === void 0 ? void 0 : image.getHeight());
+  }
+  const video = post.getVideoInfo();
+  const {
+    width,
+    height
+  } = (0, _getFrameRatio.getVideoDisplayDims)({
+    width: video === null || video === void 0 ? void 0 : video.getWidth(),
+    height: video === null || video === void 0 ? void 0 : video.getHeight(),
+    rotation: video === null || video === void 0 ? void 0 : video.getRotation()
+  });
+  return (0, _getFrameRatio.getFrameRatio)(width, height);
+}
+function PostMediaElement({
+  posts,
+  onImageClick,
+  onVideoClick,
+  controlsRef,
+  loading = false
+}) {
+  const styles = (0, _styles.useStyles)();
+  const {
+    width: screenWidth
+  } = (0, _reactNative.useWindowDimensions)();
+  const [current, setCurrent] = (0, _react.useState)(0);
+  const [trackWidth, setTrackWidth] = (0, _react.useState)(0);
+  const scrollRef = (0, _react.useRef)(null);
+  const mediaPosts = (0, _react.useMemo)(() => (posts ?? []).filter(isMediaPost), [posts]);
+  const ratio = (0, _react.useMemo)(() => getAttachmentRatio(mediaPosts[0]), [mediaPosts]);
+  if (mediaPosts.length === 0) {
+    if (!loading) return null;
+    // Loading placeholder: a full-bleed frame in the base-shade4 colour, so the
+    // media area doesn't flash blank before the child posts resolve.
+    return /*#__PURE__*/React.createElement(_reactNative.View, {
+      style: styles.postMedia
+    }, /*#__PURE__*/React.createElement(_reactNative.View, {
+      style: styles.postMedia__track
+    }, /*#__PURE__*/React.createElement(_reactNative.View, {
+      style: [styles.postMedia__frame, {
+        aspectRatio: _getFrameRatio.FRAME_RATIO_VALUE[_getFrameRatio.DEFAULT_FRAME_RATIO]
+      }]
+    })));
+  }
+  const total = mediaPosts.length;
+  const isCarousel = total > 1;
+  const aspectRatio = _getFrameRatio.FRAME_RATIO_VALUE[ratio];
+  // The carousel is full-bleed (screen width); use that immediately so the
+  // ScrollView renders without waiting for onLayout — otherwise there is an
+  // empty block between the placeholder and the first frame.
+  const slideWidth = trackWidth || screenWidth;
+  const handleFrameClick = index => {
+    const post = mediaPosts[index];
+    if (post.dataType === 'image') onImageClick(index);else onVideoClick(index);
+  };
+  const onLayout = event => {
+    const width = event.nativeEvent.layout.width;
+    if (width && width !== trackWidth) setTrackWidth(width);
+  };
+  const onMomentumScrollEnd = event => {
+    if (!slideWidth) return;
+    const nextIndex = Math.round(event.nativeEvent.contentOffset.x / slideWidth);
+    if (nextIndex !== current) setCurrent(nextIndex);
+  };
+  if (controlsRef) {
+    controlsRef.current = {
+      slideTo: index => {
+        var _scrollRef$current;
+        (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 || _scrollRef$current.scrollTo({
+          x: index * slideWidth,
+          animated: false
+        });
+        setCurrent(index);
+      }
+    };
+  }
+  if (!isCarousel) {
+    return /*#__PURE__*/React.createElement(_reactNative.View, {
+      style: styles.postMedia
+    }, /*#__PURE__*/React.createElement(_reactNative.View, {
+      style: styles.postMedia__track,
+      onLayout: onLayout
+    }, /*#__PURE__*/React.createElement(MediaFrame, {
+      post: mediaPosts[0],
+      aspectRatio: aspectRatio,
+      onPress: () => handleFrameClick(0)
+    })));
+  }
+  return /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia
+  }, /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia__track,
+    onLayout: onLayout
+  }, /*#__PURE__*/React.createElement(_reactNative.ScrollView, {
+    ref: scrollRef,
+    horizontal: true,
+    pagingEnabled: true,
+    showsHorizontalScrollIndicator: false,
+    onMomentumScrollEnd: onMomentumScrollEnd,
+    scrollEventThrottle: 16,
+    decelerationRate: "fast"
+  }, mediaPosts.map((post, index) => /*#__PURE__*/React.createElement(_reactNative.View, {
+    key: post.postId,
+    style: [styles.postMedia__slide, {
+      width: slideWidth
+    }]
+  }, /*#__PURE__*/React.createElement(MediaFrame, {
+    post: post,
+    aspectRatio: aspectRatio,
+    onPress: () => handleFrameClick(index)
+  })))), /*#__PURE__*/React.createElement(PositionCounter, {
+    current: current,
+    total: total
+  })), /*#__PURE__*/React.createElement(PaginationIndicator, {
+    current: current,
+    total: total
+  }));
+}
+function PaginationIndicator({
+  current,
+  total
+}) {
+  const styles = (0, _styles.useStyles)();
+  const {
+    dots
+  } = (0, _getIndicatorConfig.getIndicatorConfig)(current, total);
+  return /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia__indicator
+  }, dots.map(dot => dot.state === 'edge' ? /*#__PURE__*/React.createElement(EdgeDot, {
+    key: dot.key,
+    side: dot.side
+  }) : /*#__PURE__*/React.createElement(_reactNative.View, {
+    key: dot.key,
+    style: styles.postMedia__dotSlot
+  }, /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: [styles.postMedia__dot, dot.state === 'active' ? styles.postMedia__dotActive : styles.postMedia__dotInactive]
+  }))));
+}
+
+// The strip keeps a constant width (fixed-width slots, always 6 elements), so
+// an edge dot only needs to slide in from its own side over 300ms when it
+// first appears (REQ-013b).
+function EdgeDot({
+  side
+}) {
+  const styles = (0, _styles.useStyles)();
+  const anim = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
+  (0, _react.useEffect)(() => {
+    const animation = _reactNative.Animated.timing(anim, {
+      toValue: 1,
+      duration: 300,
+      useNativeDriver: true
+    });
+    animation.start();
+    return () => animation.stop();
+  }, [anim]);
+  const translateX = anim.interpolate({
+    inputRange: [0, 1],
+    outputRange: [side === 'left' ? -6 : 6, 0]
+  });
+  return /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia__dotSlot
+  }, /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
+    style: [styles.postMedia__dot, styles.postMedia__dotEdge, {
+      opacity: anim,
+      transform: [{
+        translateX
+      }]
+    }]
+  }));
+}
+function PositionCounter({
+  current,
+  total
+}) {
+  const styles = (0, _styles.useStyles)();
+  return /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia__counter
+  }, /*#__PURE__*/React.createElement(_Typography.Typography.Body, {
+    style: styles.postMedia__counterLabel
+  }, current + 1, "/", total));
+}
+function MediaFrame({
+  post,
+  aspectRatio,
+  onPress
+}) {
+  const styles = (0, _styles.useStyles)();
+  return /*#__PURE__*/React.createElement(_reactNative.Pressable, {
+    onPress: onPress,
+    style: [styles.postMedia__frame, {
+      aspectRatio
+    }]
+  }, post.dataType === 'image' ? /*#__PURE__*/React.createElement(ImageMedia, {
+    post: post
+  }) : /*#__PURE__*/React.createElement(VideoMedia, {
+    post: post
+  }));
+}
+function ImageMedia({
+  post
+}) {
+  var _post$getImageInfo;
+  const styles = (0, _styles.useStyles)();
+  const {
+    apiRegion
+  } = (0, _useAuth.default)();
+  const [isBroken, setIsBroken] = (0, _react.useState)(false);
+  const fileId = (_post$getImageInfo = post.getImageInfo()) === null || _post$getImageInfo === void 0 ? void 0 : _post$getImageInfo.fileId;
+  const url = fileId ? `https://api.${apiRegion}.amity.co/api/v3/files/${fileId}/download?size=large` : undefined;
+  if (!url || isBroken) return /*#__PURE__*/React.createElement(BrokenFrame, null);
+  return /*#__PURE__*/React.createElement(_reactNative.Image, {
+    style: styles.postMedia__media,
+    source: {
+      uri: url
+    },
+    resizeMode: "cover",
+    onError: () => setIsBroken(true)
+  });
+}
+function VideoMedia({
+  post
+}) {
+  const styles = (0, _styles.useStyles)();
+  const {
+    apiRegion
+  } = (0, _useAuth.default)();
+  const [isBroken, setIsBroken] = (0, _react.useState)(false);
+  const data = post.data;
+  const thumbnailFileId = data === null || data === void 0 ? void 0 : data.thumbnailFileId;
+  const url = thumbnailFileId ? `https://api.${apiRegion}.amity.co/api/v3/files/${thumbnailFileId}/download?size=large` : undefined;
+  if (!url || isBroken) return /*#__PURE__*/React.createElement(BrokenFrame, null);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_reactNative.Image, {
+    style: styles.postMedia__media,
+    source: {
+      uri: url
+    },
+    resizeMode: "cover",
+    onError: () => setIsBroken(true)
+  }), /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia__playButton
+  }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgXml, {
+    xml: _xml.videoControlIcon,
+    width: "40",
+    height: "40"
+  })));
+}
+function BrokenFrame() {
+  const styles = (0, _styles.useStyles)();
+  return /*#__PURE__*/React.createElement(_reactNative.View, {
+    style: styles.postMedia__broken
+  }, /*#__PURE__*/React.createElement(_reactNativeSvg.SvgXml, {
+    xml: (0, _xml.brokenImageIcon)(),
+    width: 32,
+    height: 32
+  }));
+}
+//# sourceMappingURL=PostMediaElement.js.map

package/lib/commonjs/social/elements/PostMediaElement/PostMediaElement.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_reactNative","_reactNativeSvg","_Typography","_useAuth","_interopRequireDefault","_xml","_getFrameRatio","_getIndicatorConfig","_styles","e","__esModule","default","isMediaPost","post","dataType","getAttachmentRatio","DEFAULT_FRAME_RATIO","image","getImageInfo","getFrameRatio","getWidth","getHeight","video","getVideoInfo","width","height","getVideoDisplayDims","rotation","getRotation","PostMediaElement","posts","onImageClick","onVideoClick","controlsRef","loading","styles","useStyles","screenWidth","useWindowDimensions","current","setCurrent","useState","trackWidth","setTrackWidth","scrollRef","useRef","mediaPosts","useMemo","filter","ratio","length","React","createElement","View","style","postMedia","postMedia__track","postMedia__frame","aspectRatio","FRAME_RATIO_VALUE","total","isCarousel","slideWidth","handleFrameClick","index","onLayout","event","nativeEvent","layout","onMomentumScrollEnd","nextIndex","Math","round","contentOffset","x","slideTo","_scrollRef$current","scrollTo","animated","MediaFrame","onPress","ScrollView","ref","horizontal","pagingEnabled","showsHorizontalScrollIndicator","scrollEventThrottle","decelerationRate","map","key","postId","postMedia__slide","PositionCounter","PaginationIndicator","dots","getIndicatorConfig","postMedia__indicator","dot","state","EdgeDot","side","postMedia__dotSlot","postMedia__dot","postMedia__dotActive","postMedia__dotInactive","anim","Animated","Value","useEffect","animation","timing","toValue","duration","useNativeDriver","start","stop","translateX","interpolate","inputRange","outputRange","postMedia__dotEdge","opacity","transform","postMedia__counter","Typography","Body","postMedia__counterLabel","Pressable","ImageMedia","VideoMedia","_post$getImageInfo","apiRegion","useAuth","isBroken","setIsBroken","fileId","url","undefined","BrokenFrame","Image","postMedia__media","source","uri","resizeMode","onError","data","thumbnailFileId","Fragment","postMedia__playButton","SvgXml","xml","videoControlIcon","postMedia__broken","brokenImageIcon"],"sourceRoot":"../../../../../src","sources":["social/elements/PostMediaElement/PostMediaElement.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/social/elements/PostMediaElement/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "PostMediaElement", {
+  enumerable: true,
+  get: function () {
+    return _PostMediaElement.PostMediaElement;
+  }
+});
+var _PostMediaElement = require("./PostMediaElement");
+//# sourceMappingURL=index.js.map

package/lib/commonjs/social/elements/PostMediaElement/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_PostMediaElement","require"],"sourceRoot":"../../../../../src","sources":["social/elements/PostMediaElement/index.tsx"],"mappings":";;;;;;;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/commonjs/social/elements/PostMediaElement/styles.js

@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useStyles = void 0;
+var _reactNative = require("react-native");
+var _reactNativePaper = require("react-native-paper");
+// Values map 1:1 from web PR #1830 PostMediaElement.module.css (1rem = 16dp).
+// Colors resolve through theme tokens (web CSS variables), never hardcoded.
+const useStyles = () => {
+  const theme = (0, _reactNativePaper.useTheme)();
+  const styles = _reactNative.StyleSheet.create({
+    postMedia: {
+      // Full-bleed: cancel the post card's 16px horizontal padding so the media
+      // spans the full card width (web PR #1830/#1834: width calc(100% + 2rem),
+      // margin-left/right -1rem).
+      marginHorizontal: -16,
+      paddingVertical: 8 // web: padding 0.5rem 0
+    },
+    postMedia__track: {
+      position: 'relative',
+      width: '100%'
+    },
+    postMedia__slide: {
+      // width is set dynamically to the measured track width so paging aligns
+    },
+    postMedia__frame: {
+      width: '100%',
+      overflow: 'hidden',
+      // web: no border-radius; background var(--asc-color-base-shade4)
+      backgroundColor: theme.colors.baseShade4
+    },
+    postMedia__media: {
+      width: '100%',
+      height: '100%'
+    },
+    postMedia__playButton: {
+      position: 'absolute',
+      top: '50%',
+      left: '50%',
+      // web: 2.5rem (40dp), centred via translate(-50%, -50%)
+      width: 40,
+      height: 40,
+      transform: [{
+        translateX: -20
+      }, {
+        translateY: -20
+      }],
+      zIndex: 1
+    },
+    postMedia__broken: {
+      flex: 1,
+      alignItems: 'center',
+      justifyContent: 'center',
+      backgroundColor: theme.colors.baseShade4
+    },
+    postMedia__counter: {
+      position: 'absolute',
+      top: 8,
+      // web: 0.5rem
+      right: 8,
+      // web: 0.5rem
+      alignItems: 'center',
+      justifyContent: 'center',
+      paddingVertical: 6,
+      // web: 0.375rem
+      paddingHorizontal: 12,
+      // web: 0.75rem
+      borderRadius: 999,
+      // web: --asc-border-radius-full
+      backgroundColor: 'rgba(0,0,0,0.5)' // web: --asc-color-transparent-black (#00000080)
+    },
+    postMedia__counterLabel: {
+      color: '#FFFFFF' // web: var(--asc-color-white)
+    },
+    postMedia__indicator: {
+      flexDirection: 'row',
+      alignItems: 'center',
+      justifyContent: 'center',
+      gap: 4,
+      // web: gap 0.25rem
+      height: 6,
+      // web: height 0.375rem
+      marginTop: 12 // web: parent .postMedia column gap 0.75rem
+    },
+    postMedia__dotSlot: {
+      alignItems: 'center',
+      justifyContent: 'center',
+      width: 6,
+      // web: 0.375rem
+      height: 6 // web: 0.375rem
+    },
+    postMedia__dot: {
+      borderRadius: 999,
+      // web: border-radius 50%
+      backgroundColor: theme.colors.baseShade4 // inactive/edge: base-shade4
+    },
+    postMedia__dotActive: {
+      width: 6,
+      height: 6,
+      backgroundColor: theme.colors.base // web: var(--asc-color-base-default)
+    },
+    postMedia__dotInactive: {
+      width: 6,
+      height: 6
+    },
+    postMedia__dotEdge: {
+      width: 3,
+      // web: 0.1875rem
+      height: 3
+    }
+  });
+  return styles;
+};
+exports.useStyles = useStyles;
+//# sourceMappingURL=styles.js.map

package/lib/commonjs/social/elements/PostMediaElement/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_reactNative","require","_reactNativePaper","useStyles","theme","useTheme","styles","StyleSheet","create","postMedia","marginHorizontal","paddingVertical","postMedia__track","position","width","postMedia__slide","postMedia__frame","overflow","backgroundColor","colors","baseShade4","postMedia__media","height","postMedia__playButton","top","left","transform","translateX","translateY","zIndex","postMedia__broken","flex","alignItems","justifyContent","postMedia__counter","right","paddingHorizontal","borderRadius","postMedia__counterLabel","color","postMedia__indicator","flexDirection","gap","marginTop","postMedia__dotSlot","postMedia__dot","postMedia__dotActive","base","postMedia__dotInactive","postMedia__dotEdge","exports"],"sourceRoot":"../../../../../src","sources":["social/elements/PostMediaElement/styles.ts"],"mappings":"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","ignoreList":[]}