@umituz/web-canvas 1.0.0

package/src/domain/config/ScreenshotStudioConfig.ts

@@ -0,0 +1,82 @@
+/**
+ * Screenshot Studio Configuration
+ * Complete screenshot studio configuration
+ */
+
+import type { CanvasConfig } from './CanvasConfig';
+import type { DeviceConfigOption } from './DeviceConfig';
+import type { ScreenshotFormat, Language } from '../types/screenshot.types';
+
+/**
+ * Export configuration
+ */
+export interface ExportConfig {
+  /** Include ASO metadata in export */
+  includeMetadata?: boolean;
+  /** ZIP filename template */
+  zipFilename?: string;
+  /** Folder structure */
+  folderStructure?: 'flat' | 'by-language' | 'by-device';
+  /** Default export format */
+  defaultFormat?: ScreenshotFormat;
+}
+
+/**
+ * AI configuration
+ */
+export interface AIConfig {
+  /** Enable AI features */
+  enabled?: boolean;
+  /** AI provider */
+  provider?: 'gemini' | 'openai' | 'anthropic';
+  /** API key (if needed) */
+  apiKey?: string;
+}
+
+/**
+ * Screenshot studio configuration
+ */
+export interface ScreenshotStudioConfig {
+  /** Canvas configuration */
+  canvas?: CanvasConfig;
+  /** Device configuration */
+  device?: DeviceConfigOption;
+  /** Export configuration */
+  export?: ExportConfig;
+  /** AI configuration */
+  ai?: AIConfig;
+  /** Supported languages */
+  languages?: Language[];
+  /** Default language */
+  defaultLanguage?: Language;
+}
+
+/**
+ * Default screenshot studio configuration
+ */
+export const DEFAULT_SCREENSHOT_STUDIO_CONFIG: ScreenshotStudioConfig = {
+  canvas: {
+    defaultFormat: 'png' as any,
+    defaultQuality: 0.9,
+    scale: 2,
+    useCORS: true,
+  },
+  device: {
+    devices: ['iphone-15-pro' as any],
+    defaultDevice: 'iphone-15-pro' as any,
+    showFrame: true,
+    frameColor: '#1f2937',
+    frameThickness: 8,
+  },
+  export: {
+    includeMetadata: true,
+    folderStructure: 'by-language',
+    defaultFormat: 'png' as any,
+  },
+  ai: {
+    enabled: true,
+    provider: 'gemini',
+  },
+  languages: ['en-US', 'tr-TR', 'de-DE', 'fr-FR', 'es-ES', 'ja-JP'],
+  defaultLanguage: 'en-US',
+};

package/src/domain/config/index.ts

@@ -0,0 +1,8 @@
+/**
+ * Domain Config Index
+ * Export all configuration interfaces and defaults
+ */
+
+export * from './CanvasConfig';
+export * from './DeviceConfig';
+export * from './ScreenshotStudioConfig';

package/src/domain/index.ts

@@ -0,0 +1,7 @@
+/**
+ * Domain Layer Index
+ * Export all domain types and configurations
+ */
+
+export * from './types';
+export * from './config';

package/src/domain/types/canvas.types.ts

@@ -0,0 +1,85 @@
+/**
+ * Canvas Types
+ * Core canvas operation types
+ */
+
+/**
+ * Canvas format options
+ */
+export type CanvasFormat = 'png' | 'jpeg' | 'webp';
+
+/**
+ * Canvas render quality
+ */
+export type CanvasQuality = number; // 0.0 to 1.0
+
+/**
+ * Canvas dimensions
+ */
+export interface CanvasDimensions {
+  width: number;
+  height: number;
+}
+
+/**
+ * Canvas position
+ */
+export interface CanvasPosition {
+  x: number;
+  y: number;
+}
+
+/**
+ * Canvas rectangle
+ */
+export interface CanvasRect extends CanvasPosition, CanvasDimensions {}
+
+/**
+ * Canvas color
+ */
+export type CanvasColor = string;
+
+/**
+ * Canvas context configuration
+ */
+export interface CanvasContextConfig {
+  fillStyle?: CanvasColor;
+  strokeStyle?: CanvasColor;
+  lineWidth?: number;
+  lineCap?: 'butt' | 'round' | 'square';
+  lineJoin?: 'round' | 'bevel' | 'miter';
+  globalAlpha?: number;
+  font?: string;
+  textAlign?: CanvasTextAlign;
+  textBaseline?: CanvasTextBaseline;
+}
+
+/**
+ * Canvas export options
+ */
+export interface CanvasExportOptions {
+  format?: CanvasFormat;
+  quality?: CanvasQuality;
+  scale?: number;
+  backgroundColor?: string;
+  useCORS?: boolean;
+}
+
+/**
+ * Canvas result
+ */
+export interface CanvasResult {
+  blob: Blob;
+  url: string;
+  dimensions: CanvasDimensions;
+  format: CanvasFormat;
+  size: number;
+}
+
+/**
+ * Canvas operation callback
+ */
+export type CanvasOperation<T> = (
+  ctx: CanvasRenderingContext2D,
+  dimensions: CanvasDimensions
+) => T;

package/src/domain/types/index.ts

@@ -0,0 +1,8 @@
+/**
+ * Domain Types Index
+ * Export all domain types
+ */
+
+export * from './canvas.types';
+export * from './screenshot.types';
+export * from './report.types';

package/src/domain/types/report.types.ts

@@ -0,0 +1,83 @@
+/**
+ * Report Types
+ * PDF export and report generation types
+ */
+
+/**
+ * Report item type
+ */
+export type ReportItemType = 'app' | 'campaign' | 'post';
+
+/**
+ * Report item
+ */
+export interface ReportItem {
+  name: string;
+  type: ReportItemType;
+  metrics: Record<string, number | string>;
+  details: Record<string, string | number | boolean | null | undefined>;
+}
+
+/**
+ * Report summary
+ */
+export interface ReportSummary {
+  totalReach: number;
+  totalEngagement: number;
+  averageScore: number;
+}
+
+/**
+ * Report data
+ */
+export interface ReportData {
+  title: string;
+  dateRange: string;
+  items: ReportItem[];
+  summary: ReportSummary;
+}
+
+/**
+ * Export format
+ */
+export type ExportFormat = 'pdf' | 'excel' | 'csv';
+
+/**
+ * PDF export options
+ */
+export interface PDFExportOptions {
+  filename?: string;
+  scale?: number;
+  useCORS?: boolean;
+  backgroundColor?: string;
+  format?: 'a4' | 'letter' | 'legal';
+}
+
+/**
+ * Excel export options
+ */
+export interface ExcelExportOptions {
+  filename?: string;
+  sheetName?: string;
+  includeSummary?: boolean;
+}
+
+/**
+ * CSV export options
+ */
+export interface CSVExportOptions {
+  filename?: string;
+  delimiter?: ',' | ';';
+  includeHeaders?: boolean;
+}
+
+/**
+ * Report export result
+ */
+export interface ReportExportResult {
+  format: ExportFormat;
+  filename: string;
+  size: number;
+  url: string;
+  timestamp: Date;
+}

package/src/domain/types/screenshot.types.ts

@@ -0,0 +1,238 @@
+/**
+ * Screenshot Types
+ * Screenshot generation and device frame types
+ */
+
+/**
+ * Device type
+ */
+export type DeviceType =
+  | 'iphone-15-pro'
+  | 'iphone-15'
+  | 'iphone-se'
+  | 'ipad-pro'
+  | 'ipad'
+  | 'android-phone'
+  | 'android-tablet'
+  | 'desktop';
+
+/**
+ * Device type enum (for backward compatibility)
+ */
+export const DeviceTypeEnum = {
+  IPHONE_15_PRO: 'iphone-15-pro',
+  IPHONE_15: 'iphone-15',
+  IPHONE_SE: 'iphone-se',
+  IPAD_PRO: 'ipad-pro',
+  IPAD: 'ipad',
+  ANDROID_PHONE: 'android-phone',
+  ANDROID_TABLET: 'android-tablet',
+  DESKTOP: 'desktop',
+} as const;
+
+/**
+ * Frame style options
+ */
+export type FrameStyle = 'realistic' | 'minimal' | 'none';
+
+/**
+ * Frame style enum (for backward compatibility)
+ */
+export const FrameStyleEnum = {
+  REALISTIC: 'realistic',
+  MINIMAL: 'minimal',
+  NONE: 'none',
+} as const;
+
+/**
+ * Layout style options
+ */
+export type LayoutStyle = 'text-top' | 'text-bottom' | 'text-overlay';
+
+/**
+ * Layout style enum (for backward compatibility)
+ */
+export const LayoutStyleEnum = {
+  TEXT_TOP: 'text-top',
+  TEXT_BOTTOM: 'text-bottom',
+  TEXT_OVERLAY: 'text-overlay',
+} as const;
+
+/**
+ * Background pattern options
+ */
+export type BackgroundPattern =
+  | 'none'
+  | 'dots'
+  | 'grid'
+  | 'lines'
+  | 'waves'
+  | 'checkers';
+
+/**
+ * Background pattern enum (for backward compatibility)
+ */
+export const BackgroundPatternEnum = {
+  NONE: 'none',
+  DOTS: 'dots',
+  GRID: 'grid',
+  LINES: 'lines',
+  WAVES: 'waves',
+  CHECKERS: 'checkers',
+} as const;
+
+/**
+ * Screenshot format
+ */
+export type ScreenshotFormat = 'png' | 'jpeg' | 'webp';
+
+/**
+ * Screenshot format enum (for backward compatibility)
+ */
+export const ScreenshotFormatEnum = {
+  PNG: 'png',
+  JPEG: 'jpeg',
+  WEBP: 'webp',
+} as const;
+
+/**
+ * Language code
+ */
+export type Language = string;
+
+/**
+ * Device dimensions
+ */
+export interface DeviceDimensions {
+  width: number;
+  height: number;
+  scale?: number;
+}
+
+/**
+ * Device configuration
+ */
+export interface DeviceConfig {
+  type: DeviceType;
+  name: string;
+  dimensions: DeviceDimensions;
+  isPhone?: boolean;
+  isTablet?: boolean;
+  hasNotch?: boolean;
+  cornerRadius?: number;
+  frameThickness?: number;
+}
+
+/**
+ * Screenshot content
+ */
+export interface ScreenshotContent {
+  id: string;
+  title: string;
+  subtitle: string;
+  screenshot: string | null;
+  translations: Record<Language, { title: string; subtitle: string }>;
+  imageFit?: 'cover' | 'contain' | 'fill';
+  imageZoom?: number;
+  imageAnchorX?: number;
+  imageAnchorY?: number;
+}
+
+/**
+ * Screenshot design
+ */
+export interface ScreenshotDesign {
+  backgroundColor: string;
+  backgroundGradientEnd?: string | null;
+  backgroundImage?: string | null;
+  backgroundBlur?: number;
+  backgroundOverlayOpacity?: number;
+  backgroundPattern?: BackgroundPattern;
+  textColor: string;
+  highlightColor: string;
+  textAlign: 'left' | 'center' | 'right';
+  deviceColor: string;
+  deviceType: DeviceType;
+  frameStyle: FrameStyle;
+  layout: LayoutStyle;
+  scale: number;
+  fontFamily: string;
+  titleFontSize: number;
+  subtitleFontSize: number;
+  titleFontWeight: string;
+  subtitleFontWeight: string;
+  textCase?: 'uppercase' | 'lowercase' | 'none';
+  lineHeight?: number;
+  letterSpacing?: number;
+  rotation?: number;
+  rotationX?: number;
+  rotationY?: number;
+  rotationZ?: number;
+  offsetY?: number;
+  shadowIntensity?: number;
+  padding?: number;
+  gap?: number;
+  isPanoramic?: boolean;
+}
+
+/**
+ * Screenshot metadata
+ */
+export interface ScreenshotMetadata {
+  id: string;
+  deviceType: DeviceType;
+  dimensions: DeviceDimensions;
+  format: ScreenshotFormat;
+  timestamp: Date;
+  fileSize: number;
+  url: string;
+}
+
+/**
+ * Screenshot generation options
+ */
+export interface ScreenshotGenerationOptions {
+  deviceType: DeviceType;
+  format?: ScreenshotFormat;
+  quality?: number;
+  customDimensions?: DeviceDimensions;
+}
+
+/**
+ * Screenshot template
+ */
+export interface ScreenshotTemplate {
+  id: string;
+  name: string;
+  description: string;
+  design: Partial<ScreenshotDesign>;
+  thumbnail?: string;
+}
+
+/**
+ * App Store metadata
+ */
+export interface AppStoreMetadata {
+  appName: string;
+  subtitle: string;
+  promotionalText: string;
+  keywords: string;
+  description: string;
+  whatsNew: string;
+}
+
+/**
+ * Screenshot project
+ */
+export interface ScreenshotProject {
+  id: string;
+  name: string;
+  design: ScreenshotDesign;
+  screens: ScreenshotContent[];
+  currentLanguage: Language;
+  selectedScreenId: string;
+  appMetadata: AppStoreMetadata;
+  appIcon: string | null;
+  createdAt: Date;
+  updatedAt: Date;
+}

package/src/index.ts

@@ -0,0 +1,102 @@
+/**
+ * @umituz/web-canvas
+ * Comprehensive canvas and screenshot generation library
+ */
+
+// Domain exports
+export type {
+  // Canvas types
+  CanvasFormat,
+  CanvasQuality,
+  CanvasDimensions,
+  CanvasPosition,
+  CanvasRect,
+  CanvasColor,
+  CanvasContextConfig,
+  CanvasExportOptions,
+  CanvasResult,
+  CanvasOperation,
+
+  // Screenshot types
+  DeviceType,
+  FrameStyle,
+  LayoutStyle,
+  BackgroundPattern,
+  ScreenshotFormat,
+  Language,
+  DeviceDimensions,
+  DeviceConfig,
+  ScreenshotContent,
+  ScreenshotDesign,
+  ScreenshotMetadata,
+  ScreenshotGenerationOptions,
+  ScreenshotTemplate,
+  AppStoreMetadata,
+  ScreenshotProject,
+
+  // Report types
+  ReportItemType,
+  ReportItem,
+  ReportSummary,
+  ReportData,
+  ExportFormat,
+  PDFExportOptions,
+  ExcelExportOptions,
+  CSVExportOptions,
+  ReportExportResult,
+} from './domain/types';
+
+export type {
+  CanvasConfig,
+  DeviceConfigOption,
+  ScreenshotStudioConfig,
+  ExportConfig,
+  AIConfig,
+} from './domain/config';
+
+export {
+  DEFAULT_CANVAS_CONFIG,
+} from './domain/config/CanvasConfig';
+
+export {
+  DEFAULT_DEVICE_CONFIG,
+  DEVICE_DIMENSIONS,
+} from './domain/config/DeviceConfig';
+
+export {
+  DEFAULT_SCREENSHOT_STUDIO_CONFIG,
+} from './domain/config/ScreenshotStudioConfig';
+
+// Infrastructure exports
+export { CanvasRenderer } from './infrastructure/renderers/CanvasRenderer';
+export { PatternRenderer } from './infrastructure/renderers/PatternRenderer';
+export {
+  ScreenshotRenderer,
+} from './infrastructure/renderers/ScreenshotRenderer';
+export {
+  DeviceConfigService,
+} from './infrastructure/services/DeviceConfigService';
+
+// Application exports
+export {
+  ScreenshotStudioService,
+} from './application/services/ScreenshotStudioService';
+export { ReportService } from './application/services/ReportService';
+
+// Presentation exports
+export {
+  useScreenshotStudio,
+  type UseScreenshotStudioOptions,
+  type UseScreenshotStudioReturn,
+} from './presentation/hooks/useScreenshotStudio';
+
+export {
+  useCanvasExport,
+  type UseCanvasExportOptions,
+  type UseCanvasExportReturn,
+} from './presentation/hooks/useCanvasExport';
+
+export {
+  useReportExport,
+  type UseReportExportReturn,
+} from './presentation/hooks/useReportExport';

package/src/infrastructure/index.ts

@@ -0,0 +1,9 @@
+/**
+ * Infrastructure Layer Index
+ * Export all infrastructure services and renderers
+ */
+
+export * from './services/DeviceConfigService';
+export * from './renderers/CanvasRenderer';
+export * from './renderers/PatternRenderer';
+export * from './renderers/ScreenshotRenderer';