@applicaster/quick-brick-player 12.0.12-rc.1 → 12.0.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@applicaster/quick-brick-player",
-  "version": "12.0.12-rc.1",
+  "version": "12.0.12",
   "description": "Quick Brick Player",
   "main": "./src/index.ts",
   "types": "index.d.ts",
@@ -36,11 +36,11 @@
   },
   "homepage": "https://github.com/applicaster/quickbrick#readme",
   "dependencies": {
-    "@applicaster/quick-brick-mobile-transport-controls": "12.0.12-rc.0",
+    "@applicaster/quick-brick-mobile-transport-controls": "12.0.12",
     "@applicaster/quick-brick-tv-transport-controls": "12.0.4",
-    "@applicaster/zapp-react-native-tvos-app": "12.0.12-rc.1",
-    "@applicaster/zapp-react-native-ui-components": "12.0.12-rc.1",
-    "@applicaster/zapp-react-native-utils": "12.0.12-rc.1",
+    "@applicaster/zapp-react-native-tvos-app": "12.0.12",
+    "@applicaster/zapp-react-native-ui-components": "12.0.12",
+    "@applicaster/zapp-react-native-utils": "12.0.12",
     "keymirror": "^0.1.1",
     "query-string": "7.1.3",
     "react-native-web-linear-gradient": "1.1.2",

package/src/Player/AudioLayer/AudioPlayerWrapper.tsx

@@ -41,6 +41,7 @@ import {
 } from "./SleepTimerManager";
 import { SpeedController, PlaybackSpeed, DEFAULT_SPEED } from "./SpeedManager";
 import { imageSrcFromMediaItem } from "@applicaster/zapp-react-native-utils/configurationUtils";
+import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
 
 const { log_debug } = createLogger({
   subsystem: "UIComponent",
@@ -58,6 +59,7 @@ type Configuration = {
   [key: string]: any;
   magic_background?: boolean;
   audio_player_background_image_query?: string;
+  audio_player_background_image_default_color?: string;
   tablet_landscape_sidebar_width?: string;
   tablet_landscape_player_container_background_color?: string;
 };
@@ -132,6 +134,7 @@ const edges: Edge[] = ["right", "left", "top"];
 export const AudioPlayerWrapper: React.FC<Props> = (props: Props) => {
   const player = usePlayer();
   const playerState = usePlayerState("audio-player-wrapper");
+  const theme = useTheme();
 
   const {
     docked,
@@ -451,6 +454,10 @@ export const AudioPlayerWrapper: React.FC<Props> = (props: Props) => {
     const queryParamName =
       configuration.audio_player_background_image_query || "width";
 
+    const defaultBackgroundColor =
+      configuration.audio_player_background_image_default_color ||
+      theme?.app_background_color;
+
     const queryParamValue = 15;
 
     const url =
@@ -461,7 +468,7 @@ export const AudioPlayerWrapper: React.FC<Props> = (props: Props) => {
         image={url}
         fallbackUrl={baseUrl}
         colors={entry?.extensions?.backgroundColors}
-        defaultColor="#000000"
+        defaultColor={defaultBackgroundColor}
       >
         {MainContent}
       </MagicBG>

package/src/Player/index.tsx

@@ -996,15 +996,16 @@ export default class VideoPlayer extends React.Component<
 
     const renderMobilePlayer = () => {
       return isFullScreenAudioPlayer && isAudioItem ? (
-        <View style={containerStyle}>
-          {(!castAction?.state?.connected || supportNativeCast) && (
+        // Ensure the View remains in the native hierarchy for proper rendering and interaction
+        <View collapsable={false} style={containerStyle}>
+          {!castAction?.state?.connected || supportNativeCast ? (
             <this.props.PlayerComponent
               ref={this._assignRoot}
               {...nativeEvents}
               {...nativeProps}
               listener={this.props.listener}
             />
-          )}
+          ) : null}
           <AudioPlayerWrapper {...sharedWrapperViewProps} />
         </View>
       ) : (