react-native-inapp-inspector 2.3.19 → 2.3.21

package/dist/commonjs/components/Inspector/MediaPreviewModal.js

@@ -1,681 +1,166 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MediaPreviewModal = void 0;
-const react_1 = __importStar(require("react"));
-const react_native_1 = require("react-native");
-const AppColors_1 = require("../../styles/AppColors");
-const AppFonts_1 = require("../../styles/AppFonts");
-const TouchableScale_1 = __importDefault(require("../TouchableScale"));
-const NetworkIcons_1 = require("../NetworkIcons");
-const capture_1 = require("../../capture");
-const helpers_1 = require("../../helpers");
-const toast_1 = require("../../helpers/toast");
-const i18n_1 = require("../../i18n");
-const MediaPreviewModal = ({ item, visible, onClose, onDelete, onConvertToGif, }) => {
-    const { t } = (0, i18n_1.useTranslation)();
-    const [isConverting, setIsConverting] = (0, react_1.useState)(false);
-    const [imageError, setImageError] = (0, react_1.useState)(false);
-    const [isExpanded, setIsExpanded] = (0, react_1.useState)(false);
-    const [isPlaying, setIsPlaying] = (0, react_1.useState)(false);
-    const [playbackSpeed, setPlaybackSpeed] = (0, react_1.useState)('1.0x');
-    const [isLooping, setIsLooping] = (0, react_1.useState)(true);
-    const [scrubPosition, setScrubPosition] = (0, react_1.useState)(0.4);
-    if (!item)
-        return null;
-    const handlePlayVideo = async () => {
-        try {
-            setIsPlaying(true);
-            await capture_1.ScreenCapture.playVideo(item.uri);
-        }
-        catch {
-            (0, toast_1.showToast)(t('mediaGallery.playError', 'Unable to play video'));
-        }
-        finally {
-            setIsPlaying(false);
-        }
-    };
-    const handleDelete = () => {
-        react_native_1.Alert.alert(t('mediaGallery.deleteTitle'), t('mediaGallery.deleteMessage', { filename: item.filename }), [
-            { text: t('common.cancel'), style: 'cancel' },
-            {
-                text: t('mediaGallery.delete'),
-                style: 'destructive',
-                onPress: () => {
-                    onDelete(item);
-                    onClose();
-                },
-            },
-        ]);
-    };
-    const handleConvert = async () => {
-        if (!onConvertToGif)
-            return;
-        setIsConverting(true);
-        try {
-            await onConvertToGif(item);
-            (0, toast_1.showToast)(t('mediaGallery.convertedSuccess'));
-        }
-        catch {
-            (0, toast_1.showToast)(t('mediaGallery.convertFailed'));
-        }
-        finally {
-            setIsConverting(false);
-        }
-    };
-    const isVideo = item.type === 'video';
-    const isGif = item.type === 'gif';
-    const durationSec = item.durationMs ? (item.durationMs / 1000).toFixed(1) : null;
-    const formattedDuration = durationSec
-        ? `00:${Number(durationSec) < 10 ? '0' : ''}${durationSec}`
-        : '00:05.0';
-    const hasBottomToolbar = isVideo || isGif;
-    return (<react_native_1.Modal visible={visible} transparent={true} animationType="fade" onRequestClose={onClose}>
+"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(e,t,a,i){i===void 0&&(i=a);var r=Object.getOwnPropertyDescriptor(t,a);(!r||("get"in r?!t.__esModule:r.writable||r.configurable))&&(r={enumerable:!0,get:function(){return t[a]}}),Object.defineProperty(e,i,r)}):(function(e,t,a,i){i===void 0&&(i=a),e[i]=t[a]})),__setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(e,t){Object.defineProperty(e,"default",{enumerable:!0,value:t})}):function(e,t){e.default=t}),__importStar=this&&this.__importStar||(function(){var e=function(t){return e=Object.getOwnPropertyNames||function(a){var i=[];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(i[i.length]=r);return i},e(t)};return function(t){if(t&&t.__esModule)return t;var a={};if(t!=null)for(var i=e(t),r=0;r<i.length;r++)i[r]!=="default"&&__createBinding(a,t,i[r]);return __setModuleDefault(a,t),a}})(),__importDefault=this&&this.__importDefault||function(e){return e&&e.__esModule?e:{default:e}};Object.defineProperty(exports,"__esModule",{value:!0}),exports.MediaPreviewModal=void 0;const react_1=__importStar(require("react")),react_native_1=require("react-native"),AppColors_1=require("../../styles/AppColors"),AppFonts_1=require("../../styles/AppFonts"),TouchableScale_1=__importDefault(require("../TouchableScale")),NetworkIcons_1=require("../NetworkIcons"),capture_1=require("../../capture"),helpers_1=require("../../helpers"),toast_1=require("../../helpers/toast"),i18n_1=require("../../i18n"),MediaPreviewModal=({item:e,visible:t,onClose:a,onDelete:i,onConvertToGif:r})=>{const{t:o}=(0,i18n_1.useTranslation)(),[y,b]=(0,react_1.useState)(!1),[v,g]=(0,react_1.useState)(!1),[n,T]=(0,react_1.useState)(!1),[C,f]=(0,react_1.useState)(!1),[A,x]=(0,react_1.useState)("1.0x"),[c,S]=(0,react_1.useState)(!0),[h,k]=(0,react_1.useState)(.4);if(!e)return null;const u=()=>{e?.uri&&(0,helpers_1.copyImageOrMediaToClipboard)(e.uri,e.type==="image"?"Image":"Media")},w=async()=>{try{f(!0),await capture_1.ScreenCapture.playVideo(e.uri)}catch{(0,toast_1.showToast)(o("mediaGallery.playError","Unable to play video"))}finally{f(!1)}},I=()=>{react_native_1.Alert.alert(o("mediaGallery.deleteTitle"),o("mediaGallery.deleteMessage",{filename:e.filename}),[{text:o("common.cancel"),style:"cancel"},{text:o("mediaGallery.delete"),style:"destructive",onPress:()=>{i(e),a()}}])},P=async()=>{if(r){b(!0);try{await r(e),(0,toast_1.showToast)(o("mediaGallery.convertedSuccess"))}catch{(0,toast_1.showToast)(o("mediaGallery.convertFailed"))}finally{b(!1)}}},_=async()=>{try{const l=e.uri.startsWith("file://")||e.uri.startsWith("content://")||e.uri.startsWith("http")?e.uri:`file://${e.uri}`,V=react_native_1.Platform.select({ios:{url:l,title:e.filename},default:{title:e.filename,message:e.filename,url:l}});(await react_native_1.Share.share(V)).action===react_native_1.Share.sharedAction&&(0,toast_1.showToast)(o("mediaGallery.shareSuccess","Shared successfully"))}catch(l){l?.message!=="User did not share"&&(0,toast_1.showToast)(o("mediaGallery.shareUnavailable","Sharing not available on this device"))}},s=e.type==="video",d=e.type==="gif",p=e.durationMs?(e.durationMs/1e3).toFixed(1):null,F=p?`00:${Number(p)<10?"0":""}${p}`:"00:05.0",m=!0;return<react_native_1.Modal visible={t}transparent={!0}animationType="fade"onRequestClose={a}>
       <react_native_1.View style={previewStyles.overlay}>
         
         <react_native_1.View style={previewStyles.header}>
-          <react_native_1.View style={previewStyles.headerLeft}>
-            <react_native_1.View style={[
-            previewStyles.badge,
-            {
-                borderColor: isVideo
-                    ? `${AppColors_1.AppColors.sky400}80`
-                    : isGif
-                        ? `${AppColors_1.AppColors.warningAmber}80`
-                        : `${AppColors_1.AppColors.emerald500}80`,
-                backgroundColor: isVideo
-                    ? `${AppColors_1.AppColors.sky400}20`
-                    : isGif
-                        ? `${AppColors_1.AppColors.warningAmber}20`
-                        : `${AppColors_1.AppColors.emerald500}20`,
-            },
-        ]}>
-              {isVideo ? (<NetworkIcons_1.FilmIcon size={13} color={AppColors_1.AppColors.sky400}/>) : isGif ? (<NetworkIcons_1.GifIcon size={13} color={AppColors_1.AppColors.warningAmber}/>) : (<NetworkIcons_1.ImageIcon size={13} color={AppColors_1.AppColors.emerald500}/>)}
-              <react_native_1.Text style={[
-            previewStyles.badgeText,
-            {
-                color: isVideo
-                    ? AppColors_1.AppColors.sky400
-                    : isGif
-                        ? AppColors_1.AppColors.warningAmber
-                        : AppColors_1.AppColors.emerald500,
-            },
-        ]}>
-                {item.format.toUpperCase()}
+          <react_native_1.TouchableOpacity activeOpacity={.8}onPress={u}style={previewStyles.headerLeft}>
+            <react_native_1.View style={[previewStyles.badge,{borderColor:s?`${AppColors_1.AppColors.sky400}80`:d?`${AppColors_1.AppColors.warningAmber}80`:`${AppColors_1.AppColors.emerald500}80`,backgroundColor:s?`${AppColors_1.AppColors.sky400}20`:d?`${AppColors_1.AppColors.warningAmber}20`:`${AppColors_1.AppColors.emerald500}20`}]}>
+              {s?<NetworkIcons_1.FilmIcon size={13}color={AppColors_1.AppColors.sky400}/>:d?<NetworkIcons_1.GifIcon size={13}color={AppColors_1.AppColors.warningAmber}/>:<NetworkIcons_1.ImageIcon size={13}color={AppColors_1.AppColors.emerald500}/>}
+              <react_native_1.Text style={[previewStyles.badgeText,{color:s?AppColors_1.AppColors.sky400:d?AppColors_1.AppColors.warningAmber:AppColors_1.AppColors.emerald500}]}>
+                {e.format.toUpperCase()}
               </react_native_1.Text>
             </react_native_1.View>
-            <react_native_1.View style={{ flex: 1, minWidth: 0 }}>
-              <react_native_1.Text style={previewStyles.title} numberOfLines={1}>
-                {item.filename}
+            <react_native_1.View style={{flex:1,minWidth:0}}>
+              <react_native_1.Text style={previewStyles.title}numberOfLines={1}>
+                {e.filename}
               </react_native_1.Text>
               <react_native_1.Text style={previewStyles.subtitle}>
-                {(0, helpers_1.formatBytes)(item.sizeBytes)} • {new Date(item.timestamp).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit' })}
+                {(0,helpers_1.formatBytes)(e.sizeBytes)} • {new Date(e.timestamp).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit",second:"2-digit"})}
               </react_native_1.Text>
             </react_native_1.View>
-          </react_native_1.View>
+          </react_native_1.TouchableOpacity>
 
           
           <react_native_1.View style={previewStyles.headerRight}>
-            <TouchableScale_1.default accessible={true} accessibilityRole="button" accessibilityLabel={t('mediaGallery.delete')} onPress={handleDelete} style={previewStyles.headerDeleteBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
-              <NetworkIcons_1.TrashIcon size={14} color={AppColors_1.AppColors.red500}/>
+            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.copyUri","Copy URI")}onPress={u}style={previewStyles.headerActionBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.CopyIcon size={14}color={AppColors_1.AppColors.slate200}/>
+            </TouchableScale_1.default>
+
+            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.share","Share")}onPress={_}style={[previewStyles.headerActionBtn,{backgroundColor:`${AppColors_1.AppColors.sky400}20`,borderColor:`${AppColors_1.AppColors.sky400}60`}]}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.ShareIcon size={14}color={AppColors_1.AppColors.sky400}/>
             </TouchableScale_1.default>
 
-            <react_native_1.TouchableOpacity accessible={true} accessibilityRole="button" accessibilityLabel={isExpanded ? t('mediaGallery.collapse', 'Exit Fullscreen') : t('mediaGallery.expand', 'Expand Fullscreen')} onPress={() => setIsExpanded(!isExpanded)} style={[
-            previewStyles.headerIconBtn,
-            isExpanded && { backgroundColor: `${AppColors_1.AppColors.sky400}30`, borderColor: `${AppColors_1.AppColors.sky400}70` },
-        ]} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
-              <NetworkIcons_1.ExpandCollapseIcon size={14} isExpanded={isExpanded} color={isExpanded ? AppColors_1.AppColors.sky400 : AppColors_1.AppColors.white}/>
+            <TouchableScale_1.default accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.delete")}onPress={I}style={previewStyles.headerDeleteBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.TrashIcon size={14}color={AppColors_1.AppColors.red500}/>
+            </TouchableScale_1.default>
+
+            <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={n?o("mediaGallery.collapse","Exit Fullscreen"):o("mediaGallery.expand","Expand Fullscreen")}onPress={()=>T(!n)}style={[previewStyles.headerIconBtn,n&&{backgroundColor:`${AppColors_1.AppColors.sky400}30`,borderColor:`${AppColors_1.AppColors.sky400}70`}]}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.ExpandCollapseIcon size={14}isExpanded={n}color={n?AppColors_1.AppColors.sky400:AppColors_1.AppColors.white}/>
             </react_native_1.TouchableOpacity>
 
-            <react_native_1.TouchableOpacity accessible={true} accessibilityRole="button" accessibilityLabel={t('mediaGallery.minimize', 'Minimize')} onPress={onClose} style={previewStyles.headerIconBtn} hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}>
-              <NetworkIcons_1.ChevronDownIcon size={15} color={AppColors_1.AppColors.white}/>
+            <react_native_1.TouchableOpacity accessible={!0}accessibilityRole="button"accessibilityLabel={o("mediaGallery.minimize","Minimize")}onPress={a}style={previewStyles.headerIconBtn}hitSlop={{top:10,bottom:10,left:10,right:10}}>
+              <NetworkIcons_1.ChevronDownIcon size={15}color={AppColors_1.AppColors.white}/>
             </react_native_1.TouchableOpacity>
           </react_native_1.View>
         </react_native_1.View>
 
         
-        <react_native_1.View style={[
-            previewStyles.stage,
-            isExpanded && previewStyles.stageExpanded,
-            !hasBottomToolbar && {
-                paddingBottom: react_native_1.Platform.OS === 'ios' ? 34 : 16,
-            },
-        ]}>
-          <react_native_1.TouchableOpacity activeOpacity={isVideo ? 0.9 : 1} onPress={isVideo ? handlePlayVideo : undefined} style={[
-            previewStyles.previewCard,
-            isExpanded && previewStyles.previewCardExpanded,
-        ]}>
-            {isVideo ? (item.thumbnailUri && !imageError ? (<>
-                  <react_native_1.Image source={{ uri: item.thumbnailUri }} style={previewStyles.image} resizeMode="contain" onError={() => setImageError(true)}/>
+        <react_native_1.View style={[previewStyles.stage,n&&previewStyles.stageExpanded,!m&&{paddingBottom:react_native_1.Platform.OS==="ios"?34:16}]}>
+          <react_native_1.TouchableOpacity activeOpacity={s?.9:1}onPress={s?w:void 0}style={[previewStyles.previewCard,n&&previewStyles.previewCardExpanded]}>
+            {s?e.thumbnailUri&&!v?<>
+                  <react_native_1.Image source={{uri:e.thumbnailUri}}style={previewStyles.image}resizeMode="contain"onError={()=>g(!0)}/>
                   <react_native_1.View style={previewStyles.videoImageOverlay}/>
-                </>) : (<react_native_1.View style={previewStyles.videoFallbackBackdrop}>
+                </>:<react_native_1.View style={previewStyles.videoFallbackBackdrop}>
                   <react_native_1.View style={previewStyles.videoFallbackGlow}/>
-                  <NetworkIcons_1.FilmIcon size={52} color={AppColors_1.AppColors.sky400}/>
-                  <react_native_1.Text style={previewStyles.videoFallbackTitle}>
-                    {t('mediaGallery.playVideo', 'Play Video')}
-                  </react_native_1.Text>
+                  <NetworkIcons_1.FilmIcon size={44}color={AppColors_1.AppColors.sky400}/>
                   <react_native_1.Text style={previewStyles.videoFallbackSubtitle}>
-                    {item.width && item.height ? `${item.width} × ${item.height}` : 'HD Video'} • MP4
+                    {e.width&&e.height?`${e.width} \xD7 ${e.height}`:"HD Video"} • MP4
                   </react_native_1.Text>
-                </react_native_1.View>)) : (<react_native_1.Image source={{ uri: item.uri }} style={previewStyles.image} resizeMode="contain" onError={() => setImageError(true)}/>)}
+                </react_native_1.View>:<react_native_1.Image source={{uri:e.uri}}style={previewStyles.image}resizeMode="contain"onError={()=>g(!0)}/>}
 
             
-            {isVideo && (<react_native_1.View style={previewStyles.centerPlayOverlay}>
+            {s&&<react_native_1.View style={previewStyles.centerPlayOverlay}>
                 <react_native_1.View style={previewStyles.centerPlayCircle}>
-                  <NetworkIcons_1.PlayIcon size={30} color={AppColors_1.AppColors.white}/>
+                  <NetworkIcons_1.PlayIcon size={28}color={AppColors_1.AppColors.white}/>
                 </react_native_1.View>
                 <react_native_1.Text style={previewStyles.centerPlayText}>
-                  {t('mediaGallery.playVideo', 'Play Video')}
+                  {o("mediaGallery.playVideo","Play Video")}
                 </react_native_1.Text>
-              </react_native_1.View>)}
+              </react_native_1.View>}
 
             
-            {isVideo && (<react_native_1.View style={previewStyles.videoBadgeOverlay}>
+            {s&&<react_native_1.View style={previewStyles.videoBadgeOverlay}>
                 <react_native_1.View style={previewStyles.playPill}>
-                  <NetworkIcons_1.FilmIcon size={13} color={AppColors_1.AppColors.white}/>
+                  <NetworkIcons_1.FilmIcon size={12}color={AppColors_1.AppColors.sky400}/>
                   <react_native_1.Text style={previewStyles.playPillText}>
-                    {durationSec ? `${durationSec}s` : 'VIDEO'}
+                    {p?`${p}s`:"VIDEO"}
                   </react_native_1.Text>
                 </react_native_1.View>
-              </react_native_1.View>)}
+              </react_native_1.View>}
 
             
-            {isGif && (<react_native_1.View style={previewStyles.videoBadgeOverlay}>
-                <react_native_1.View style={[previewStyles.playPill, { backgroundColor: `${AppColors_1.AppColors.warningAmber}CC` }]}>
-                  <NetworkIcons_1.GifIcon size={13} color={AppColors_1.AppColors.white}/>
+            {d&&<react_native_1.View style={previewStyles.videoBadgeOverlay}>
+                <react_native_1.View style={[previewStyles.playPill,{backgroundColor:`${AppColors_1.AppColors.warningAmber}CC`}]}>
+                  <NetworkIcons_1.GifIcon size={12}color={AppColors_1.AppColors.white}/>
                   <react_native_1.Text style={previewStyles.playPillText}>ANIMATED GIF</react_native_1.Text>
                 </react_native_1.View>
-              </react_native_1.View>)}
+              </react_native_1.View>}
 
             
-            <react_native_1.View style={previewStyles.floatingMetaBadge}>
+            <react_native_1.TouchableOpacity activeOpacity={.8}onPress={u}style={previewStyles.floatingMetaBadge}>
+              <NetworkIcons_1.CopyIcon size={11}color={AppColors_1.AppColors.sky400}/>
               <react_native_1.Text style={previewStyles.floatingMetaText}>
-                {item.width && item.height ? `${item.width} × ${item.height}  •  ` : ''}
-                {(0, helpers_1.formatBytes)(item.sizeBytes)}
-                {durationSec ? `  •  ${durationSec}s` : ''}
+                {e.width&&e.height?`${e.width} \xD7 ${e.height}  \u2022  `:""}
+                {(0,helpers_1.formatBytes)(e.sizeBytes)}
               </react_native_1.Text>
-            </react_native_1.View>
+            </react_native_1.TouchableOpacity>
           </react_native_1.TouchableOpacity>
         </react_native_1.View>
 
         
-        {isVideo && (<react_native_1.View style={previewStyles.videoControlsPanel}>
+        {s&&<react_native_1.View style={previewStyles.videoControlsPanel}>
             
             <react_native_1.View style={previewStyles.progressSection}>
               <react_native_1.Text style={previewStyles.timeLabel}>
-                00:0{Math.floor(scrubPosition * (Number(durationSec) || 5))}
+                00:0{Math.floor(h*(Number(p)||5))}
               </react_native_1.Text>
-              <react_native_1.TouchableOpacity activeOpacity={0.8} onPress={() => setScrubPosition(pos => (pos >= 0.9 ? 0.1 : pos + 0.3))} style={previewStyles.progressTrack}>
-                <react_native_1.View style={[
-                previewStyles.progressFill,
-                { width: `${Math.max(10, Math.min(100, scrubPosition * 100))}%` },
-            ]}/>
-                <react_native_1.View style={[
-                previewStyles.scrubberThumb,
-                { left: `${Math.max(8, Math.min(96, scrubPosition * 100))}%` },
-            ]}/>
+              <react_native_1.TouchableOpacity activeOpacity={.8}onPress={()=>k(l=>l>=.9?.1:l+.3)}style={previewStyles.progressTrack}>
+                <react_native_1.View style={[previewStyles.progressFill,{width:`${Math.max(10,Math.min(100,h*100))}%`}]}/>
+                <react_native_1.View style={[previewStyles.scrubberThumb,{left:`${Math.max(8,Math.min(96,h*100))}%`}]}/>
               </react_native_1.TouchableOpacity>
-              <react_native_1.Text style={previewStyles.timeLabel}>{formattedDuration}</react_native_1.Text>
+              <react_native_1.Text style={previewStyles.timeLabel}>{F}</react_native_1.Text>
             </react_native_1.View>
 
             
             <react_native_1.View style={previewStyles.controlsRow}>
               
-              <react_native_1.TouchableOpacity onPress={handlePlayVideo} style={previewStyles.controlActionPill}>
-                {isPlaying ? (<NetworkIcons_1.PauseIcon size={14} color={AppColors_1.AppColors.sky400}/>) : (<NetworkIcons_1.PlayIcon size={14} color={AppColors_1.AppColors.sky400}/>)}
-                <react_native_1.Text style={[previewStyles.controlActionText, { color: AppColors_1.AppColors.sky400 }]}>
-                  {isPlaying ? t('mediaGallery.pause', 'Pause') : t('mediaGallery.play', 'Play')}
+              <react_native_1.TouchableOpacity onPress={w}style={previewStyles.controlActionPill}>
+                {C?<NetworkIcons_1.PauseIcon size={14}color={AppColors_1.AppColors.sky400}/>:<NetworkIcons_1.PlayIcon size={14}color={AppColors_1.AppColors.sky400}/>}
+                <react_native_1.Text style={[previewStyles.controlActionText,{color:AppColors_1.AppColors.sky400}]}>
+                  {C?o("mediaGallery.pause","Pause"):o("mediaGallery.play","Play")}
                 </react_native_1.Text>
               </react_native_1.TouchableOpacity>
 
               
               <react_native_1.View style={previewStyles.speedGroup}>
-                {['1.0x', '1.5x', '2.0x'].map(speed => (<react_native_1.TouchableOpacity key={speed} onPress={() => setPlaybackSpeed(speed)} style={[
-                    previewStyles.speedBtn,
-                    playbackSpeed === speed && previewStyles.speedBtnActive,
-                ]}>
-                    <react_native_1.Text style={[
-                    previewStyles.speedText,
-                    playbackSpeed === speed && previewStyles.speedTextActive,
-                ]}>
-                      {speed}
+                {["1.0x","1.5x","2.0x"].map(l=><react_native_1.TouchableOpacity key={l}onPress={()=>x(l)}style={[previewStyles.speedBtn,A===l&&previewStyles.speedBtnActive]}>
+                    <react_native_1.Text style={[previewStyles.speedText,A===l&&previewStyles.speedTextActive]}>
+                      {l}
                     </react_native_1.Text>
-                  </react_native_1.TouchableOpacity>))}
+                  </react_native_1.TouchableOpacity>)}
               </react_native_1.View>
 
               
-              <react_native_1.TouchableOpacity onPress={() => setIsLooping(!isLooping)} style={[
-                previewStyles.loopPill,
-                isLooping && previewStyles.loopPillActive,
-            ]}>
-                <NetworkIcons_1.RepeatIcon size={12} color={isLooping ? AppColors_1.AppColors.sky400 : AppColors_1.AppColors.whiteAlpha60}/>
-                <react_native_1.Text style={[
-                previewStyles.loopText,
-                isLooping && previewStyles.loopTextActive,
-            ]}>
-                  {isLooping ? 'Loop: ON' : 'Loop: OFF'}
+              <react_native_1.TouchableOpacity onPress={()=>S(!c)}style={[previewStyles.loopPill,c&&previewStyles.loopPillActive]}>
+                <NetworkIcons_1.RepeatIcon size={12}color={c?AppColors_1.AppColors.sky400:AppColors_1.AppColors.whiteAlpha60}/>
+                <react_native_1.Text style={[previewStyles.loopText,c&&previewStyles.loopTextActive]}>
+                  {c?"Loop: ON":"Loop: OFF"}
                 </react_native_1.Text>
               </react_native_1.TouchableOpacity>
             </react_native_1.View>
-          </react_native_1.View>)}
+          </react_native_1.View>}
 
         
-        {hasBottomToolbar && (<react_native_1.View style={previewStyles.footer}>
-            {isVideo && (<TouchableScale_1.default onPress={handlePlayVideo} style={[
-                    previewStyles.actionBtn,
-                    {
-                        backgroundColor: `${AppColors_1.AppColors.sky400}25`,
-                        borderColor: `${AppColors_1.AppColors.sky400}70`,
-                    },
-                ]}>
-                <NetworkIcons_1.PlayIcon size={15} color={AppColors_1.AppColors.sky400}/>
-                <react_native_1.Text style={[previewStyles.actionText, { color: AppColors_1.AppColors.sky400, fontFamily: AppFonts_1.AppFonts.interSemiBold }]}>
-                  {t('mediaGallery.playVideo', 'Play Video')}
-                </react_native_1.Text>
-              </TouchableScale_1.default>)}
+        {m&&<react_native_1.View style={previewStyles.footer}>
+            <TouchableScale_1.default onPress={u}style={[previewStyles.actionBtn,{backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderColor:AppColors_1.AppColors.whiteAlpha15}]}>
+              <NetworkIcons_1.CopyIcon size={14}color={AppColors_1.AppColors.slate200}/>
+              <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.slate200}]}>
+                {o("mediaGallery.copyUri","Copy URI")}
+              </react_native_1.Text>
+            </TouchableScale_1.default>
 
-            {onConvertToGif && isVideo && (<TouchableScale_1.default onPress={handleConvert} disabled={isConverting} style={[
-                    previewStyles.actionBtn,
-                    {
-                        backgroundColor: `${AppColors_1.AppColors.warningAmber}25`,
-                        borderColor: `${AppColors_1.AppColors.warningAmber}70`,
-                    },
-                ]}>
-                <NetworkIcons_1.GifIcon size={15} color={AppColors_1.AppColors.warningAmber}/>
-                <react_native_1.Text style={[previewStyles.actionText, { color: AppColors_1.AppColors.warningAmber }]}>
-                  {isConverting ? t('mediaGallery.converting') : t('mediaGallery.convertToGif')}
+            {r&&s&&<TouchableScale_1.default onPress={P}disabled={y}style={[previewStyles.actionBtn,{backgroundColor:`${AppColors_1.AppColors.warningAmber}22`,borderColor:`${AppColors_1.AppColors.warningAmber}70`}]}>
+                <NetworkIcons_1.GifIcon size={15}color={AppColors_1.AppColors.warningAmber}/>
+                <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.warningAmber}]}>
+                  {o(y?"mediaGallery.converting":"mediaGallery.convertToGif")}
                 </react_native_1.Text>
-              </TouchableScale_1.default>)}
-          </react_native_1.View>)}
+              </TouchableScale_1.default>}
+
+            <TouchableScale_1.default onPress={_}style={[previewStyles.actionBtn,{backgroundColor:`${AppColors_1.AppColors.sky400}22`,borderColor:`${AppColors_1.AppColors.sky400}70`}]}>
+              <NetworkIcons_1.ShareIcon size={14}color={AppColors_1.AppColors.sky400}/>
+              <react_native_1.Text style={[previewStyles.actionText,{color:AppColors_1.AppColors.sky400,fontFamily:AppFonts_1.AppFonts.interSemiBold}]}>
+                {o("mediaGallery.share","Share")}
+              </react_native_1.Text>
+            </TouchableScale_1.default>
+          </react_native_1.View>}
       </react_native_1.View>
-    </react_native_1.Modal>);
-};
-exports.MediaPreviewModal = MediaPreviewModal;
-const previewStyles = react_native_1.StyleSheet.create({
-    overlay: {
-        flex: 1,
-        backgroundColor: '#090D16FA',
-        justifyContent: 'space-between',
-    },
-    header: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        paddingHorizontal: 16,
-        paddingTop: react_native_1.Platform.OS === 'ios' ? 52 : 20,
-        paddingBottom: 14,
-        borderBottomWidth: 1,
-        borderBottomColor: AppColors_1.AppColors.borderGlassLight,
-        backgroundColor: AppColors_1.AppColors.headerGlassDark,
-    },
-    headerLeft: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 10,
-        flex: 1,
-        minWidth: 0,
-        marginRight: 10,
-    },
-    headerRight: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 8,
-    },
-    badge: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 4,
-        paddingHorizontal: 8,
-        paddingVertical: 4,
-        borderRadius: 6,
-        borderWidth: 1,
-    },
-    badgeText: {
-        fontFamily: AppFonts_1.AppFonts.interBold,
-        fontSize: 10.5,
-        letterSpacing: 0.4,
-    },
-    title: {
-        fontFamily: AppFonts_1.AppFonts.interSemiBold,
-        fontSize: 13.5,
-        color: AppColors_1.AppColors.white,
-    },
-    subtitle: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 11,
-        color: AppColors_1.AppColors.whiteAlpha60,
-        marginTop: 1,
-    },
-    headerDeleteBtn: {
-        width: 32,
-        height: 32,
-        borderRadius: 16,
-        backgroundColor: `${AppColors_1.AppColors.red500}20`,
-        borderWidth: 1,
-        borderColor: `${AppColors_1.AppColors.red500}60`,
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    headerIconBtn: {
-        width: 32,
-        height: 32,
-        borderRadius: 16,
-        backgroundColor: AppColors_1.AppColors.whiteAlpha12,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.whiteAlpha20,
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    stage: {
-        flex: 1,
-        alignItems: 'center',
-        justifyContent: 'center',
-        paddingHorizontal: 10,
-        paddingTop: 10,
-        paddingBottom: 10,
-    },
-    stageExpanded: {
-        paddingHorizontal: 0,
-        paddingTop: 0,
-        paddingBottom: 0,
-    },
-    previewCard: {
-        flex: 1,
-        width: '100%',
-        borderRadius: 14,
-        overflow: 'hidden',
-        backgroundColor: '#05070D',
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.borderGlassLight,
-        alignItems: 'center',
-        justifyContent: 'center',
-        position: 'relative',
-    },
-    previewCardExpanded: {
-        borderRadius: 0,
-        borderWidth: 0,
-    },
-    image: {
-        width: '100%',
-        height: '100%',
-    },
-    videoImageOverlay: {
-        ...react_native_1.StyleSheet.absoluteFillObject,
-        backgroundColor: 'rgba(5, 7, 13, 0.25)',
-    },
-    videoFallbackBackdrop: {
-        flex: 1,
-        width: '100%',
-        backgroundColor: '#070C18',
-        alignItems: 'center',
-        justifyContent: 'center',
-        gap: 8,
-    },
-    videoFallbackGlow: {
-        position: 'absolute',
-        width: 140,
-        height: 140,
-        borderRadius: 70,
-        backgroundColor: `${AppColors_1.AppColors.sky400}18`,
-    },
-    videoFallbackTitle: {
-        fontFamily: AppFonts_1.AppFonts.interSemiBold,
-        fontSize: 15,
-        color: AppColors_1.AppColors.white,
-        marginTop: 8,
-    },
-    videoFallbackSubtitle: {
-        fontFamily: AppFonts_1.AppFonts.interRegular,
-        fontSize: 12,
-        color: AppColors_1.AppColors.whiteAlpha60,
-    },
-    centerPlayOverlay: {
-        position: 'absolute',
-        alignItems: 'center',
-        justifyContent: 'center',
-        gap: 8,
-    },
-    centerPlayCircle: {
-        width: 64,
-        height: 64,
-        borderRadius: 32,
-        backgroundColor: `${AppColors_1.AppColors.sky400}E0`,
-        alignItems: 'center',
-        justifyContent: 'center',
-        paddingLeft: 3,
-        shadowColor: AppColors_1.AppColors.sky400,
-        shadowOffset: { width: 0, height: 4 },
-        shadowOpacity: 0.5,
-        shadowRadius: 10,
-        elevation: 8,
-    },
-    centerPlayText: {
-        fontFamily: AppFonts_1.AppFonts.interSemiBold,
-        fontSize: 13,
-        color: AppColors_1.AppColors.white,
-        letterSpacing: 0.3,
-        textShadowColor: 'rgba(0,0,0,0.7)',
-        textShadowOffset: { width: 0, height: 1 },
-        textShadowRadius: 3,
-    },
-    videoBadgeOverlay: {
-        position: 'absolute',
-        bottom: 12,
-        left: 12,
-    },
-    playPill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 6,
-        backgroundColor: `${AppColors_1.AppColors.slate900}D9`,
-        paddingHorizontal: 10,
-        paddingVertical: 5,
-        borderRadius: 16,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.whiteAlpha20,
-    },
-    playPillText: {
-        fontFamily: AppFonts_1.AppFonts.interSemiBold,
-        fontSize: 11,
-        color: AppColors_1.AppColors.white,
-        letterSpacing: 0.3,
-    },
-    floatingMetaBadge: {
-        position: 'absolute',
-        bottom: 10,
-        backgroundColor: `${AppColors_1.AppColors.slate900}D9`,
-        paddingHorizontal: 10,
-        paddingVertical: 4.5,
-        borderRadius: 8,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.whiteAlpha15,
-        alignItems: 'center',
-        justifyContent: 'center',
-    },
-    floatingMetaText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.slate200,
-        letterSpacing: 0.2,
-    },
-    videoControlsPanel: {
-        paddingHorizontal: 16,
-        paddingTop: 8,
-        paddingBottom: 6,
-        backgroundColor: AppColors_1.AppColors.headerGlassDark,
-        borderTopWidth: 1,
-        borderTopColor: AppColors_1.AppColors.borderGlassLight,
-        gap: 8,
-    },
-    progressSection: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 10,
-    },
-    timeLabel: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 11,
-        color: AppColors_1.AppColors.whiteAlpha60,
-        minWidth: 42,
-    },
-    progressTrack: {
-        flex: 1,
-        height: 6,
-        borderRadius: 3,
-        backgroundColor: AppColors_1.AppColors.whiteAlpha15,
-        justifyContent: 'center',
-        position: 'relative',
-    },
-    progressFill: {
-        height: '100%',
-        borderRadius: 3,
-        backgroundColor: AppColors_1.AppColors.sky400,
-    },
-    scrubberThumb: {
-        position: 'absolute',
-        width: 12,
-        height: 12,
-        borderRadius: 6,
-        backgroundColor: AppColors_1.AppColors.white,
-        borderWidth: 2,
-        borderColor: AppColors_1.AppColors.sky400,
-        top: -3,
-        marginLeft: -6,
-    },
-    controlsRow: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        paddingVertical: 2,
-    },
-    controlActionPill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 5,
-        paddingHorizontal: 10,
-        paddingVertical: 5,
-        borderRadius: 6,
-        backgroundColor: `${AppColors_1.AppColors.sky400}18`,
-        borderWidth: 1,
-        borderColor: `${AppColors_1.AppColors.sky400}50`,
-    },
-    controlActionText: {
-        fontFamily: AppFonts_1.AppFonts.interSemiBold,
-        fontSize: 11.5,
-    },
-    speedGroup: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        backgroundColor: AppColors_1.AppColors.whiteAlpha08,
-        borderRadius: 6,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.whiteAlpha12,
-        padding: 2,
-        gap: 2,
-    },
-    speedBtn: {
-        paddingHorizontal: 7,
-        paddingVertical: 3,
-        borderRadius: 4,
-    },
-    speedBtnActive: {
-        backgroundColor: `${AppColors_1.AppColors.sky400}30`,
-    },
-    speedText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.whiteAlpha60,
-    },
-    speedTextActive: {
-        color: AppColors_1.AppColors.sky400,
-        fontFamily: AppFonts_1.AppFonts.interBold,
-    },
-    loopPill: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 4,
-        paddingHorizontal: 8,
-        paddingVertical: 5,
-        borderRadius: 6,
-        backgroundColor: AppColors_1.AppColors.whiteAlpha08,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.whiteAlpha12,
-    },
-    loopPillActive: {
-        backgroundColor: `${AppColors_1.AppColors.sky400}18`,
-        borderColor: `${AppColors_1.AppColors.sky400}50`,
-    },
-    loopText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 10.5,
-        color: AppColors_1.AppColors.whiteAlpha60,
-    },
-    loopTextActive: {
-        color: AppColors_1.AppColors.sky400,
-        fontFamily: AppFonts_1.AppFonts.interSemiBold,
-    },
-    footer: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        justifyContent: 'center',
-        flexWrap: 'wrap',
-        gap: 8,
-        paddingHorizontal: 16,
-        paddingTop: 8,
-        paddingBottom: react_native_1.Platform.OS === 'ios' ? 34 : 16,
-        borderTopWidth: 1,
-        borderTopColor: AppColors_1.AppColors.borderGlassLight,
-        backgroundColor: AppColors_1.AppColors.headerGlassDark,
-    },
-    actionBtn: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        gap: 6,
-        paddingHorizontal: 16,
-        paddingVertical: 9,
-        borderRadius: 8,
-        backgroundColor: AppColors_1.AppColors.whiteAlpha08,
-        borderWidth: 1,
-        borderColor: AppColors_1.AppColors.whiteAlpha15,
-    },
-    actionText: {
-        fontFamily: AppFonts_1.AppFonts.interMedium,
-        fontSize: 12,
-        color: AppColors_1.AppColors.white,
-    },
-});
+    </react_native_1.Modal>};exports.MediaPreviewModal=MediaPreviewModal;const previewStyles=react_native_1.StyleSheet.create({overlay:{flex:1,backgroundColor:"#090D16FA",justifyContent:"space-between"},header:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingHorizontal:16,paddingTop:react_native_1.Platform.OS==="ios"?52:20,paddingBottom:14,borderBottomWidth:1,borderBottomColor:AppColors_1.AppColors.borderGlassLight,backgroundColor:AppColors_1.AppColors.headerGlassDark},headerLeft:{flexDirection:"row",alignItems:"center",gap:10,flex:1,minWidth:0,marginRight:10},headerRight:{flexDirection:"row",alignItems:"center",gap:8},badge:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:4,borderRadius:6,borderWidth:1},badgeText:{fontFamily:AppFonts_1.AppFonts.interBold,fontSize:10.5,letterSpacing:.4},title:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:13.5,color:AppColors_1.AppColors.white},subtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:11,color:AppColors_1.AppColors.whiteAlpha60,marginTop:1},headerActionBtn:{width:32,height:32,borderRadius:16,backgroundColor:AppColors_1.AppColors.whiteAlpha12,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20,alignItems:"center",justifyContent:"center"},headerShareBtn:{width:32,height:32,borderRadius:16,backgroundColor:`${AppColors_1.AppColors.sky400}20`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky400}60`,alignItems:"center",justifyContent:"center"},headerDeleteBtn:{width:32,height:32,borderRadius:16,backgroundColor:`${AppColors_1.AppColors.red500}20`,borderWidth:1,borderColor:`${AppColors_1.AppColors.red500}60`,alignItems:"center",justifyContent:"center"},headerIconBtn:{width:32,height:32,borderRadius:16,backgroundColor:AppColors_1.AppColors.whiteAlpha12,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20,alignItems:"center",justifyContent:"center"},stage:{flex:1,alignItems:"center",justifyContent:"center",paddingHorizontal:10,paddingTop:10,paddingBottom:10},stageExpanded:{paddingHorizontal:0,paddingTop:0,paddingBottom:0},previewCard:{flex:1,width:"100%",borderRadius:14,overflow:"hidden",backgroundColor:"#05070D",borderWidth:1,borderColor:AppColors_1.AppColors.borderGlassLight,alignItems:"center",justifyContent:"center",position:"relative"},previewCardExpanded:{borderRadius:0,borderWidth:0},image:{width:"100%",height:"100%"},videoImageOverlay:{...react_native_1.StyleSheet.absoluteFillObject,backgroundColor:"rgba(5, 7, 13, 0.25)"},videoFallbackBackdrop:{flex:1,width:"100%",backgroundColor:"#070C18",alignItems:"center",justifyContent:"center",gap:8},videoFallbackGlow:{position:"absolute",width:140,height:140,borderRadius:70,backgroundColor:`${AppColors_1.AppColors.sky400}18`},videoFallbackTitle:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:15,color:AppColors_1.AppColors.white,marginTop:8},videoFallbackSubtitle:{fontFamily:AppFonts_1.AppFonts.interRegular,fontSize:12,color:AppColors_1.AppColors.whiteAlpha60},centerPlayOverlay:{position:"absolute",alignItems:"center",justifyContent:"center",gap:8},centerPlayCircle:{width:64,height:64,borderRadius:32,backgroundColor:`${AppColors_1.AppColors.sky400}E0`,alignItems:"center",justifyContent:"center",paddingLeft:3,shadowColor:AppColors_1.AppColors.sky400,shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:10,elevation:8},centerPlayText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:13,color:AppColors_1.AppColors.white,letterSpacing:.3,textShadowColor:"rgba(0,0,0,0.7)",textShadowOffset:{width:0,height:1},textShadowRadius:3},videoBadgeOverlay:{position:"absolute",bottom:12,left:12},playPill:{flexDirection:"row",alignItems:"center",gap:6,backgroundColor:`${AppColors_1.AppColors.slate900}D9`,paddingHorizontal:10,paddingVertical:5,borderRadius:16,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha20},playPillText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11,color:AppColors_1.AppColors.white,letterSpacing:.3},floatingMetaBadge:{position:"absolute",bottom:10,backgroundColor:`${AppColors_1.AppColors.slate900}D9`,paddingHorizontal:10,paddingVertical:4.5,borderRadius:8,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha15,alignItems:"center",justifyContent:"center"},floatingMetaText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.slate200,letterSpacing:.2},videoControlsPanel:{paddingHorizontal:16,paddingTop:8,paddingBottom:6,backgroundColor:AppColors_1.AppColors.headerGlassDark,borderTopWidth:1,borderTopColor:AppColors_1.AppColors.borderGlassLight,gap:8},progressSection:{flexDirection:"row",alignItems:"center",gap:10},timeLabel:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:11,color:AppColors_1.AppColors.whiteAlpha60,minWidth:42},progressTrack:{flex:1,height:6,borderRadius:3,backgroundColor:AppColors_1.AppColors.whiteAlpha15,justifyContent:"center",position:"relative"},progressFill:{height:"100%",borderRadius:3,backgroundColor:AppColors_1.AppColors.sky400},scrubberThumb:{position:"absolute",width:12,height:12,borderRadius:6,backgroundColor:AppColors_1.AppColors.white,borderWidth:2,borderColor:AppColors_1.AppColors.sky400,top:-3,marginLeft:-6},controlsRow:{flexDirection:"row",alignItems:"center",justifyContent:"space-between",paddingVertical:2},controlActionPill:{flexDirection:"row",alignItems:"center",gap:5,paddingHorizontal:10,paddingVertical:5,borderRadius:6,backgroundColor:`${AppColors_1.AppColors.sky400}18`,borderWidth:1,borderColor:`${AppColors_1.AppColors.sky400}50`},controlActionText:{fontFamily:AppFonts_1.AppFonts.interSemiBold,fontSize:11.5},speedGroup:{flexDirection:"row",alignItems:"center",backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderRadius:6,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha12,padding:2,gap:2},speedBtn:{paddingHorizontal:7,paddingVertical:3,borderRadius:4},speedBtnActive:{backgroundColor:`${AppColors_1.AppColors.sky400}30`},speedText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.whiteAlpha60},speedTextActive:{color:AppColors_1.AppColors.sky400,fontFamily:AppFonts_1.AppFonts.interBold},loopPill:{flexDirection:"row",alignItems:"center",gap:4,paddingHorizontal:8,paddingVertical:5,borderRadius:6,backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha12},loopPillActive:{backgroundColor:`${AppColors_1.AppColors.sky400}18`,borderColor:`${AppColors_1.AppColors.sky400}50`},loopText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:10.5,color:AppColors_1.AppColors.whiteAlpha60},loopTextActive:{color:AppColors_1.AppColors.sky400,fontFamily:AppFonts_1.AppFonts.interSemiBold},footer:{flexDirection:"row",alignItems:"center",justifyContent:"center",flexWrap:"wrap",gap:8,paddingHorizontal:16,paddingTop:8,paddingBottom:react_native_1.Platform.OS==="ios"?34:16,borderTopWidth:1,borderTopColor:AppColors_1.AppColors.borderGlassLight,backgroundColor:AppColors_1.AppColors.headerGlassDark},actionBtn:{flexDirection:"row",alignItems:"center",gap:6,paddingHorizontal:16,paddingVertical:9,borderRadius:8,backgroundColor:AppColors_1.AppColors.whiteAlpha08,borderWidth:1,borderColor:AppColors_1.AppColors.whiteAlpha15},actionText:{fontFamily:AppFonts_1.AppFonts.interMedium,fontSize:12,color:AppColors_1.AppColors.white}});