@applicaster/zapp-react-native-ui-components 14.0.0-alpha.8419134002 → 14.0.0-alpha.9848043301

package/Components/AudioPlayer/tv/Layout.tsx

@@ -1,168 +0,0 @@
-import * as React from "react";
-import { ImageBackground, View, ViewStyle } from "react-native";
-
-import { platformSelect } from "@applicaster/zapp-react-native-utils/reactUtils";
-
-import { Artwork } from "./Artwork";
-import { directionStyles } from "./helpers";
-
-type Props = {
-  artwork: string;
-  config: {
-    titleColor: string;
-    summaryColor: string;
-    backgroundImageOverlay?: string;
-    backgroundColor: string;
-    backgroundImage: Option<string>;
-    isRTL: boolean;
-    artworkBorderRadius: Option<number>;
-  };
-  children: React.ReactNode;
-  style: ViewStyle;
-};
-
-const backgroundImgStyles = platformSelect({
-  tvos: {
-    width: "100%",
-    height: "100%",
-    alignItems: "center",
-    justifyContent: "center",
-  },
-  android_tv: {
-    width: "100%",
-    height: "100%",
-    alignItems: "center",
-    justifyContent: "center",
-  },
-  web: {
-    position: "absolute",
-    margin: "auto",
-    display: "flex",
-    flexWrap: "wrap",
-    width: "100%",
-    height: "100%",
-    flex: 1,
-    alignItems: "center",
-    justifyContent: "center",
-  },
-});
-
-export function AudioPlayerTVLayout({
-  artwork,
-  config,
-  children,
-  style,
-}: Props) {
-  const { backgroundColor, backgroundImage, backgroundImageOverlay, isRTL } =
-    config;
-
-  const backgroundImageSource = { uri: backgroundImage };
-
-  const backgroundColorStyle = backgroundImage
-    ? "transparent"
-    : backgroundColor;
-
-  const textContainerStyles = platformSelect({
-    tvos: {
-      justifyContent: "center",
-      alignItems: directionStyles(isRTL).justifyContent,
-    },
-    android_tv: {
-      justifyContent: "center",
-      alignItems: directionStyles(isRTL).justifyContent,
-    },
-    web: {
-      justifyContent: "center",
-      alignItems: directionStyles(isRTL).justifyContent,
-    },
-  });
-
-  const mainContainerStyles = React.useMemo(
-    () =>
-      platformSelect({
-        tvos: {
-          width: "100%",
-          height: "100%",
-          alignItems: "center",
-          justifyContent: "center",
-          flexDirection: directionStyles(isRTL).flexDirection,
-          backgroundColor: backgroundColorStyle,
-        },
-        android_tv: {
-          width: "100%",
-          height: "100%",
-          alignItems: "center",
-          justifyContent: "center",
-          flexDirection: directionStyles(isRTL).flexDirection,
-          backgroundColor: backgroundColorStyle,
-        },
-        web: {
-          width: 1920,
-          height: 1080,
-          alignItems: "center",
-          justifyContent: "center",
-          flexDirection: directionStyles(isRTL).flexDirection,
-          backgroundColor: backgroundColorStyle,
-        },
-        native: {
-          backgroundColor: backgroundColorStyle,
-          overflow: "hidden",
-          ...style,
-        },
-        samsung_tv: {
-          position: "absolute",
-          margin: "auto",
-          display: "flex",
-          flexWrap: "wrap",
-          height: "100vh",
-          width: "100vw",
-          alignItems: "center",
-          justifyContent: "center",
-          flexDirection: directionStyles(isRTL).flexDirection,
-          backgroundColor: backgroundColorStyle,
-        },
-        lg_tv: {
-          position: "absolute",
-          margin: "auto",
-          display: "flex",
-          flexWrap: "wrap",
-          height: "100vh",
-          width: "100vw",
-          alignItems: "center",
-          justifyContent: "center",
-          flexDirection: directionStyles(isRTL).flexDirection,
-          backgroundColor: backgroundColorStyle,
-        },
-      }),
-    [backgroundColorStyle, isRTL, style]
-  );
-
-  const backgroundOverlayStyles = React.useMemo(
-    () => ({
-      backgroundColor: backgroundImageOverlay,
-    }),
-    [backgroundImageOverlay]
-  );
-
-  if (backgroundImage) {
-    return (
-      <ImageBackground
-        source={backgroundImageSource}
-        style={backgroundImgStyles}
-        resizeMode="cover"
-      >
-        <View style={[mainContainerStyles, backgroundOverlayStyles]}>
-          <Artwork srcImage={artwork} config={config} />
-          <View style={textContainerStyles}>{children}</View>
-        </View>
-      </ImageBackground>
-    );
-  }
-
-  return (
-    <View style={mainContainerStyles}>
-      <Artwork srcImage={artwork} config={config} />
-      <View style={textContainerStyles}>{children}</View>
-    </View>
-  );
-}

package/Components/AudioPlayer/tv/__tests__/__snapshots__/audioPlayer.test.js.snap

@@ -1,164 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`<AudioPlayerTV /> renders correctly 1`] = `
-<View
-  accessibilityIgnoresInvertColors={true}
->
-  <Image
-    resizeMode="cover"
-    source={
-      {
-        "uri": "https://example.com",
-      }
-    }
-    style={
-      [
-        {
-          "bottom": 0,
-          "left": 0,
-          "position": "absolute",
-          "right": 0,
-          "top": 0,
-        },
-        {
-          "height": undefined,
-          "width": undefined,
-        },
-        undefined,
-      ]
-    }
-  />
-  <View
-    style={
-      [
-        {
-          "backgroundColor": "transparent",
-          "overflow": "hidden",
-        },
-        {
-          "backgroundColor": undefined,
-        },
-      ]
-    }
-  >
-    <View
-      style={
-        {
-          "marginHorizontal": 24,
-        }
-      }
-    >
-      <Image
-        fadeDuration={0}
-        resizeMode="cover"
-        source={
-          {
-            "uri": "artwork_url",
-          }
-        }
-        style={
-          [
-            {
-              "height": 400,
-              "width": 400,
-            },
-            {
-              "borderRadius": 0,
-            },
-          ]
-        }
-      />
-    </View>
-    <View>
-      <Image
-        fadeDuration={0}
-        source={
-          {
-            "uri": "https://example.com",
-          }
-        }
-        style={
-          {
-            "height": 72,
-            "marginBottom": 30,
-            "width": 128,
-          }
-        }
-      />
-      <View
-        style={
-          {
-            "marginBottom": 12,
-            "width": 600,
-          }
-        }
-      >
-        <Text
-          numberOfLines={3}
-          style={
-            {
-              "color": "white",
-              "fontFamily": null,
-              "fontSize": 38,
-              "fontWeight": "600",
-              "textAlign": "right",
-            }
-          }
-        >
-          tittle
-        </Text>
-      </View>
-      <View
-        style={
-          {
-            "marginBottom": 30,
-            "width": 600,
-          }
-        }
-      >
-        <Text
-          numberOfLines={3}
-          style={
-            {
-              "color": "white",
-              "fontFamily": null,
-              "fontSize": 20,
-              "fontWeight": "600",
-              "opacity": 0.8,
-              "textAlign": "right",
-            }
-          }
-        >
-          Summary
-        </Text>
-      </View>
-      <View
-        style={
-          {
-            "justifyContent": "flex-end",
-            "width": 600,
-          }
-        }
-      >
-        <Text
-          numberOfLines={1}
-          style={
-            {
-              "alignItems": "flex-start",
-              "color": "white",
-              "flexDirection": "row-reverse",
-              "fontFamily": null,
-              "fontSize": 20,
-              "justifyContent": "flex-end",
-              "opacity": 0.8,
-              "textAlign": "right",
-            }
-          }
-        >
-          10:10 - 11:11
-        </Text>
-      </View>
-    </View>
-  </View>
-</View>
-`;

package/Components/AudioPlayer/tv/__tests__/__snapshots__/channel.test.js.snap

@@ -1,19 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`<Channel /> renders correctly 1`] = `
-<Image
-  fadeDuration={0}
-  source={
-    {
-      "uri": "https://example.com",
-    }
-  }
-  style={
-    {
-      "height": 72,
-      "marginBottom": 30,
-      "width": 128,
-    }
-  }
-/>
-`;

package/Components/AudioPlayer/types.ts

@@ -1,40 +0,0 @@
-import { ViewStyle } from "react-native";
-
-export type Props = {
-  audio_item: ZappEntry & {
-    extensions?: {
-      audio_player_artwork_aspect_ratio?: string;
-      audio_player_background_image?: string;
-      audio_player_background_color?: string;
-      audio_player_channel_icon?: string;
-      audio_player_title_color?: string;
-      audio_player_summary_color?: string;
-      audio_player_rtl?: boolean;
-      audio_player_background_image_default_color?: string;
-      start_time?: string;
-      end_time?: string;
-    };
-  };
-  plugin_configuration: {
-    audio_player_background_color?: string;
-    audio_player_title_color?: string;
-    audio_player_summary_color?: string;
-    audio_player_rtl?: string;
-    audio_player_background_image_default_color?: string;
-    audio_player_background_image?: string;
-    audio_player_artwork_aspect_ratio?: string;
-    lg_tv_audio_player_title_font_family?: string;
-    lg_tv_audio_player_title_font_size?: number;
-    lg_tv_audio_player_summary_font_family?: string;
-    lg_tv_audio_player_summary_font_size?: number;
-    samsung_tv_audio_player_title_font_family?: string;
-    samsung_tv_audio_player_title_font_size?: number;
-    samsung_tv_audio_player_summary_font_family?: string;
-    samsung_tv_audio_player_summary_font_size?: number;
-    tv_os_audio_player_title_font_family?: string;
-    tv_os_audio_player_title_font_size?: number;
-    tv_os_audio_player_summary_font_family?: string;
-    tv_os_audio_player_summary_font_size?: number;
-  };
-  style?: ViewStyle;
-};

package/Components/VideoModal/hooks/useBackgroundColor.ts

@@ -1,10 +0,0 @@
-import { useTheme } from "@applicaster/zapp-react-native-utils/theme";
-import { useConfiguration } from "../utils";
-
-export const useBackgroundColor = (): string => {
-  const { modal_background_color: modalBackgroundColor } = useConfiguration();
-
-  const theme = useTheme<BaseThemePropertiesMobile>();
-
-  return modalBackgroundColor || theme?.status_background_color;
-};