stream-chat-react-native-core 5.8.0-beta.4 → 5.8.0-beta.6

package/lib/module/components/ImageGallery/components/ImageGalleryOverlay.js

@@ -1,51 +1,35 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ImageGalleryOverlay = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _reactNative = require("react-native");
-
 var _reactNativeGestureHandler = require("react-native-gesture-handler");
-
 var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
-
 var _ThemeContext = require("../../../contexts/themeContext/ThemeContext");
-
 var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGalleryOverlay.tsx";
-
+  _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGalleryOverlay.tsx";
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 var ImageGalleryOverlay = function ImageGalleryOverlay(props) {
   var animatedBottomSheetIndex = props.animatedBottomSheetIndex,
-      closeGridView = props.closeGridView,
-      currentBottomSheetIndex = props.currentBottomSheetIndex;
-
+    closeGridView = props.closeGridView,
+    currentBottomSheetIndex = props.currentBottomSheetIndex;
   var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme = _useTheme.theme,
-      overlayColor = _useTheme$theme.colors.overlay,
-      overlay = _useTheme$theme.imageGallery.grid.overlay;
-
+    _useTheme$theme = _useTheme.theme,
+    overlayColor = _useTheme$theme.colors.overlay,
+    overlay = _useTheme$theme.imageGallery.grid.overlay;
   var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      visible = _useState2[0],
-      setVisible = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
   var _useState3 = (0, _react.useState)(false),
-      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-      fadedIn = _useState4[0],
-      setFadedIn = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    fadedIn = _useState4[0],
+    setFadedIn = _useState4[1];
   var opacity = (0, _reactNativeReanimated.useSharedValue)(0);
   (0, _react.useEffect)(function () {
     if (currentBottomSheetIndex > 0) {
@@ -67,17 +51,14 @@ var ImageGalleryOverlay = function ImageGalleryOverlay(props) {
       opacity: fadedIn ? animatedBottomSheetIndex.value : opacity.value
     };
   }, [fadedIn]);
-
   var tapEvent = function tapEvent(event) {
     if (event.nativeEvent.state === _reactNativeGestureHandler.State.END) {
       closeGridView();
     }
   };
-
   if (!visible) {
     return null;
   }
-
   return _react["default"].createElement(_reactNativeGestureHandler.TapGestureHandler, {
     maxDeltaX: 16,
     maxDeltaY: 16,
@@ -101,7 +82,6 @@ var ImageGalleryOverlay = function ImageGalleryOverlay(props) {
     }
   }));
 };
-
 exports.ImageGalleryOverlay = ImageGalleryOverlay;
 ImageGalleryOverlay.displayName = 'ImageGrid{imageGallery{grid{overlay}}}';
 //# sourceMappingURL=ImageGalleryOverlay.js.map

package/lib/module/components/ImageGallery/components/ImageGalleryOverlay.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryOverlay.tsx"],"names":["ImageGalleryOverlay","props","animatedBottomSheetIndex","closeGridView","currentBottomSheetIndex","theme","overlayColor","colors","overlay","imageGallery","grid","visible","setVisible","fadedIn","setFadedIn","opacity","value","duration","easing","Easing","out","ease","showOverlayStyle","tapEvent","event","nativeEvent","state","State","END","StyleSheet","absoluteFillObject","backgroundColor","displayName"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAKA;;AAQA;;;;;;;;;AAQO,IAAMA,mBAAoC,GAAG,SAAvCA,mBAAuC,CAACC,KAAD,EAAW;AAC7D,MAAQC,wBAAR,GAA6ED,KAA7E,CAAQC,wBAAR;AAAA,MAAkCC,aAAlC,GAA6EF,KAA7E,CAAkCE,aAAlC;AAAA,MAAiDC,uBAAjD,GAA6EH,KAA7E,CAAiDG,uBAAjD;;AAEA,kBAOI,6BAPJ;AAAA,kCACEC,KADF;AAAA,MAEuBC,YAFvB,mBAEIC,MAFJ,CAEcC,OAFd;AAAA,MAIcA,OAJd,mBAGIC,YAHJ,CAIMC,IAJN,CAIcF,OAJd;;AASA,kBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOG,OAAP;AAAA,MAAgBC,UAAhB;;AACA,mBAA8B,qBAAS,KAAT,CAA9B;AAAA;AAAA,MAAOC,OAAP;AAAA,MAAgBC,UAAhB;;AAEA,MAAMC,OAAO,GAAG,2CAAe,CAAf,CAAhB;AAEA,wBAAU,YAAM;AACd,QAAIX,uBAAuB,GAAG,CAA9B,EAAiC;AAC/BQ,MAAAA,UAAU,CAAC,IAAD,CAAV;AACAG,MAAAA,OAAO,CAACC,KAAR,GAAgB,uCACd,CADc,EAEd;AACEC,QAAAA,QAAQ,EAAE,GADZ;AAEEC,QAAAA,MAAM,EAAEC,8BAAOC,GAAP,CAAWD,8BAAOE,IAAlB;AAFV,OAFc,EAMd;AAAA,eAAM,oCAAQP,UAAR,EAAoB,IAApB,CAAN;AAAA,OANc,CAAhB;AAQD,KAVD,MAUO;AACLF,MAAAA,UAAU,CAAC,KAAD,CAAV;AACAG,MAAAA,OAAO,CAACC,KAAR,GAAgB,CAAhB;AACAF,MAAAA,UAAU,CAAC,KAAD,CAAV;AACD;AACF,GAhBD,EAgBG,CAACV,uBAAD,CAhBH;AAkBA,MAAMkB,gBAAgB,GAAG,6CACvB;AAAA,WAAO;AACLP,MAAAA,OAAO,EAAEF,OAAO,GAAGX,wBAAwB,CAACc,KAA5B,GAAoCD,OAAO,CAACC;AADvD,KAAP;AAAA,GADuB,EAIvB,CAACH,OAAD,CAJuB,CAAzB;;AAOA,MAAMU,QAAQ,GAAG,SAAXA,QAAW,CAACC,KAAD,EAA8C;AAC7D,QAAIA,KAAK,CAACC,WAAN,CAAkBC,KAAlB,KAA4BC,iCAAMC,GAAtC,EAA2C;AACzCzB,MAAAA,aAAa;AACd;AACF,GAJD;;AAMA,MAAI,CAACQ,OAAL,EAAc;AACZ,WAAO,IAAP;AACD;;AAED,SACE,gCAAC,4CAAD;AACE,IAAA,SAAS,EAAE,EADb;AAEE,IAAA,SAAS,EAAE,EAFb;AAGE,IAAA,oBAAoB,EAAEY,QAHxB;AAIE,IAAA,MAAM,EAAC,uBAJT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAME,gCAAC,iCAAD,CAAU,IAAV;AACE,IAAA,KAAK,EAAE,CACLM,wBAAWC,kBADN,EAEL;AAAEC,MAAAA,eAAe,EAAEzB;AAAnB,KAFK,EAGLE,OAHK,EAILc,gBAJK,CADT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IANF,CADF;AAiBD,CArEM;;;AAuEPtB,mBAAmB,CAACgC,WAApB,GAAkC,wCAAlC","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StyleSheet, ViewStyle } from 'react-native';\nimport {\n  State,\n  TapGestureHandler,\n  TapGestureHandlerStateChangeEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n  Easing,\n  runOnJS,\n  useAnimatedStyle,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\ntype Props = {\n  animatedBottomSheetIndex: Animated.SharedValue<number>;\n  closeGridView: () => void;\n  currentBottomSheetIndex: number;\n};\n\nexport const ImageGalleryOverlay: React.FC<Props> = (props) => {\n  const { animatedBottomSheetIndex, closeGridView, currentBottomSheetIndex } = props;\n\n  const {\n    theme: {\n      colors: { overlay: overlayColor },\n      imageGallery: {\n        grid: { overlay },\n      },\n    },\n  } = useTheme();\n\n  const [visible, setVisible] = useState(false);\n  const [fadedIn, setFadedIn] = useState(false);\n\n  const opacity = useSharedValue(0);\n\n  useEffect(() => {\n    if (currentBottomSheetIndex > 0) {\n      setVisible(true);\n      opacity.value = withTiming(\n        1,\n        {\n          duration: 200,\n          easing: Easing.out(Easing.ease),\n        },\n        () => runOnJS(setFadedIn)(true),\n      );\n    } else {\n      setVisible(false);\n      opacity.value = 0;\n      setFadedIn(false);\n    }\n  }, [currentBottomSheetIndex]);\n\n  const showOverlayStyle = useAnimatedStyle<ViewStyle>(\n    () => ({\n      opacity: fadedIn ? animatedBottomSheetIndex.value : opacity.value,\n    }),\n    [fadedIn],\n  );\n\n  const tapEvent = (event: TapGestureHandlerStateChangeEvent) => {\n    if (event.nativeEvent.state === State.END) {\n      closeGridView();\n    }\n  };\n\n  if (!visible) {\n    return null;\n  }\n\n  return (\n    <TapGestureHandler\n      maxDeltaX={16}\n      maxDeltaY={16}\n      onHandlerStateChange={tapEvent}\n      testID='image-gallery-overlay'\n    >\n      <Animated.View\n        style={[\n          StyleSheet.absoluteFillObject,\n          { backgroundColor: overlayColor },\n          overlay,\n          showOverlayStyle,\n        ]}\n      />\n    </TapGestureHandler>\n  );\n};\n\nImageGalleryOverlay.displayName = 'ImageGrid{imageGallery{grid{overlay}}}';\n"]}
+{"version":3,"names":["ImageGalleryOverlay","props","animatedBottomSheetIndex","closeGridView","currentBottomSheetIndex","useTheme","theme","overlayColor","colors","overlay","imageGallery","grid","useState","visible","setVisible","fadedIn","setFadedIn","opacity","useSharedValue","useEffect","value","withTiming","duration","easing","Easing","out","ease","runOnJS","showOverlayStyle","useAnimatedStyle","tapEvent","event","nativeEvent","state","State","END","StyleSheet","absoluteFillObject","backgroundColor","displayName"],"sources":["ImageGalleryOverlay.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { StyleSheet, ViewStyle } from 'react-native';\nimport {\n  State,\n  TapGestureHandler,\n  TapGestureHandlerStateChangeEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n  Easing,\n  runOnJS,\n  useAnimatedStyle,\n  useSharedValue,\n  withTiming,\n} from 'react-native-reanimated';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\ntype Props = {\n  animatedBottomSheetIndex: Animated.SharedValue<number>;\n  closeGridView: () => void;\n  currentBottomSheetIndex: number;\n};\n\nexport const ImageGalleryOverlay: React.FC<Props> = (props) => {\n  const { animatedBottomSheetIndex, closeGridView, currentBottomSheetIndex } = props;\n\n  const {\n    theme: {\n      colors: { overlay: overlayColor },\n      imageGallery: {\n        grid: { overlay },\n      },\n    },\n  } = useTheme();\n\n  const [visible, setVisible] = useState(false);\n  const [fadedIn, setFadedIn] = useState(false);\n\n  const opacity = useSharedValue(0);\n\n  useEffect(() => {\n    if (currentBottomSheetIndex > 0) {\n      setVisible(true);\n      opacity.value = withTiming(\n        1,\n        {\n          duration: 200,\n          easing: Easing.out(Easing.ease),\n        },\n        () => runOnJS(setFadedIn)(true),\n      );\n    } else {\n      setVisible(false);\n      opacity.value = 0;\n      setFadedIn(false);\n    }\n  }, [currentBottomSheetIndex]);\n\n  const showOverlayStyle = useAnimatedStyle<ViewStyle>(\n    () => ({\n      opacity: fadedIn ? animatedBottomSheetIndex.value : opacity.value,\n    }),\n    [fadedIn],\n  );\n\n  const tapEvent = (event: TapGestureHandlerStateChangeEvent) => {\n    if (event.nativeEvent.state === State.END) {\n      closeGridView();\n    }\n  };\n\n  if (!visible) {\n    return null;\n  }\n\n  return (\n    <TapGestureHandler\n      maxDeltaX={16}\n      maxDeltaY={16}\n      onHandlerStateChange={tapEvent}\n      testID='image-gallery-overlay'\n    >\n      <Animated.View\n        style={[\n          StyleSheet.absoluteFillObject,\n          { backgroundColor: overlayColor },\n          overlay,\n          showOverlayStyle,\n        ]}\n      />\n    </TapGestureHandler>\n  );\n};\n\nImageGalleryOverlay.displayName = 'ImageGrid{imageGallery{grid{overlay}}}';\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AAKA;AAQA;AAAuE;EAAA;AAAA;AAAA;AAQhE,IAAMA,mBAAoC,GAAG,SAAvCA,mBAAoC,CAAIC,KAAK,EAAK;EAC7D,IAAQC,wBAAwB,GAA6CD,KAAK,CAA1EC,wBAAwB;IAAEC,aAAa,GAA8BF,KAAK,CAAhDE,aAAa;IAAEC,uBAAuB,GAAKH,KAAK,CAAjCG,uBAAuB;EAExE,gBAOI,IAAAC,sBAAQ,GAAE;IAAA,4BANZC,KAAK;IACgBC,YAAY,mBAA/BC,MAAM,CAAIC,OAAO;IAEPA,OAAO,mBADjBC,YAAY,CACVC,IAAI,CAAIF,OAAO;EAKrB,gBAA8B,IAAAG,eAAQ,EAAC,KAAK,CAAC;IAAA;IAAtCC,OAAO;IAAEC,UAAU;EAC1B,iBAA8B,IAAAF,eAAQ,EAAC,KAAK,CAAC;IAAA;IAAtCG,OAAO;IAAEC,UAAU;EAE1B,IAAMC,OAAO,GAAG,IAAAC,qCAAc,EAAC,CAAC,CAAC;EAEjC,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIf,uBAAuB,GAAG,CAAC,EAAE;MAC/BU,UAAU,CAAC,IAAI,CAAC;MAChBG,OAAO,CAACG,KAAK,GAAG,IAAAC,iCAAU,EACxB,CAAC,EACD;QACEC,QAAQ,EAAE,GAAG;QACbC,MAAM,EAAEC,6BAAM,CAACC,GAAG,CAACD,6BAAM,CAACE,IAAI;MAChC,CAAC,EACD;QAAA,OAAM,IAAAC,8BAAO,EAACX,UAAU,CAAC,CAAC,IAAI,CAAC;MAAA,EAChC;IACH,CAAC,MAAM;MACLF,UAAU,CAAC,KAAK,CAAC;MACjBG,OAAO,CAACG,KAAK,GAAG,CAAC;MACjBJ,UAAU,CAAC,KAAK,CAAC;IACnB;EACF,CAAC,EAAE,CAACZ,uBAAuB,CAAC,CAAC;EAE7B,IAAMwB,gBAAgB,GAAG,IAAAC,uCAAgB,EACvC;IAAA,OAAO;MACLZ,OAAO,EAAEF,OAAO,GAAGb,wBAAwB,CAACkB,KAAK,GAAGH,OAAO,CAACG;IAC9D,CAAC;EAAA,CAAC,EACF,CAACL,OAAO,CAAC,CACV;EAED,IAAMe,QAAQ,GAAG,SAAXA,QAAQ,CAAIC,KAAwC,EAAK;IAC7D,IAAIA,KAAK,CAACC,WAAW,CAACC,KAAK,KAAKC,gCAAK,CAACC,GAAG,EAAE;MACzChC,aAAa,EAAE;IACjB;EACF,CAAC;EAED,IAAI,CAACU,OAAO,EAAE;IACZ,OAAO,IAAI;EACb;EAEA,OACE,gCAAC,4CAAiB;IAChB,SAAS,EAAE,EAAG;IACd,SAAS,EAAE,EAAG;IACd,oBAAoB,EAAEiB,QAAS;IAC/B,MAAM,EAAC,uBAAuB;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,GAE9B,gCAAC,iCAAQ,CAAC,IAAI;IACZ,KAAK,EAAE,CACLM,uBAAU,CAACC,kBAAkB,EAC7B;MAAEC,eAAe,EAAE/B;IAAa,CAAC,EACjCE,OAAO,EACPmB,gBAAgB,CAChB;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,EACF,CACgB;AAExB,CAAC;AAAC;AAEF5B,mBAAmB,CAACuC,WAAW,GAAG,wCAAwC"}

package/lib/module/components/ImageGallery/components/ImageGalleryVideoControl.js

@@ -1,25 +1,16 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ImageGalleryVideoControl = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactNative = require("react-native");
-
 var _dayjs = _interopRequireDefault(require("dayjs"));
-
 var _ThemeContext = require("../../../contexts/themeContext/ThemeContext");
-
 var _icons = require("../../../icons");
-
 var _ProgressControl = require("../../ProgressControl/ProgressControl");
-
 var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGalleryVideoControl.tsx";
-
+  _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGalleryVideoControl.tsx";
 var styles = _reactNative.StyleSheet.create({
   durationTextStyle: {
     fontWeight: 'bold'
@@ -42,28 +33,25 @@ var styles = _reactNative.StyleSheet.create({
     padding: 10
   }
 });
-
 var ImageGalleryVideoControl = _react["default"].memo(function (props) {
   var duration = props.duration,
-      onPlayPause = props.onPlayPause,
-      paused = props.paused,
-      progress = props.progress;
+    onPlayPause = props.onPlayPause,
+    paused = props.paused,
+    progress = props.progress;
   var videoDuration = duration ? duration / 3600 >= 1 ? _dayjs["default"].duration(duration, 'second').format('HH:mm:ss') : _dayjs["default"].duration(duration, 'second').format('mm:ss') : null;
   var progressValueInSeconds = progress * duration;
   var progressDuration = progressValueInSeconds ? progressValueInSeconds / 3600 >= 1 ? _dayjs["default"].duration(progressValueInSeconds, 'second').format('HH:mm:ss') : _dayjs["default"].duration(progressValueInSeconds, 'second').format('mm:ss') : null;
-
   var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme = _useTheme.theme,
-      _useTheme$theme$color = _useTheme$theme.colors,
-      accent_blue = _useTheme$theme$color.accent_blue,
-      black = _useTheme$theme$color.black,
-      static_black = _useTheme$theme$color.static_black,
-      static_white = _useTheme$theme$color.static_white,
-      _useTheme$theme$image = _useTheme$theme.imageGallery.videoControl,
-      durationTextStyle = _useTheme$theme$image.durationTextStyle,
-      roundedView = _useTheme$theme$image.roundedView,
-      videoContainer = _useTheme$theme$image.videoContainer;
-
+    _useTheme$theme = _useTheme.theme,
+    _useTheme$theme$color = _useTheme$theme.colors,
+    accent_blue = _useTheme$theme$color.accent_blue,
+    black = _useTheme$theme$color.black,
+    static_black = _useTheme$theme$color.static_black,
+    static_white = _useTheme$theme$color.static_white,
+    _useTheme$theme$image = _useTheme$theme.imageGallery.videoControl,
+    durationTextStyle = _useTheme$theme$image.durationTextStyle,
+    roundedView = _useTheme$theme$image.roundedView,
+    videoContainer = _useTheme$theme$image.videoContainer;
   return _react["default"].createElement(_reactNative.View, {
     style: [styles.videoContainer, videoContainer],
     __self: _this,
@@ -158,7 +146,6 @@ var ImageGalleryVideoControl = _react["default"].memo(function (props) {
     return false;
   }
 });
-
 exports.ImageGalleryVideoControl = ImageGalleryVideoControl;
 ImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';
 //# sourceMappingURL=ImageGalleryVideoControl.js.map

package/lib/module/components/ImageGallery/components/ImageGalleryVideoControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGalleryVideoControl.tsx"],"names":["styles","StyleSheet","create","durationTextStyle","fontWeight","roundedView","alignItems","borderRadius","display","elevation","height","justifyContent","width","videoContainer","backgroundColor","flexDirection","padding","ImageGalleryVideoControl","React","memo","props","duration","onPlayPause","paused","progress","videoDuration","dayjs","format","progressValueInSeconds","progressDuration","theme","colors","accent_blue","black","static_black","static_white","imageGallery","videoControl","color","prevProps","nextProps","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport dayjs from 'dayjs';\n\nimport type { ImageGalleryFooterVideoControlProps } from './ImageGalleryFooter';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport { Pause, Play } from '../../../icons';\nimport { ProgressControl } from '../../ProgressControl/ProgressControl';\n\nconst styles = StyleSheet.create({\n  durationTextStyle: {\n    fontWeight: 'bold',\n  },\n  roundedView: {\n    alignItems: 'center',\n    borderRadius: 50,\n    display: 'flex',\n    elevation: 2,\n    height: 36,\n    justifyContent: 'center',\n    width: 36,\n  },\n  videoContainer: {\n    alignItems: 'center',\n    backgroundColor: 'rgba(52, 52, 52, 0.1)',\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    padding: 10,\n  },\n});\n\nexport const ImageGalleryVideoControl: React.FC<ImageGalleryFooterVideoControlProps> = React.memo(\n  (props) => {\n    const { duration, onPlayPause, paused, progress } = props;\n\n    const videoDuration = duration\n      ? duration / 3600 >= 1\n        ? dayjs.duration(duration, 'second').format('HH:mm:ss')\n        : dayjs.duration(duration, 'second').format('mm:ss')\n      : null;\n\n    const progressValueInSeconds = progress * duration;\n\n    const progressDuration = progressValueInSeconds\n      ? progressValueInSeconds / 3600 >= 1\n        ? dayjs.duration(progressValueInSeconds, 'second').format('HH:mm:ss')\n        : dayjs.duration(progressValueInSeconds, 'second').format('mm:ss')\n      : null;\n\n    const {\n      theme: {\n        colors: { accent_blue, black, static_black, static_white },\n        imageGallery: {\n          videoControl: { durationTextStyle, roundedView, videoContainer },\n        },\n      },\n    } = useTheme();\n\n    return (\n      <View style={[styles.videoContainer, videoContainer]}>\n        <TouchableOpacity\n          accessibilityLabel='Play Pause Button'\n          onPress={() => {\n            onPlayPause();\n          }}\n        >\n          <View style={[styles.roundedView, roundedView, { backgroundColor: static_white }]}>\n            {paused ? (\n              <Play accessibilityLabel='Play Icon' height={24} pathFill={static_black} width={24} />\n            ) : (\n              <Pause\n                accessibilityLabel='Pause Icon'\n                height={24}\n                pathFill={static_black}\n                width={24}\n              />\n            )}\n          </View>\n        </TouchableOpacity>\n        <Text\n          accessibilityLabel='Progress Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: black }]}\n        >\n          {progressDuration ? progressDuration : '00:00'}\n        </Text>\n        <ProgressControl\n          duration={duration}\n          filledColor={accent_blue}\n          onPlayPause={onPlayPause}\n          progress={progress}\n          testID={'progress-control'}\n          width={180}\n        />\n        <Text\n          accessibilityLabel='Video Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: black }]}\n        >\n          {videoDuration ? videoDuration : '00:00'}\n        </Text>\n      </View>\n    );\n  },\n  (prevProps, nextProps) => {\n    if (\n      prevProps.duration === nextProps.duration &&\n      prevProps.paused === nextProps.paused &&\n      prevProps.progress === nextProps.progress\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  },\n);\n\nImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';\n"]}
+{"version":3,"names":["styles","StyleSheet","create","durationTextStyle","fontWeight","roundedView","alignItems","borderRadius","display","elevation","height","justifyContent","width","videoContainer","backgroundColor","flexDirection","padding","ImageGalleryVideoControl","React","memo","props","duration","onPlayPause","paused","progress","videoDuration","dayjs","format","progressValueInSeconds","progressDuration","useTheme","theme","colors","accent_blue","black","static_black","static_white","imageGallery","videoControl","color","prevProps","nextProps","displayName"],"sources":["ImageGalleryVideoControl.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, TouchableOpacity, View } from 'react-native';\n\nimport dayjs from 'dayjs';\n\nimport type { ImageGalleryFooterVideoControlProps } from './ImageGalleryFooter';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\n\nimport { Pause, Play } from '../../../icons';\nimport { ProgressControl } from '../../ProgressControl/ProgressControl';\n\nconst styles = StyleSheet.create({\n  durationTextStyle: {\n    fontWeight: 'bold',\n  },\n  roundedView: {\n    alignItems: 'center',\n    borderRadius: 50,\n    display: 'flex',\n    elevation: 2,\n    height: 36,\n    justifyContent: 'center',\n    width: 36,\n  },\n  videoContainer: {\n    alignItems: 'center',\n    backgroundColor: 'rgba(52, 52, 52, 0.1)',\n    display: 'flex',\n    flexDirection: 'row',\n    justifyContent: 'space-between',\n    padding: 10,\n  },\n});\n\nexport const ImageGalleryVideoControl: React.FC<ImageGalleryFooterVideoControlProps> = React.memo(\n  (props) => {\n    const { duration, onPlayPause, paused, progress } = props;\n\n    const videoDuration = duration\n      ? duration / 3600 >= 1\n        ? dayjs.duration(duration, 'second').format('HH:mm:ss')\n        : dayjs.duration(duration, 'second').format('mm:ss')\n      : null;\n\n    const progressValueInSeconds = progress * duration;\n\n    const progressDuration = progressValueInSeconds\n      ? progressValueInSeconds / 3600 >= 1\n        ? dayjs.duration(progressValueInSeconds, 'second').format('HH:mm:ss')\n        : dayjs.duration(progressValueInSeconds, 'second').format('mm:ss')\n      : null;\n\n    const {\n      theme: {\n        colors: { accent_blue, black, static_black, static_white },\n        imageGallery: {\n          videoControl: { durationTextStyle, roundedView, videoContainer },\n        },\n      },\n    } = useTheme();\n\n    return (\n      <View style={[styles.videoContainer, videoContainer]}>\n        <TouchableOpacity\n          accessibilityLabel='Play Pause Button'\n          onPress={() => {\n            onPlayPause();\n          }}\n        >\n          <View style={[styles.roundedView, roundedView, { backgroundColor: static_white }]}>\n            {paused ? (\n              <Play accessibilityLabel='Play Icon' height={24} pathFill={static_black} width={24} />\n            ) : (\n              <Pause\n                accessibilityLabel='Pause Icon'\n                height={24}\n                pathFill={static_black}\n                width={24}\n              />\n            )}\n          </View>\n        </TouchableOpacity>\n        <Text\n          accessibilityLabel='Progress Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: black }]}\n        >\n          {progressDuration ? progressDuration : '00:00'}\n        </Text>\n        <ProgressControl\n          duration={duration}\n          filledColor={accent_blue}\n          onPlayPause={onPlayPause}\n          progress={progress}\n          testID={'progress-control'}\n          width={180}\n        />\n        <Text\n          accessibilityLabel='Video Duration'\n          style={[styles.durationTextStyle, durationTextStyle, { color: black }]}\n        >\n          {videoDuration ? videoDuration : '00:00'}\n        </Text>\n      </View>\n    );\n  },\n  (prevProps, nextProps) => {\n    if (\n      prevProps.duration === nextProps.duration &&\n      prevProps.paused === nextProps.paused &&\n      prevProps.progress === nextProps.progress\n    ) {\n      return true;\n    } else {\n      return false;\n    }\n  },\n);\n\nImageGalleryVideoControl.displayName = 'ImageGalleryVideoControl{imageGallery{videoControl}}';\n"],"mappings":"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"}

package/lib/module/components/ImageGallery/components/ImageGrid.js

@@ -1,31 +1,19 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ImageGrid = void 0;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactNative = require("react-native");
-
 var _bottomSheet = require("@gorhom/bottom-sheet");
-
 var _VideoThumbnail = require("../../../components/Attachment/VideoThumbnail");
-
 var _ThemeContext = require("../../../contexts/themeContext/ThemeContext");
-
 var _utils = require("../../../utils/utils");
-
 var _excluded = ["imageComponent"];
-
 var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGrid.tsx";
-
+  _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGrid.tsx";
 var styles = _reactNative.StyleSheet.create({
   avatarImage: {
     borderRadius: 22,
@@ -46,27 +34,22 @@ var styles = _reactNative.StyleSheet.create({
     margin: 1
   }
 });
-
 var GridImage = function GridImage(_ref) {
   var item = _ref.item;
-
   var _useTheme = (0, _ThemeContext.useTheme)(),
-      gridImage = _useTheme.theme.imageGallery.grid.gridImage;
-
+    gridImage = _useTheme.theme.imageGallery.grid.gridImage;
   var imageComponent = item.imageComponent,
-      restItem = (0, _objectWithoutProperties2["default"])(item, _excluded);
+    restItem = (0, _objectWithoutProperties2["default"])(item, _excluded);
   var numberOfImageGalleryGridColumns = restItem.numberOfImageGalleryGridColumns,
-      selectAndClose = restItem.selectAndClose,
-      type = restItem.type,
-      uri = restItem.uri;
+    selectAndClose = restItem.selectAndClose,
+    type = restItem.type,
+    uri = restItem.uri;
   var size = (0, _utils.vw)(100) / (numberOfImageGalleryGridColumns || 3) - 2;
-
   if (imageComponent) {
     return imageComponent({
       item: restItem
     });
   }
-
   return _react["default"].createElement(_bottomSheet.TouchableOpacity, {
     accessibilityLabel: "Grid Image",
     onPress: selectAndClose,
@@ -110,7 +93,6 @@ var GridImage = function GridImage(_ref) {
     }
   }));
 };
-
 var renderItem = function renderItem(_ref2) {
   var item = _ref2.item;
   return _react["default"].createElement(GridImage, {
@@ -123,22 +105,19 @@ var renderItem = function renderItem(_ref2) {
     }
   });
 };
-
 var ImageGrid = function ImageGrid(props) {
   var avatarComponent = props.avatarComponent,
-      closeGridView = props.closeGridView,
-      imageComponent = props.imageComponent,
-      numberOfImageGalleryGridColumns = props.numberOfImageGalleryGridColumns,
-      photos = props.photos,
-      setSelectedMessage = props.setSelectedMessage;
-
+    closeGridView = props.closeGridView,
+    imageComponent = props.imageComponent,
+    numberOfImageGalleryGridColumns = props.numberOfImageGalleryGridColumns,
+    photos = props.photos,
+    setSelectedMessage = props.setSelectedMessage;
   var _useTheme2 = (0, _ThemeContext.useTheme)(),
-      _useTheme2$theme = _useTheme2.theme,
-      white = _useTheme2$theme.colors.white,
-      _useTheme2$theme$imag = _useTheme2$theme.imageGallery.grid,
-      container = _useTheme2$theme$imag.container,
-      contentContainer = _useTheme2$theme$imag.contentContainer;
-
+    _useTheme2$theme = _useTheme2.theme,
+    white = _useTheme2$theme.colors.white,
+    _useTheme2$theme$imag = _useTheme2$theme.imageGallery.grid,
+    container = _useTheme2$theme$imag.container,
+    contentContainer = _useTheme2$theme$imag.contentContainer;
   var imageGridItems = photos.map(function (photo) {
     return (0, _extends2["default"])({}, photo, {
       avatarComponent: avatarComponent,
@@ -173,7 +152,6 @@ var ImageGrid = function ImageGrid(props) {
     }
   });
 };
-
 exports.ImageGrid = ImageGrid;
 ImageGrid.displayName = 'ImageGrid{imageGallery{grid}}';
 //# sourceMappingURL=ImageGrid.js.map

package/lib/module/components/ImageGallery/components/ImageGrid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGrid.tsx"],"names":["styles","StyleSheet","create","avatarImage","borderRadius","height","width","avatarImageWrapper","borderWidth","margin","contentContainer","flexGrow","image","GridImage","item","gridImage","theme","imageGallery","grid","imageComponent","restItem","numberOfImageGalleryGridColumns","selectAndClose","type","uri","size","renderItem","ImageGrid","props","avatarComponent","closeGridView","photos","setSelectedMessage","white","colors","container","imageGridItems","map","photo","messageId","url","backgroundColor","index","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Image, StyleSheet, View } from 'react-native';\n\nimport { BottomSheetFlatList, TouchableOpacity } from '@gorhom/bottom-sheet';\n\nimport { VideoThumbnail } from '../../../components/Attachment/VideoThumbnail';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport { vw } from '../../../utils/utils';\n\nimport type { Photo } from '../ImageGallery';\n\nconst styles = StyleSheet.create({\n  avatarImage: {\n    borderRadius: 22,\n    height: 22,\n    width: 22,\n  },\n  avatarImageWrapper: {\n    borderRadius: 24,\n    borderWidth: 1,\n    height: 24,\n    margin: 8,\n    width: 24,\n  },\n  contentContainer: {\n    flexGrow: 1,\n  },\n  image: {\n    margin: 1,\n  },\n});\n\nexport type ImageGalleryGridImageComponent<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ({\n  item,\n}: {\n  item: Photo<StreamChatGenerics> & {\n    selectAndClose: () => void;\n    numberOfImageGalleryGridColumns?: number;\n  };\n}) => React.ReactElement | null;\n\nexport type ImageGalleryGridImageComponents<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = {\n  avatarComponent?: ImageGalleryGridImageComponent<StreamChatGenerics>;\n  imageComponent?: ImageGalleryGridImageComponent<StreamChatGenerics>;\n};\n\nexport type GridImageItem<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Photo<StreamChatGenerics> &\n  ImageGalleryGridImageComponents<StreamChatGenerics> & {\n    selectAndClose: () => void;\n    numberOfImageGalleryGridColumns?: number;\n  };\n\nconst GridImage = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  item,\n}: {\n  item: GridImageItem<StreamChatGenerics>;\n}) => {\n  const {\n    theme: {\n      imageGallery: {\n        grid: { gridImage },\n      },\n    },\n  } = useTheme();\n  const { imageComponent, ...restItem } = item;\n\n  const { numberOfImageGalleryGridColumns, selectAndClose, type, uri } = restItem;\n\n  const size = vw(100) / (numberOfImageGalleryGridColumns || 3) - 2;\n\n  if (imageComponent) {\n    return imageComponent({ item: restItem });\n  }\n\n  return (\n    <TouchableOpacity accessibilityLabel='Grid Image' onPress={selectAndClose}>\n      {type === 'video' ? (\n        <View style={[styles.image, { height: size, width: size }, gridImage]}>\n          <VideoThumbnail />\n        </View>\n      ) : (\n        <Image source={{ uri }} style={[styles.image, { height: size, width: size }]} />\n      )}\n    </TouchableOpacity>\n  );\n};\n\nconst renderItem = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  item,\n}: {\n  item: GridImageItem<StreamChatGenerics>;\n}) => <GridImage item={item} />;\n\nexport type ImageGridType<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ImageGalleryGridImageComponents<StreamChatGenerics> & {\n  closeGridView: () => void;\n  photos: Photo<StreamChatGenerics>[];\n  setSelectedMessage: React.Dispatch<\n    React.SetStateAction<\n      | {\n          messageId?: string | undefined;\n          url?: string | undefined;\n        }\n      | undefined\n    >\n  >;\n  numberOfImageGalleryGridColumns?: number;\n};\n\nexport const ImageGrid = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageGridType<StreamChatGenerics>,\n) => {\n  const {\n    avatarComponent,\n    closeGridView,\n    imageComponent,\n    numberOfImageGalleryGridColumns,\n    photos,\n    setSelectedMessage,\n  } = props;\n\n  const {\n    theme: {\n      colors: { white },\n      imageGallery: {\n        grid: { container, contentContainer },\n      },\n    },\n  } = useTheme();\n\n  const imageGridItems = photos.map((photo) => ({\n    ...photo,\n    avatarComponent,\n    imageComponent,\n    numberOfImageGalleryGridColumns,\n    selectAndClose: () => {\n      setSelectedMessage({ messageId: photo.messageId, url: photo.uri });\n      closeGridView();\n    },\n  }));\n\n  return (\n    <BottomSheetFlatList<GridImageItem<StreamChatGenerics>>\n      accessibilityLabel='Image Grid'\n      contentContainerStyle={[\n        styles.contentContainer,\n        { backgroundColor: white },\n        contentContainer,\n      ]}\n      data={imageGridItems as GridImageItem<StreamChatGenerics>[]}\n      keyExtractor={(item, index) => `${item.uri}-${index}`}\n      numColumns={numberOfImageGalleryGridColumns || 3}\n      renderItem={renderItem}\n      style={container}\n    />\n  );\n};\n\nImageGrid.displayName = 'ImageGrid{imageGallery{grid}}';\n"]}
+{"version":3,"names":["styles","StyleSheet","create","avatarImage","borderRadius","height","width","avatarImageWrapper","borderWidth","margin","contentContainer","flexGrow","image","GridImage","item","useTheme","gridImage","theme","imageGallery","grid","imageComponent","restItem","numberOfImageGalleryGridColumns","selectAndClose","type","uri","size","vw","renderItem","ImageGrid","props","avatarComponent","closeGridView","photos","setSelectedMessage","white","colors","container","imageGridItems","map","photo","messageId","url","backgroundColor","index","displayName"],"sources":["ImageGrid.tsx"],"sourcesContent":["import React from 'react';\nimport { Image, StyleSheet, View } from 'react-native';\n\nimport { BottomSheetFlatList, TouchableOpacity } from '@gorhom/bottom-sheet';\n\nimport { VideoThumbnail } from '../../../components/Attachment/VideoThumbnail';\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport type { DefaultStreamChatGenerics } from '../../../types/types';\nimport { vw } from '../../../utils/utils';\n\nimport type { Photo } from '../ImageGallery';\n\nconst styles = StyleSheet.create({\n  avatarImage: {\n    borderRadius: 22,\n    height: 22,\n    width: 22,\n  },\n  avatarImageWrapper: {\n    borderRadius: 24,\n    borderWidth: 1,\n    height: 24,\n    margin: 8,\n    width: 24,\n  },\n  contentContainer: {\n    flexGrow: 1,\n  },\n  image: {\n    margin: 1,\n  },\n});\n\nexport type ImageGalleryGridImageComponent<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ({\n  item,\n}: {\n  item: Photo<StreamChatGenerics> & {\n    selectAndClose: () => void;\n    numberOfImageGalleryGridColumns?: number;\n  };\n}) => React.ReactElement | null;\n\nexport type ImageGalleryGridImageComponents<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = {\n  avatarComponent?: ImageGalleryGridImageComponent<StreamChatGenerics>;\n  imageComponent?: ImageGalleryGridImageComponent<StreamChatGenerics>;\n};\n\nexport type GridImageItem<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = Photo<StreamChatGenerics> &\n  ImageGalleryGridImageComponents<StreamChatGenerics> & {\n    selectAndClose: () => void;\n    numberOfImageGalleryGridColumns?: number;\n  };\n\nconst GridImage = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  item,\n}: {\n  item: GridImageItem<StreamChatGenerics>;\n}) => {\n  const {\n    theme: {\n      imageGallery: {\n        grid: { gridImage },\n      },\n    },\n  } = useTheme();\n  const { imageComponent, ...restItem } = item;\n\n  const { numberOfImageGalleryGridColumns, selectAndClose, type, uri } = restItem;\n\n  const size = vw(100) / (numberOfImageGalleryGridColumns || 3) - 2;\n\n  if (imageComponent) {\n    return imageComponent({ item: restItem });\n  }\n\n  return (\n    <TouchableOpacity accessibilityLabel='Grid Image' onPress={selectAndClose}>\n      {type === 'video' ? (\n        <View style={[styles.image, { height: size, width: size }, gridImage]}>\n          <VideoThumbnail />\n        </View>\n      ) : (\n        <Image source={{ uri }} style={[styles.image, { height: size, width: size }]} />\n      )}\n    </TouchableOpacity>\n  );\n};\n\nconst renderItem = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>({\n  item,\n}: {\n  item: GridImageItem<StreamChatGenerics>;\n}) => <GridImage item={item} />;\n\nexport type ImageGridType<\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n> = ImageGalleryGridImageComponents<StreamChatGenerics> & {\n  closeGridView: () => void;\n  photos: Photo<StreamChatGenerics>[];\n  setSelectedMessage: React.Dispatch<\n    React.SetStateAction<\n      | {\n          messageId?: string | undefined;\n          url?: string | undefined;\n        }\n      | undefined\n    >\n  >;\n  numberOfImageGalleryGridColumns?: number;\n};\n\nexport const ImageGrid = <\n  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,\n>(\n  props: ImageGridType<StreamChatGenerics>,\n) => {\n  const {\n    avatarComponent,\n    closeGridView,\n    imageComponent,\n    numberOfImageGalleryGridColumns,\n    photos,\n    setSelectedMessage,\n  } = props;\n\n  const {\n    theme: {\n      colors: { white },\n      imageGallery: {\n        grid: { container, contentContainer },\n      },\n    },\n  } = useTheme();\n\n  const imageGridItems = photos.map((photo) => ({\n    ...photo,\n    avatarComponent,\n    imageComponent,\n    numberOfImageGalleryGridColumns,\n    selectAndClose: () => {\n      setSelectedMessage({ messageId: photo.messageId, url: photo.uri });\n      closeGridView();\n    },\n  }));\n\n  return (\n    <BottomSheetFlatList<GridImageItem<StreamChatGenerics>>\n      accessibilityLabel='Image Grid'\n      contentContainerStyle={[\n        styles.contentContainer,\n        { backgroundColor: white },\n        contentContainer,\n      ]}\n      data={imageGridItems as GridImageItem<StreamChatGenerics>[]}\n      keyExtractor={(item, index) => `${item.uri}-${index}`}\n      numColumns={numberOfImageGalleryGridColumns || 3}\n      renderItem={renderItem}\n      style={container}\n    />\n  );\n};\n\nImageGrid.displayName = 'ImageGrid{imageGallery{grid}}';\n"],"mappings":"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"}

package/lib/module/components/ImageGallery/components/ImageGridHandle.js

@@ -1,25 +1,16 @@
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ImageGridHandle = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactNative = require("react-native");
-
 var _bottomSheet = require("@gorhom/bottom-sheet");
-
 var _ThemeContext = require("../../../contexts/themeContext/ThemeContext");
-
 var _TranslationContext = require("../../../contexts/translationContext/TranslationContext");
-
 var _icons = require("../../../icons");
-
 var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGridHandle.tsx";
-
+  _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/ImageGallery/components/ImageGridHandle.tsx";
 var styles = _reactNative.StyleSheet.create({
   closeButton: {
     marginRight: 16
@@ -43,25 +34,21 @@ var styles = _reactNative.StyleSheet.create({
     textAlign: 'center'
   }
 });
-
 var ImageGridHandle = function ImageGridHandle(props) {
   var centerComponent = props.centerComponent,
-      closeGridView = props.closeGridView,
-      leftComponent = props.leftComponent,
-      rightComponent = props.rightComponent;
-
+    closeGridView = props.closeGridView,
+    leftComponent = props.leftComponent,
+    rightComponent = props.rightComponent;
   var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme = _useTheme.theme,
-      _useTheme$theme$color = _useTheme$theme.colors,
-      black = _useTheme$theme$color.black,
-      white = _useTheme$theme$color.white,
-      _useTheme$theme$image = _useTheme$theme.imageGallery.grid,
-      handle = _useTheme$theme$image.handle,
-      handleText = _useTheme$theme$image.handleText;
-
+    _useTheme$theme = _useTheme.theme,
+    _useTheme$theme$color = _useTheme$theme.colors,
+    black = _useTheme$theme$color.black,
+    white = _useTheme$theme$color.white,
+    _useTheme$theme$image = _useTheme$theme.imageGallery.grid,
+    handle = _useTheme$theme$image.handle,
+    handleText = _useTheme$theme$image.handleText;
   var _useTranslationContex = (0, _TranslationContext.useTranslationContext)(),
-      t = _useTranslationContex.t;
-
+    t = _useTranslationContex.t;
   return _react["default"].createElement(_reactNative.View, {
     accessibilityLabel: "Image Grid Handle",
     style: [styles.handle, {
@@ -115,7 +102,6 @@ var ImageGridHandle = function ImageGridHandle(props) {
     }
   })));
 };
-
 exports.ImageGridHandle = ImageGridHandle;
 ImageGridHandle.displayName = 'ImageGridHandle{imageGallery{grid{handle}}}';
 //# sourceMappingURL=ImageGridHandle.js.map

package/lib/module/components/ImageGallery/components/ImageGridHandle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ImageGridHandle.tsx"],"names":["styles","StyleSheet","create","closeButton","marginRight","handle","alignItems","borderTopLeftRadius","borderTopRightRadius","flexDirection","height","justifyContent","leftContainer","marginLeft","width","text","flex","fontSize","fontWeight","textAlign","ImageGridHandle","props","centerComponent","closeGridView","leftComponent","rightComponent","theme","colors","black","white","imageGallery","grid","handleText","t","backgroundColor","color","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AAEA;;AACA;;AACA;;;;;AAEA,IAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,WAAW,EAAE;AACXC,IAAAA,WAAW,EAAE;AADF,GADkB;AAI/BC,EAAAA,MAAM,EAAE;AACNC,IAAAA,UAAU,EAAE,QADN;AAENC,IAAAA,mBAAmB,EAAE,EAFf;AAGNC,IAAAA,oBAAoB,EAAE,EAHhB;AAINC,IAAAA,aAAa,EAAE,KAJT;AAKNC,IAAAA,MAAM,EAAE,EALF;AAMNC,IAAAA,cAAc,EAAE;AANV,GAJuB;AAY/BC,EAAAA,aAAa,EAAE;AACbC,IAAAA,UAAU,EAAE,EADC;AAEbC,IAAAA,KAAK,EAAE;AAFM,GAZgB;AAgB/BC,EAAAA,IAAI,EAAE;AACJC,IAAAA,IAAI,EAAE,CADF;AAEJC,IAAAA,QAAQ,EAAE,EAFN;AAGJC,IAAAA,UAAU,EAAE,KAHR;AAIJC,IAAAA,SAAS,EAAE;AAJP;AAhByB,CAAlB,CAAf;;AAwCO,IAAMC,eAAgC,GAAG,SAAnCA,eAAmC,CAACC,KAAD,EAAW;AACzD,MAAQC,eAAR,GAA0ED,KAA1E,CAAQC,eAAR;AAAA,MAAyBC,aAAzB,GAA0EF,KAA1E,CAAyBE,aAAzB;AAAA,MAAwCC,aAAxC,GAA0EH,KAA1E,CAAwCG,aAAxC;AAAA,MAAuDC,cAAvD,GAA0EJ,KAA1E,CAAuDI,cAAvD;;AACA,kBAOI,6BAPJ;AAAA,kCACEC,KADF;AAAA,8CAEIC,MAFJ;AAAA,MAEcC,KAFd,yBAEcA,KAFd;AAAA,MAEqBC,KAFrB,yBAEqBA,KAFrB;AAAA,8CAGIC,YAHJ,CAIMC,IAJN;AAAA,MAIc1B,MAJd,yBAIcA,MAJd;AAAA,MAIsB2B,UAJtB,yBAIsBA,UAJtB;;AAQA,8BAAc,gDAAd;AAAA,MAAQC,CAAR,yBAAQA,CAAR;;AAEA,SACE,gCAAC,iBAAD;AACE,IAAA,kBAAkB,EAAC,mBADrB;AAEE,IAAA,KAAK,EAAE,CAACjC,MAAM,CAACK,MAAR,EAAgB;AAAE6B,MAAAA,eAAe,EAAEL;AAAnB,KAAhB,EAA4CxB,MAA5C,CAFT;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAIGmB,aAAa,GAAGA,aAAa,CAAC;AAAED,IAAAA,aAAa,EAAbA;AAAF,GAAD,CAAhB,GAAsC,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAEvB,MAAM,CAACY,aAApB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAJtD,EAKGU,eAAe,GACdA,eAAe,CAAC;AAAEC,IAAAA,aAAa,EAAbA;AAAF,GAAD,CADD,GAGd,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACvB,MAAM,CAACe,IAAR,EAAc;AAAEoB,MAAAA,KAAK,EAAEP;AAAT,KAAd,EAAgCI,UAAhC,CAAb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAA2DC,CAAC,CAAC,mBAAD,CAA5D,CARJ,EAUGR,cAAc,GACbA,cAAc,CAAC;AAAEF,IAAAA,aAAa,EAAbA;AAAF,GAAD,CADD,GAGb,gCAAC,6BAAD;AAAkB,IAAA,OAAO,EAAEA,aAA3B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACE,gCAAC,YAAD;AAAO,IAAA,KAAK,EAAEvB,MAAM,CAACG,WAArB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IADF,CAbJ,CADF;AAoBD,CAhCM;;;AAkCPiB,eAAe,CAACgB,WAAhB,GAA8B,6CAA9B","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\n\nimport { TouchableOpacity } from '@gorhom/bottom-sheet';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';\nimport { Close } from '../../../icons';\n\nconst styles = StyleSheet.create({\n  closeButton: {\n    marginRight: 16,\n  },\n  handle: {\n    alignItems: 'center',\n    borderTopLeftRadius: 12,\n    borderTopRightRadius: 12,\n    flexDirection: 'row',\n    height: 40,\n    justifyContent: 'center',\n  },\n  leftContainer: {\n    marginLeft: 16,\n    width: 24, // Close icon width on right\n  },\n  text: {\n    flex: 1,\n    fontSize: 16,\n    fontWeight: '600',\n    textAlign: 'center',\n  },\n});\n\nexport type ImageGalleryGridHandleCustomComponent = ({\n  closeGridView,\n}: {\n  closeGridView: () => void;\n}) => React.ReactElement | null;\n\nexport type ImageGalleryGridHandleCustomComponentProps = {\n  centerComponent?: ImageGalleryGridHandleCustomComponent;\n  leftComponent?: ImageGalleryGridHandleCustomComponent;\n  rightComponent?: ImageGalleryGridHandleCustomComponent;\n};\n\ntype Props = ImageGalleryGridHandleCustomComponentProps & {\n  closeGridView: () => void;\n};\n\nexport const ImageGridHandle: React.FC<Props> = (props) => {\n  const { centerComponent, closeGridView, leftComponent, rightComponent } = props;\n  const {\n    theme: {\n      colors: { black, white },\n      imageGallery: {\n        grid: { handle, handleText },\n      },\n    },\n  } = useTheme();\n  const { t } = useTranslationContext();\n\n  return (\n    <View\n      accessibilityLabel='Image Grid Handle'\n      style={[styles.handle, { backgroundColor: white }, handle]}\n    >\n      {leftComponent ? leftComponent({ closeGridView }) : <View style={styles.leftContainer} />}\n      {centerComponent ? (\n        centerComponent({ closeGridView })\n      ) : (\n        <Text style={[styles.text, { color: black }, handleText]}>{t('Photos and Videos')}</Text>\n      )}\n      {rightComponent ? (\n        rightComponent({ closeGridView })\n      ) : (\n        <TouchableOpacity onPress={closeGridView}>\n          <Close style={styles.closeButton} />\n        </TouchableOpacity>\n      )}\n    </View>\n  );\n};\n\nImageGridHandle.displayName = 'ImageGridHandle{imageGallery{grid{handle}}}';\n"]}
+{"version":3,"names":["styles","StyleSheet","create","closeButton","marginRight","handle","alignItems","borderTopLeftRadius","borderTopRightRadius","flexDirection","height","justifyContent","leftContainer","marginLeft","width","text","flex","fontSize","fontWeight","textAlign","ImageGridHandle","props","centerComponent","closeGridView","leftComponent","rightComponent","useTheme","theme","colors","black","white","imageGallery","grid","handleText","useTranslationContext","t","backgroundColor","color","displayName"],"sources":["ImageGridHandle.tsx"],"sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\n\nimport { TouchableOpacity } from '@gorhom/bottom-sheet';\n\nimport { useTheme } from '../../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../../contexts/translationContext/TranslationContext';\nimport { Close } from '../../../icons';\n\nconst styles = StyleSheet.create({\n  closeButton: {\n    marginRight: 16,\n  },\n  handle: {\n    alignItems: 'center',\n    borderTopLeftRadius: 12,\n    borderTopRightRadius: 12,\n    flexDirection: 'row',\n    height: 40,\n    justifyContent: 'center',\n  },\n  leftContainer: {\n    marginLeft: 16,\n    width: 24, // Close icon width on right\n  },\n  text: {\n    flex: 1,\n    fontSize: 16,\n    fontWeight: '600',\n    textAlign: 'center',\n  },\n});\n\nexport type ImageGalleryGridHandleCustomComponent = ({\n  closeGridView,\n}: {\n  closeGridView: () => void;\n}) => React.ReactElement | null;\n\nexport type ImageGalleryGridHandleCustomComponentProps = {\n  centerComponent?: ImageGalleryGridHandleCustomComponent;\n  leftComponent?: ImageGalleryGridHandleCustomComponent;\n  rightComponent?: ImageGalleryGridHandleCustomComponent;\n};\n\ntype Props = ImageGalleryGridHandleCustomComponentProps & {\n  closeGridView: () => void;\n};\n\nexport const ImageGridHandle: React.FC<Props> = (props) => {\n  const { centerComponent, closeGridView, leftComponent, rightComponent } = props;\n  const {\n    theme: {\n      colors: { black, white },\n      imageGallery: {\n        grid: { handle, handleText },\n      },\n    },\n  } = useTheme();\n  const { t } = useTranslationContext();\n\n  return (\n    <View\n      accessibilityLabel='Image Grid Handle'\n      style={[styles.handle, { backgroundColor: white }, handle]}\n    >\n      {leftComponent ? leftComponent({ closeGridView }) : <View style={styles.leftContainer} />}\n      {centerComponent ? (\n        centerComponent({ closeGridView })\n      ) : (\n        <Text style={[styles.text, { color: black }, handleText]}>{t('Photos and Videos')}</Text>\n      )}\n      {rightComponent ? (\n        rightComponent({ closeGridView })\n      ) : (\n        <TouchableOpacity onPress={closeGridView}>\n          <Close style={styles.closeButton} />\n        </TouchableOpacity>\n      )}\n    </View>\n  );\n};\n\nImageGridHandle.displayName = 'ImageGridHandle{imageGallery{grid{handle}}}';\n"],"mappings":";;;;;AAAA;AACA;AAEA;AAEA;AACA;AACA;AAAuC;EAAA;AAEvC,IAAMA,MAAM,GAAGC,uBAAU,CAACC,MAAM,CAAC;EAC/BC,WAAW,EAAE;IACXC,WAAW,EAAE;EACf,CAAC;EACDC,MAAM,EAAE;IACNC,UAAU,EAAE,QAAQ;IACpBC,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE,EAAE;IACxBC,aAAa,EAAE,KAAK;IACpBC,MAAM,EAAE,EAAE;IACVC,cAAc,EAAE;EAClB,CAAC;EACDC,aAAa,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,KAAK,EAAE;EACT,CAAC;EACDC,IAAI,EAAE;IACJC,IAAI,EAAE,CAAC;IACPC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBC,SAAS,EAAE;EACb;AACF,CAAC,CAAC;AAkBK,IAAMC,eAAgC,GAAG,SAAnCA,eAAgC,CAAIC,KAAK,EAAK;EACzD,IAAQC,eAAe,GAAmDD,KAAK,CAAvEC,eAAe;IAAEC,aAAa,GAAoCF,KAAK,CAAtDE,aAAa;IAAEC,aAAa,GAAqBH,KAAK,CAAvCG,aAAa;IAAEC,cAAc,GAAKJ,KAAK,CAAxBI,cAAc;EACrE,gBAOI,IAAAC,sBAAQ,GAAE;IAAA,4BANZC,KAAK;IAAA,wCACHC,MAAM;IAAIC,KAAK,yBAALA,KAAK;IAAEC,KAAK,yBAALA,KAAK;IAAA,wCACtBC,YAAY,CACVC,IAAI;IAAI3B,MAAM,yBAANA,MAAM;IAAE4B,UAAU,yBAAVA,UAAU;EAIhC,4BAAc,IAAAC,yCAAqB,GAAE;IAA7BC,CAAC,yBAADA,CAAC;EAET,OACE,gCAAC,iBAAI;IACH,kBAAkB,EAAC,mBAAmB;IACtC,KAAK,EAAE,CAACnC,MAAM,CAACK,MAAM,EAAE;MAAE+B,eAAe,EAAEN;IAAM,CAAC,EAAEzB,MAAM,CAAE;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,GAE1DmB,aAAa,GAAGA,aAAa,CAAC;IAAED,aAAa,EAAbA;EAAc,CAAC,CAAC,GAAG,gCAAC,iBAAI;IAAC,KAAK,EAAEvB,MAAM,CAACY,aAAc;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,EAAG,EACxFU,eAAe,GACdA,eAAe,CAAC;IAAEC,aAAa,EAAbA;EAAc,CAAC,CAAC,GAElC,gCAAC,iBAAI;IAAC,KAAK,EAAE,CAACvB,MAAM,CAACe,IAAI,EAAE;MAAEsB,KAAK,EAAER;IAAM,CAAC,EAAEI,UAAU,CAAE;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,GAAEE,CAAC,CAAC,mBAAmB,CAAC,CAClF,EACAV,cAAc,GACbA,cAAc,CAAC;IAAEF,aAAa,EAAbA;EAAc,CAAC,CAAC,GAEjC,gCAAC,6BAAgB;IAAC,OAAO,EAAEA,aAAc;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,GACvC,gCAAC,YAAK;IAAC,KAAK,EAAEvB,MAAM,CAACG,WAAY;IAAA;IAAA;MAAA;MAAA;MAAA;IAAA;EAAA,EAAG,CAEvC,CACI;AAEX,CAAC;AAAC;AAEFiB,eAAe,CAACkB,WAAW,GAAG,6CAA6C"}