@fraku/video 0.0.7 → 0.1.0

package/dist/pages/MainSessionPage/ButtonsDock.d.ts

@@ -0,0 +1,2 @@
+declare const ButtonsDock: () => import("react/jsx-runtime").JSX.Element;
+export default ButtonsDock;

package/dist/pages/MainSessionPage/MainSessionPage.d.ts

@@ -0,0 +1,2 @@
+declare const MainSessionPage: () => import("react/jsx-runtime").JSX.Element;
+export default MainSessionPage;

package/dist/pages/MainSessionPage/ParticipantVideo.d.ts

@@ -0,0 +1,8 @@
+import { Participant } from '@zoom/videosdk';
+
+type ParticipantVideoProps = {
+    participant: Participant;
+    className?: string;
+};
+declare const ParticipantVideo: ({ participant, className }: ParticipantVideoProps) => import("react/jsx-runtime").JSX.Element;
+export default ParticipantVideo;

package/dist/pages/MainSessionPage/Video.d.ts

@@ -0,0 +1,2 @@
+declare const Video: () => import("react/jsx-runtime").JSX.Element;
+export default Video;

package/dist/pages/MainSessionPage/index.d.ts

@@ -0,0 +1 @@
+export { default } from './MainSessionPage';

package/dist/pages/SetupPage/SetupPage.d.ts

@@ -0,0 +1,2 @@
+declare const SetupPage: () => import("react/jsx-runtime").JSX.Element;
+export default SetupPage;

package/dist/pages/SetupPage/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SetupPage';

package/dist/types.d.ts

@@ -1,20 +1,13 @@
 import { default as React } from 'react';
 
-export declare enum SessionStep {
-    LocalSettingsConfiguration = 0,
-    OnlyPanelistsSession = 1,
-    MainSession = 2,
-    AfterSession = 3
-}
 export type Credentials = {
     sessionName: string;
     signature: string;
     userName: string;
     sessionPasscode: string;
 };
-export type ReactSetter<T> = React.Dispatch<React.SetStateAction<T>>;
-export type ZoomVideoPluginProps = {
-    credentials: Credentials | null;
-    closeParentContainer: () => void;
-    setIsCloseButtonVisible: ReactSetter<boolean>;
+export type VideoPluginProps = {
+    credentials: Credentials;
+    className?: string;
 };
+export type ReactSetter<T> = React.Dispatch<React.SetStateAction<T>>;

package/dist/utils.d.ts

@@ -0,0 +1,48 @@
+import { ClassValue } from 'clsx';
+
+export declare const fetchDevices: () => Promise<{
+    micList: MediaDeviceInfo[];
+    speakerList: MediaDeviceInfo[];
+    cameraList: MediaDeviceInfo[];
+}>;
+export declare const getRequiredEnv: (key: string) => string;
+export declare const getOptionalEnv: (key: string) => string;
+export interface GenerateSignatureParams {
+    sdkKey: string;
+    sdkSecret: string;
+    sessionName: string;
+    role: 0 | 1;
+    expirationSeconds?: number;
+    userIdentity?: string;
+    sessionKey?: string;
+    geoRegions?: string[];
+    cloudRecordingOption?: 0 | 1;
+    cloudRecordingElection?: 0 | 1;
+    telemetryTrackingId?: string;
+    videoWebRtcMode?: 0 | 1;
+    audioWebRtcMode?: 0 | 1;
+}
+/**
+ * Generate a Zoom Video SDK signature (JWT)
+ *
+ * @param params - Parameters for generating the signature
+ * @returns JWT signature string
+ *
+ * @example
+ * ```ts
+ * const signature = generateSignature({
+ *   sdkKey: 'your-sdk-key',
+ *   sdkSecret: 'your-sdk-secret',
+ *   sessionName: 'test-session',
+ *   role: 1,
+ *   userIdentity: 'user123'
+ * })
+ * ```
+ */
+export declare const generateSignature: (params: GenerateSignatureParams) => string;
+/**
+ * Utility function that combines clsx and tailwind-merge
+ * - clsx handles conditional classes and complex logic
+ * - twMerge resolves Tailwind CSS class conflicts
+ */
+export declare function cn(...inputs: ClassValue[]): string;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fraku/video",
   "private": false,
-  "version": "0.0.7",
+  "version": "0.1.0",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -41,14 +41,17 @@
     "@zoom/videosdk": "^2.2.12",
     "classnames": "^2.5.1",
     "clsx": "^2.1.1",
+    "jsrsasign": "^11.1.0",
     "primeicons": "^7.0.0",
     "primereact": "^10.9.6",
     "react-use": "^17.6.0",
-    "styled-components": "^5.3.11"
+    "styled-components": "^5.3.11",
+    "tailwind-merge": "^3.4.0"
   },
   "devDependencies": {
     "@storybook/react-vite": "^9.1.13",
     "@tailwindcss/container-queries": "^0.1.1",
+    "@types/jsrsasign": "^10.5.15",
     "@types/node": "^24.8.1",
     "@types/react": "^18.2.43",
     "@types/react-dom": "^18.2.17",
@@ -79,4 +82,4 @@
   "author": "",
   "license": "MIT",
   "description": "A React TypeScript component library"
-}
+}

package/dist/ZoomVideoPlugin.d.ts

@@ -1,4 +0,0 @@
-import { ZoomVideoPluginProps } from './types';
-
-declare const ZoomVideoPlugin: ({ credentials, closeParentContainer, setIsCloseButtonVisible }: ZoomVideoPluginProps) => import("react/jsx-runtime").JSX.Element | null;
-export default ZoomVideoPlugin;

package/dist/ZoomVideoPlugin.stories.d.ts

@@ -1,8 +0,0 @@
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Default: {
-    (): import("react/jsx-runtime").JSX.Element;
-    storyName: string;
-};

package/dist/ZoomVideoPluginRouter.d.ts

@@ -1,4 +0,0 @@
-import { ZoomVideoPluginProps } from './types';
-
-declare const ZoomVideoPluginRouter: ({ credentials, setIsCloseButtonVisible }: ZoomVideoPluginProps) => import("react/jsx-runtime").JSX.Element;
-export default ZoomVideoPluginRouter;

package/dist/ZoomVideoProvider.d.ts

@@ -1,12 +0,0 @@
-import { ReactNode } from 'react';
-import { ChatMessage } from '@zoom/videosdk';
-import { Credentials } from './types';
-
-type ZoomVideoProviderProps = {
-    credentials: Credentials;
-    children: ReactNode;
-    messages?: ChatMessage[];
-    closeParentContainer: () => void;
-};
-export declare const ZoomVideoProvider: ({ credentials, children, messages: mockMessages, closeParentContainer }: ZoomVideoProviderProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/ButtonsDock/ButtonsDock.d.ts

@@ -1,13 +0,0 @@
-import { SessionStep } from '../../types';
-
-type ButtonsDockProps = {
-    exit: () => void;
-    setIsCamOn: () => void;
-    setIsMicOn: () => void;
-    sessionStep: SessionStep;
-    setActiveMicrophone: (deviceId: string) => void;
-    setActiveCamera: (deviceId: string) => void;
-    setActiveAudioOutput: (deviceId: string) => void;
-};
-declare const ButtonsDock: ({ sessionStep, exit, setIsMicOn, setIsCamOn, setActiveMicrophone, setActiveCamera, setActiveAudioOutput }: ButtonsDockProps) => import("react/jsx-runtime").JSX.Element;
-export default ButtonsDock;

package/dist/components/ButtonsDock/DockButton.d.ts

@@ -1,30 +0,0 @@
-import { default as React } from 'react';
-
-type DockButtonProps = {
-    className?: string;
-    mainIcon: string;
-    mainLabel?: string;
-    mainTitle?: string;
-    onMainClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
-    showSecondary?: boolean;
-    secondaryIcon?: string;
-    secondaryTitle?: string;
-    onSecondaryClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
-};
-/**
- * Renders a customizable dock button component with optional main and secondary actions.
- *
- * @param className - Additional CSS class names to apply to the container.
- * @param mainIcon - The CSS class for the main icon to display.
- * @param mainLabel - Optional label text for the main button.
- * @param mainTitle - The title attribute for the main button (for accessibility/tooltips).
- * @param onMainClick - Click handler for the main button action.
- * @param showSecondary - Flag to indicate if the secondary button should be displayed.
- * @param secondaryIcon - Optional CSS class for the secondary icon to display.
- * @param secondaryTitle - The title attribute for the secondary button (for accessibility/tooltips).
- * @param onSecondaryClick - Optional click handler for the secondary button action.
- *
- * @returns A dock button component with main and optional secondary actions.
- */
-declare const DockButton: ({ className, mainIcon, mainLabel, mainTitle, onMainClick, secondaryIcon, secondaryTitle, onSecondaryClick, showSecondary }: DockButtonProps) => import("react/jsx-runtime").JSX.Element;
-export default DockButton;

package/dist/components/ButtonsDock/MenuItemTemplate.d.ts

@@ -1,9 +0,0 @@
-import { MenuItem, MenuItemOptions } from 'primereact/menuitem';
-
-type Props = {
-    item: MenuItem;
-    options: MenuItemOptions;
-    activeItem: string | undefined;
-};
-declare const MenuItemTemplate: ({ item, options, activeItem }: Props) => import("react/jsx-runtime").JSX.Element;
-export default MenuItemTemplate;

package/dist/components/ButtonsDock/index.d.ts

@@ -1 +0,0 @@
-export { default } from './ButtonsDock';

package/dist/components/MobileIconButton/MobileIconButton.d.ts

@@ -1,9 +0,0 @@
-type MobileIconButtonProps = {
-    className?: string;
-    icon: string;
-    onClick: () => void;
-    title?: string;
-    id?: string;
-};
-declare const MobileIconButton: ({ className, icon, onClick, title, id }: MobileIconButtonProps) => import("react/jsx-runtime").JSX.Element;
-export default MobileIconButton;

package/dist/components/MobileIconButton/index.d.ts

@@ -1 +0,0 @@
-export { default } from './MobileIconButton';

package/dist/components/Overlay/Overlay.d.ts

@@ -1,13 +0,0 @@
-import { Breakpoint } from '../../hooks/useDeviceSize';
-
-type OverlayProps = {
-    breakpoint: Breakpoint;
-    children: React.ReactNode;
-    className?: string;
-    header?: string | React.ReactNode;
-    onHide: () => void;
-    width?: string | number;
-    visible: boolean;
-};
-declare const Overlay: ({ breakpoint, children, onHide, className, visible, width, header }: OverlayProps) => import("react/jsx-runtime").JSX.Element;
-export default Overlay;

package/dist/components/Overlay/index.d.ts

@@ -1 +0,0 @@
-export { default } from './Overlay';

package/dist/components/ParticipantsList.d.ts

@@ -1,11 +0,0 @@
-import { Participant, VideoClient } from '@zoom/videosdk';
-import { ReactSetter } from '../types';
-
-type Props = {
-    participants: Participant[];
-    setIsCamOn: ReactSetter<boolean>;
-    setIsMicOn: ReactSetter<boolean>;
-    zmClient: typeof VideoClient;
-};
-declare const ParticipantsList: ({ zmClient, setIsCamOn, setIsMicOn, participants }: Props) => import("react/jsx-runtime").JSX.Element;
-export default ParticipantsList;

package/dist/components/SettingsOverlay/SettingsContent.d.ts

@@ -1,2 +0,0 @@
-declare const SettingsContent: () => import("react/jsx-runtime").JSX.Element | null;
-export default SettingsContent;

package/dist/components/SettingsOverlay/SettingsMenu.d.ts

@@ -1,2 +0,0 @@
-declare const SettingsMenu: () => import("react/jsx-runtime").JSX.Element;
-export default SettingsMenu;

package/dist/components/SettingsOverlay/SettingsOverlay.d.ts

@@ -1,11 +0,0 @@
-import { Breakpoint } from '../../hooks/useDeviceSize';
-import { SettingsTab } from './context';
-
-type Props = {
-    breakpoint: Breakpoint;
-    visible: boolean;
-    onHide: () => void;
-    defaultTab?: SettingsTab;
-};
-declare const SettingsOverlay: ({ visible, onHide, breakpoint, defaultTab }: Props) => import("react/jsx-runtime").JSX.Element;
-export default SettingsOverlay;

package/dist/components/SettingsOverlay/Tabs/AudioSettings.d.ts

@@ -1,2 +0,0 @@
-declare const AudioSettings: () => import("react/jsx-runtime").JSX.Element;
-export default AudioSettings;

package/dist/components/SettingsOverlay/Tabs/BackgroundSettings.d.ts

@@ -1,2 +0,0 @@
-declare const BackgroundSettings: () => import("react/jsx-runtime").JSX.Element;
-export default BackgroundSettings;

package/dist/components/SettingsOverlay/Tabs/DropdownItemTemplate.d.ts

@@ -1,8 +0,0 @@
-declare const DropdownItemTemplate: ({ option, isActive }: {
-    option: {
-        label: string;
-        value: string;
-    };
-    isActive: boolean;
-}) => import("react/jsx-runtime").JSX.Element;
-export default DropdownItemTemplate;

package/dist/components/SettingsOverlay/Tabs/DropdownValueTemplate.d.ts

@@ -1,8 +0,0 @@
-declare const DropdownValueTemplate: ({ option, icon }: {
-    option: {
-        label: string;
-        value: string;
-    };
-    icon: string;
-}) => import("react/jsx-runtime").JSX.Element;
-export default DropdownValueTemplate;

package/dist/components/SettingsOverlay/Tabs/VideoSettings.d.ts

@@ -1,2 +0,0 @@
-declare const VideoSettings: () => import("react/jsx-runtime").JSX.Element;
-export default VideoSettings;

package/dist/components/SettingsOverlay/context.d.ts

@@ -1,13 +0,0 @@
-import { ReactSetter } from '../../types';
-
-export declare enum SettingsTab {
-    Audio = "Audio",
-    Video = "Video",
-    Background = "Background"
-}
-export type SettingsOverlayContextProps = {
-    selectedSettingsTab: SettingsTab;
-    setSelectedSettingsTab: ReactSetter<SettingsTab>;
-};
-export declare const settingsOverlayContext: import('react').Context<SettingsOverlayContextProps>;
-export declare const useSettingsOverlayContext: () => SettingsOverlayContextProps;

package/dist/components/SettingsOverlay/index.d.ts

@@ -1 +0,0 @@
-export { default } from './SettingsOverlay';

package/dist/components/Video.d.ts

@@ -1,2 +0,0 @@
-declare const Video: import('react').ForwardRefExoticComponent<import('react').RefAttributes<HTMLVideoElement>>;
-export default Video;

package/dist/constants.d.ts

@@ -1,2 +0,0 @@
-export declare const VIDEO_PLACEHOLDER = "<div class=\"video-placeholder flex items-center justify-center bg-neutral-20 w-full h-full aspect-video text-white\"><i class=\"fa-regular fa-video-slash fa-lg\"/></div>";
-export declare const SETTINGS_OVERLAY_WIDTH = 680;

package/dist/hooks/useClientMessages.d.ts

@@ -1,5 +0,0 @@
-/**
- * Hook that subscribes to Zoom Video SDK events and updates the context state accordingly.
- * This hook should be called from within a ZoomVideoProvider.
- */
-export declare const useClientMessages: () => void;

package/dist/hooks/useStartVideoOptions.d.ts

@@ -1,10 +0,0 @@
-import { Stream } from '@zoom/videosdk';
-
-export declare const useStartVideoOptions: ({ mediaStream }: {
-    mediaStream: typeof Stream | null;
-}) => {
-    hd: boolean;
-    fullHd: boolean;
-    ptz: boolean | undefined;
-    originalRatio: boolean;
-};

package/dist/hooks/useZoomVideoPlayer.d.ts

@@ -1,7 +0,0 @@
-import { RefObject } from 'react';
-
-type UseZoomVideoPlayerProps = {
-    fullRef: RefObject<HTMLVideoElement | null>;
-};
-export declare const useZoomVideoPlayer: ({ fullRef }: UseZoomVideoPlayerProps) => void;
-export {};

package/dist/lib/platforms.d.ts

@@ -1,4 +0,0 @@
-export declare const isIPad: () => boolean;
-export declare const isIOSMobile: () => boolean;
-export declare const isAndroidBrowser: () => boolean;
-export declare const isAndroidOrIOSBrowser: () => boolean;

package/dist/pages/AfterSession.d.ts

@@ -1,4 +0,0 @@
-declare const AfterSession: ({ restartSession }: {
-    restartSession: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
-export default AfterSession;

package/dist/pages/MainSession.d.ts

@@ -1,2 +0,0 @@
-declare const MainSession: () => import("react/jsx-runtime").JSX.Element;
-export default MainSession;

package/dist/pages/PanelistsSession.d.ts

@@ -1,4 +0,0 @@
-declare const PanelistsSession: ({ initMainSession }: {
-    initMainSession: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
-export default PanelistsSession;

package/dist/pages/PreSessionConfiguration.d.ts

@@ -1,4 +0,0 @@
-declare const PreSessionConfiguration: ({ joinSession }: {
-    joinSession: () => Promise<void>;
-}) => import("react/jsx-runtime").JSX.Element;
-export default PreSessionConfiguration;