chore: More build and package fixes

Author: WillsonHaw

.changeset/slick-days-agree.md

@@ -0,0 +1,19 @@
+---
+"@plextv/vite-plugin-react-reanimated-lightning": patch
+"@plextv/vite-plugin-react-native-lightning": patch
+"@plextv/react-native-lightning-components": patch
+"@plextv/react-native-lightning-example": patch
+"@plextv/react-lightning-components": patch
+"@plextv/vite-plugin-msdf-fontgen": patch
+"@plextv/react-native-lightning": patch
+"@plextv/react-lightning-plugin-css-transform": patch
+"@plextv/react-lightning-example": patch
+"@plextv/react-lightning-plugin-flexbox-lite": patch
+"@plextv/react-lightning-plugin-reanimated": patch
+"@plextv/react-lightning": patch
+"@plextv/react-lightning-plugin-flexbox": patch
+"@repo/configs": patch
+"@plextv/react-lightning-storybook": patch
+---
+
+chore: More build and package fixes

apps/react-lightning-example/package.json

@@ -19,6 +19,7 @@
     "clean": "del ./dist",
     "dev": "vite --host",
     "preview": "vite preview --host --port 3333",
+    "check:types": "tsc --noEmit",
     "test:unit": "vitest run --passWithNoTests"
   },
   "dependencies": {

apps/react-lightning-example/src/api/getHeaders.ts

@@ -3,7 +3,7 @@ import { getClientIdentifier } from './getClientIdentifier';
 const getScreenResolution = () =>
   `${window.innerWidth}x${window.innerHeight},${window.screen.width}x${window.screen.height}`;
 
-export const getHeaders = (token?: string) => {
+export const getHeaders = (token?: string): Record<string, string> => {
   const headers: Record<string, string> = {
     Accept: 'application/json',
     'X-Plex-Product': 'Plex Web',

apps/react-lightning-example/src/api/getImageUrl.ts

@@ -1,6 +1,6 @@
 const baseUrl = 'https://images.plex.tv/photo';
 
-export const getImageUrl = (url?: string) => {
+export const getImageUrl = (url?: string): string => {
   if (!url) {
     return '';
   }

apps/react-lightning-example/src/api/getToken.ts

@@ -2,7 +2,7 @@ import { getHeaders } from './getHeaders';
 
 const baseUrl = 'https://clients.plex.tv/api/v2/users/anonymous';
 
-export const getToken = async () => {
+export const getToken = async (): Promise<string> => {
   const token = localStorage.getItem('authToken');
 
   if (token) {

apps/react-lightning-example/src/api/useHubItemsData.ts

@@ -1,4 +1,4 @@
-import useSWR from 'swr';
+import useSWR, { type SWRResponse } from 'swr';
 import { getHeaders } from './getHeaders';
 import { getToken } from './getToken';
 import type { HubItemsRoot } from './types/HubItems';
@@ -13,7 +13,7 @@ const args = {
   includeDetails: '1',
 };
 
-export const useHubItemsData = (hubKey: string) => {
+export const useHubItemsData = (hubKey: string): SWRResponse<HubItemsRoot> => {
   return useSWR<HubItemsRoot>(
     baseUrl + hubKey,
     async () => {

apps/react-lightning-example/src/api/useHubsData.ts

@@ -1,4 +1,4 @@
-import useSWR from 'swr';
+import useSWR, { type SWRResponse } from 'swr';
 import { getHeaders } from './getHeaders';
 import { getToken } from './getToken';
 import type { HubRoot } from './types/Hubs';
@@ -11,7 +11,7 @@ const args = {
   count: '4',
 };
 
-export const useHubsData = () => {
+export const useHubsData = (): SWRResponse<HubRoot> => {
   return useSWR<HubRoot>(
     baseUrl,
     async () => {

apps/react-lightning-example/src/components/AnimatedImage.tsx

@@ -1,11 +1,11 @@
 import type { LightningImageElement } from '@plextv/react-lightning';
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { type FC, useEffect, useMemo, useRef, useState } from 'react';
 
 function randomInt(max: number): number {
   return Math.round(Math.random() * max);
 }
 
-const AnimatedImage = () => {
+const AnimatedImage: FC = () => {
   const duration = useMemo(() => randomInt(2000) + 500, []);
   const ref = useRef<LightningImageElement>(null);
   const [x, setX] = useState(randomInt(1670));

apps/react-lightning-example/src/components/Button.tsx

@@ -5,7 +5,7 @@ import type {
   LightningViewElementProps,
 } from '@plextv/react-lightning';
 import { Keys, useFocus } from '@plextv/react-lightning';
-import { useCallback } from 'react';
+import { type FC, useCallback } from 'react';
 
 const containerStyles: LightningElementStyle = {
   w: 330,
@@ -29,7 +29,7 @@ type Props = LightningViewElementProps & {
   onPress?: () => void;
 };
 
-const Button = (props: Props) => {
+const Button: FC<Props> = (props) => {
   const { autoFocus, onPress, ...otherProps } = props;
   const { ref, focused } = useFocus<LightningElement>({ autoFocus });
 

apps/react-lightning-example/src/components/HubItem.tsx

@@ -5,6 +5,7 @@ import {
   useFocus,
 } from '@plextv/react-lightning';
 import { Column } from '@plextv/react-lightning-components';
+import type { FC } from 'react';
 import { getImageUrl } from '../api/getImageUrl';
 import type { Metadata } from '../api/types/Metadata';
 
@@ -13,7 +14,7 @@ interface Props extends LightningViewElementProps {
   style?: LightningViewElementStyle;
 }
 
-export const HubItem = ({ metadata, style, ...rest }: Props) => {
+export const HubItem: FC<Props> = ({ metadata, style, ...rest }) => {
   const poster = metadata.Image?.find((image) => image.type === 'coverPoster');
   const { ref, focused } = useFocus<LightningViewElement>();