From d3204f6cd7772fe63d19ef8892664335d615c9de Mon Sep 17 00:00:00 2001 From: vishesh711 Date: Tue, 15 Jul 2025 12:36:53 -0400 Subject: feat: Add comprehensive keyboard shortcuts system for video editor - Implement industry-standard video editing shortcuts (Space, J/K/L, arrows) - Add playback controls: Space (play/pause), J/K/L (rewind/pause/forward) - Add navigation: arrow keys (frame stepping), Shift+arrows (5s jumps), Home/End - Add editing shortcuts: S (split at playhead), N (toggle snapping) - Add selection shortcuts: Ctrl/Cmd+A (select all), Ctrl/Cmd+D (duplicate) - Add keyboard shortcuts help dialog with categorized shortcuts display - Integrate help button in editor header for discoverability - Add TypeScript type declarations for better development experience - Fix Docker build environment variable validation issues All shortcuts follow professional video editing standards (Avid/Premiere/Final Cut). Context-aware shortcuts that don't interfere with text input fields. Toast notifications provide user feedback for better UX. --- apps/web/src/types/global.d.ts | 19 ++++++++++++ apps/web/src/types/modules.d.ts | 64 +++++++++++++++++++++++++++++++++++++++++ 2 files changed, 83 insertions(+) create mode 100644 apps/web/src/types/global.d.ts create mode 100644 apps/web/src/types/modules.d.ts (limited to 'apps/web/src/types') diff --git a/apps/web/src/types/global.d.ts b/apps/web/src/types/global.d.ts new file mode 100644 index 00000000..f99e4cc3 --- /dev/null +++ b/apps/web/src/types/global.d.ts @@ -0,0 +1,19 @@ +/// +/// + +// Global React types +declare global { + namespace JSX { + interface IntrinsicElements { + [elemName: string]: any; + } + } +} + +// React module declarations +declare module 'react' { + export * from '@types/react'; +} + +// Ensure this file is treated as a module +export {}; \ No newline at end of file diff --git a/apps/web/src/types/modules.d.ts b/apps/web/src/types/modules.d.ts new file mode 100644 index 00000000..945b23fb --- /dev/null +++ b/apps/web/src/types/modules.d.ts @@ -0,0 +1,64 @@ +// Type declarations for external modules without @types packages + +declare module 'lucide-react' { + import { FC, SVGProps } from 'react'; + + export interface IconProps extends SVGProps { + size?: string | number; + strokeWidth?: string | number; + } + + export const Scissors: FC; + export const ArrowLeftToLine: FC; + export const ArrowRightToLine: FC; + export const Trash2: FC; + export const Snowflake: FC; + export const Copy: FC; + export const SplitSquareHorizontal: FC; + export const Pause: FC; + export const Play: FC; + export const Video: FC; + export const Music: FC; + export const TypeIcon: FC; + export const Magnet: FC; + export const Lock: FC; + export const ChevronLeft: FC; + export const Download: FC; + export const Keyboard: FC; + export const SkipBack: FC; + export const SkipForward: FC; + // Add other icons as needed +} + +declare module 'sonner' { + export interface ToastOptions { + duration?: number; + position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'top-center' | 'bottom-center'; + style?: React.CSSProperties; + className?: string; + description?: string; + action?: { + label: string; + onClick: () => void; + }; + cancel?: { + label: string; + onClick?: () => void; + }; + id?: string | number; + onDismiss?: (toast: any) => void; + onAutoClose?: (toast: any) => void; + } + + export interface Toast { + success: (message: string, options?: ToastOptions) => void; + error: (message: string, options?: ToastOptions) => void; + info: (message: string, options?: ToastOptions) => void; + warning: (message: string, options?: ToastOptions) => void; + loading: (message: string, options?: ToastOptions) => void; + custom: (jsx: React.ReactNode, options?: ToastOptions) => void; + } + + export const toast: Toast; + export const Toaster: React.FC; +} \ No newline at end of file -- cgit v1.3.1