@applicaster/zapp-react-native-ui-components 13.0.0-alpha.2833001702 → 13.0.0-alpha.2886020207

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/Components/AudioPlayer/AudioPlayer.tsx +7 -4
  2. package/Components/AudioPlayer/helpers.tsx +1 -1
  3. package/Components/Cell/Cell.tsx +3 -13
  4. package/Components/Cell/CellWithFocusable.tsx +21 -15
  5. package/Components/Cell/CellWrapper.tsx +18 -0
  6. package/Components/Cell/styles.ts +17 -0
  7. package/Components/CellRendererResolver/index.ts +2 -1
  8. package/Components/ErrorScreen/index.tsx +8 -0
  9. package/Components/FocusableCell/index.tsx +1 -1
  10. package/Components/FocusableGroup/FocusableTvOS.tsx +34 -86
  11. package/Components/FocusableGroup/index.tsx +0 -3
  12. package/Components/GeneralContentScreen/GeneralContentScreen.tsx +3 -0
  13. package/Components/GeneralContentScreen/utils/useCurationAPI.ts +4 -2
  14. package/Components/GeneralContentScreen/utils/useEventAlerts.ts +30 -0
  15. package/Components/HandlePlayable/HandlePlayable.tsx +21 -27
  16. package/Components/Layout/TV/LayoutBackground.tsx +28 -0
  17. package/Components/Layout/TV/NavBarContainer.tsx +2 -1
  18. package/Components/Layout/TV/ScreenContainer.tsx +8 -2
  19. package/Components/Layout/TV/ScreenLayoutContextProvider.tsx +5 -0
  20. package/Components/Layout/TV/__tests__/ScreenContainer.test.tsx +2 -1
  21. package/Components/Layout/TV/__tests__/__snapshots__/NavBarContainer.test.tsx.snap +1 -0
  22. package/Components/Layout/TV/__tests__/__snapshots__/ScreenContainer.test.tsx.snap +1 -0
  23. package/Components/Layout/TV/__tests__/__snapshots__/index.test.tsx.snap +15 -10
  24. package/Components/Layout/TV/__tests__/index.test.tsx +8 -2
  25. package/Components/Layout/TV/index.tsx +6 -20
  26. package/Components/Layout/TV/index.web.tsx +4 -1
  27. package/Components/MasterCell/DefaultComponents/ActionButton.tsx +2 -3
  28. package/Components/MasterCell/DefaultComponents/Image/Image.ios.tsx +4 -3
  29. package/Components/MasterCell/DefaultComponents/Image/hooks/useImage.ts +11 -7
  30. package/Components/MasterCell/DefaultComponents/tv/TvActionButtons/const.ts +3 -0
  31. package/Components/MasterCell/DefaultComponents/tv/TvActionButtons/index.ts +6 -6
  32. package/Components/MasterCell/SharedUI/ProgressBar/hooks/useFillInPercent.ts +2 -8
  33. package/Components/MasterCell/utils/behaviorProvider.ts +136 -0
  34. package/Components/MasterCell/utils/index.ts +8 -134
  35. package/Components/ModalComponent/BottomSheetModalContent.tsx +59 -43
  36. package/Components/ModalComponent/Button/Item.tsx +6 -5
  37. package/Components/ModalComponent/Button/assets.ts +1 -1
  38. package/Components/ModalComponent/Button/index.tsx +45 -62
  39. package/Components/ModalComponent/Header/index.tsx +9 -8
  40. package/Components/ModalComponent/utils.ts +55 -7
  41. package/Components/OfflineHandler/utils/index.ts +1 -1
  42. package/Components/PlayerContainer/PlayerContainer.tsx +34 -7
  43. package/Components/PlayerImageBackground/index.tsx +1 -1
  44. package/Components/River/ComponentsMap/ComponentsMap.tsx +14 -3
  45. package/Components/River/ComponentsMap/hooks/useLoadingState.ts +3 -3
  46. package/Components/River/RiverItem.tsx +8 -3
  47. package/Components/River/__tests__/__snapshots__/componentsMap.test.js.snap +7 -1
  48. package/Components/Screen/TV/__tests__/index.web.test.tsx +26 -0
  49. package/Components/Screen/TV/index.web.tsx +5 -6
  50. package/Components/Screen/__tests__/Screen.test.tsx +22 -14
  51. package/Components/Screen/__tests__/__snapshots__/Screen.test.tsx.snap +2 -2
  52. package/Components/Screen/hooks.ts +3 -6
  53. package/Components/TopMarginApplicator/TopMarginApplicator.tsx +2 -3
  54. package/Components/TrackedView/index.tsx +1 -0
  55. package/Components/Transitioner/AnimationManager.js +15 -15
  56. package/Components/VideoLive/PlayerLiveImageComponent.tsx +4 -0
  57. package/Components/VideoLive/__tests__/__snapshots__/PlayerLiveImageComponent.test.tsx.snap +1 -0
  58. package/Components/VideoModal/ModalAnimation/AnimatedPlayerModalWrapper.tsx +1 -1
  59. package/Components/VideoModal/ModalAnimation/AnimatedScrollModal.tsx +35 -19
  60. package/Components/VideoModal/ModalAnimation/AnimatedVideoPlayerComponent.tsx +3 -3
  61. package/Components/VideoModal/ModalAnimation/AnimationComponent.tsx +38 -14
  62. package/Components/VideoModal/ModalAnimation/ModalAnimationContext.tsx +10 -3
  63. package/Components/VideoModal/ModalAnimation/__tests__/getMoveUpValue.test.ts +108 -0
  64. package/Components/VideoModal/ModalAnimation/const.ts +5 -0
  65. package/Components/VideoModal/ModalAnimation/index.ts +2 -0
  66. package/Components/VideoModal/ModalAnimation/utils.ts +30 -0
  67. package/Components/VideoModal/PlayerDetails.tsx +13 -5
  68. package/Components/VideoModal/PlayerWrapper.tsx +35 -22
  69. package/Components/VideoModal/VideoModal.tsx +19 -4
  70. package/Components/VideoModal/__tests__/__snapshots__/PlayerDetails.test.tsx.snap +2 -40
  71. package/Components/VideoModal/utils.ts +3 -4
  72. package/Components/ZappUIComponent/index.tsx +4 -4
  73. package/Contexts/FocusableGroupContext/withFocusableContext.tsx +4 -10
  74. package/Contexts/HeaderOffsetContext/index.tsx +4 -6
  75. package/Contexts/ScreenContext/index.tsx +3 -10
  76. package/Contexts/ScreenLayoutContext/index.tsx +5 -3
  77. package/Decorators/RiverResolver/index.tsx +5 -7
  78. package/Decorators/ZappPipesDataConnector/index.tsx +4 -30
  79. package/package.json +5 -9
  80. package/tsconfig.json +2 -3
  81. package/.babelrc +0 -8
  82. package/Components/Cell/CellStyles/FallbackCellStyle/index.js +0 -157
  83. package/Components/Cell/CellStyles/Hero/index.js +0 -111
  84. package/Components/Cell/CellStyles/ScreenSelector/index.js +0 -68
  85. package/Components/Cell/CellStyles/cellStylesResolver.ts +0 -19
  86. package/Components/Cell/CellStyles/colors.js +0 -40
  87. package/Components/Cell/CellStyles/index.js +0 -15
  88. package/Components/Cell/CellWithFocusable.ios.tsx +0 -126
@@ -1,126 +0,0 @@
1
- /** TODO: Remove this file when tvos FocusableGroup
2
- * behaviour is aligned to the web one
3
- * FocusableGroup should only send onFocus and onBlur events when
4
- * Focus enters and leaves the Focusables inside the branch
5
- */
6
- import * as React from "react";
7
-
8
- import { focusManager } from "@applicaster/zapp-react-native-utils/appUtils/focusManager";
9
- import * as FOCUS_EVENTS from "@applicaster/zapp-react-native-utils/appUtils/focusManager/events";
10
- import { noop } from "@applicaster/zapp-react-native-utils/functionUtils";
11
- import { toBooleanWithDefaultFalse } from "@applicaster/zapp-react-native-utils/booleanUtils";
12
-
13
- import { isAppleTV } from "../../Helpers/Platform";
14
- import { useCellState } from "../MasterCell/utils";
15
-
16
- const useCellFocusedState = (
17
- skipFocusManagerRegistration: boolean,
18
- groupId: string,
19
- id: string
20
- ) => {
21
- const [currentCellFocused, setCurrentCellFocused] = React.useState(false);
22
-
23
- React.useEffect(() => {
24
- const isGroupItemFocused = () => {
25
- if (!skipFocusManagerRegistration) {
26
- const isFocused = focusManager.isGroupItemFocused(groupId, id);
27
- setCurrentCellFocused(isFocused);
28
- }
29
- };
30
-
31
- const handler = () => {
32
- // tvOS hack for properly checking focus
33
- if (isAppleTV()) {
34
- setTimeout(() => {
35
- isGroupItemFocused();
36
- }, 0);
37
- } else {
38
- isGroupItemFocused();
39
- }
40
- };
41
-
42
- focusManager.on(FOCUS_EVENTS.FOCUS, handler);
43
-
44
- return () => {
45
- focusManager.removeHandler(FOCUS_EVENTS.FOCUS, handler);
46
- };
47
- }, [groupId, skipFocusManagerRegistration]);
48
-
49
- return currentCellFocused;
50
- };
51
-
52
- type Props = {
53
- item: ZappEntry;
54
- CellRenderer: React.FunctionComponent<any>;
55
- id: string;
56
- groupId: string;
57
- onFocus: Function;
58
- index: number;
59
- scrollTo: Function;
60
- preferredFocus?: boolean;
61
- skipFocusManagerRegistration?: boolean;
62
- isFocusable?: boolean;
63
- behavior: Behavior;
64
- focused?: boolean;
65
- };
66
-
67
- export function CellWithFocusable(props: Props) {
68
- const {
69
- index,
70
- item,
71
- CellRenderer,
72
- id,
73
- groupId,
74
- onFocus,
75
- scrollTo = noop,
76
- preferredFocus,
77
- skipFocusManagerRegistration,
78
- isFocusable,
79
- behavior,
80
- focused,
81
- } = props;
82
-
83
- const isFocused = useCellFocusedState(
84
- skipFocusManagerRegistration,
85
- groupId,
86
- id
87
- );
88
-
89
- const state = useCellState({
90
- id: item.id,
91
- behavior,
92
- focused: isFocused || toBooleanWithDefaultFalse(focused),
93
- });
94
-
95
- const [focusedButtonId, setFocusedButtonId] = React.useState(undefined);
96
-
97
- // for horizontal scrolling
98
- React.useEffect(() => {
99
- if (focusedButtonId) {
100
- scrollTo(index);
101
- }
102
- }, [focusedButtonId]);
103
-
104
- const handleToggleFocus = (value) => {
105
- setFocusedButtonId(value.focusedButtonId);
106
-
107
- if (value.focusable) {
108
- onFocus(value.focusable, value.mouse);
109
- }
110
- };
111
-
112
- return (
113
- <CellRenderer
114
- item={item}
115
- groupId={groupId}
116
- onToggleFocus={handleToggleFocus}
117
- state={state}
118
- prefixId={id}
119
- focusedButtonId={focusedButtonId}
120
- preferredFocus={preferredFocus}
121
- skipFocusManagerRegistration={skipFocusManagerRegistration}
122
- isFocusable={isFocusable}
123
- focused={focused}
124
- />
125
- );
126
- }