mirror of
https://github.com/Memo-2023/mana-monorepo.git
synced 2026-05-16 17:59:39 +02:00
Add new @manacore/wallpaper-generator package for creating device wallpapers from QR codes and images. Features: - 30 device presets (phones, tablets, desktops) - 3 layout types (center, corner, pattern) - 5 gradient presets + solid color backgrounds - Browser (Canvas) and Node.js (Sharp) renderers - Svelte WallpaperModal UI component Integrations: - @manacore/qr-export: toWallpaper() function - @manacore/spiral-db: toWallpaper() function - QRExportModal: "Als Wallpaper" button Also includes the full @manacore/qr-export package which was previously untracked. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
140 lines
3.3 KiB
TypeScript
140 lines
3.3 KiB
TypeScript
/**
|
|
* @manacore/wallpaper-generator
|
|
*
|
|
* Device wallpaper generator from QR codes, Spiral-DB images, and other sources.
|
|
* Supports both browser (Canvas) and Node.js (Sharp) environments.
|
|
*
|
|
* @example Browser usage:
|
|
* ```ts
|
|
* import { createWallpaperGenerator } from '@manacore/wallpaper-generator';
|
|
*
|
|
* const generator = createWallpaperGenerator();
|
|
*
|
|
* const result = await generator.generate(
|
|
* { type: 'dataUrl', data: qrCodeDataUrl },
|
|
* {
|
|
* device: 'iphone-15-pro-max',
|
|
* layout: { type: 'center', scale: 0.8 },
|
|
* background: { type: 'gradient', colors: ['#1a1a2e', '#16213e'] },
|
|
* }
|
|
* );
|
|
*
|
|
* // Download the wallpaper
|
|
* downloadWallpaper(result, 'my-wallpaper.png');
|
|
* ```
|
|
*
|
|
* @example Node.js usage:
|
|
* ```ts
|
|
* import { createWallpaperGenerator, saveWallpaperToFile } from '@manacore/wallpaper-generator';
|
|
*
|
|
* const generator = createWallpaperGenerator();
|
|
*
|
|
* const result = await generator.generate(
|
|
* { type: 'dataUrl', data: imageDataUrl },
|
|
* {
|
|
* device: 'desktop-4k',
|
|
* layout: { type: 'corner', position: 'bottom-right', scale: 0.2 },
|
|
* background: { type: 'solid', color: '#0f0f23' },
|
|
* }
|
|
* );
|
|
*
|
|
* await saveWallpaperToFile(result, './wallpaper.png');
|
|
* ```
|
|
*/
|
|
|
|
// Types
|
|
export type {
|
|
// Image Sources
|
|
ImageSource,
|
|
DataUrlSource,
|
|
CanvasSource,
|
|
BufferSource,
|
|
// Device Presets
|
|
DevicePreset,
|
|
DeviceCategory,
|
|
CustomDevice,
|
|
DeviceOption,
|
|
// Layouts
|
|
Layout,
|
|
CenterLayout,
|
|
CornerLayout,
|
|
PatternLayout,
|
|
CornerPosition,
|
|
// Backgrounds
|
|
Background,
|
|
SolidBackground,
|
|
GradientBackground,
|
|
// Options & Results
|
|
WallpaperOptions,
|
|
WallpaperResult,
|
|
OutputFormat,
|
|
// Generator Interface
|
|
WallpaperGenerator,
|
|
// Svelte Props
|
|
WallpaperModalProps,
|
|
} from './types.js';
|
|
|
|
// Constants
|
|
export {
|
|
DEFAULT_CENTER_LAYOUT,
|
|
DEFAULT_CORNER_LAYOUT,
|
|
DEFAULT_PATTERN_LAYOUT,
|
|
DEFAULT_BACKGROUND,
|
|
GRADIENT_PRESETS,
|
|
} from './types.js';
|
|
|
|
// Device Presets
|
|
export {
|
|
PHONE_PRESETS,
|
|
TABLET_PRESETS,
|
|
DESKTOP_PRESETS,
|
|
ALL_DEVICE_PRESETS,
|
|
getDevicePreset,
|
|
getPresetsByCategory,
|
|
getRecommendedPresets,
|
|
} from './presets/index.js';
|
|
|
|
// Renderers
|
|
export {
|
|
createBrowserGenerator,
|
|
downloadWallpaper,
|
|
copyWallpaperToClipboard,
|
|
} from './renderers/browser.js';
|
|
export { createNodeGenerator, saveWallpaperToFile } from './renderers/node.js';
|
|
|
|
// =============================================================================
|
|
// FACTORY FUNCTION
|
|
// =============================================================================
|
|
|
|
import type { WallpaperGenerator } from './types.js';
|
|
import { createBrowserGenerator } from './renderers/browser.js';
|
|
import { createNodeGenerator } from './renderers/node.js';
|
|
|
|
/**
|
|
* Detect if running in browser environment
|
|
*/
|
|
function isBrowser(): boolean {
|
|
return typeof window !== 'undefined' && typeof document !== 'undefined';
|
|
}
|
|
|
|
/**
|
|
* Create a wallpaper generator appropriate for the current environment.
|
|
*
|
|
* - In browser: Uses Canvas API
|
|
* - In Node.js: Uses Sharp
|
|
*
|
|
* @param options - Optional configuration
|
|
* @param options.preferNode - Force Node.js renderer even in browser (requires Sharp)
|
|
* @returns WallpaperGenerator instance
|
|
*/
|
|
export function createWallpaperGenerator(options?: { preferNode?: boolean }): WallpaperGenerator {
|
|
if (options?.preferNode) {
|
|
return createNodeGenerator();
|
|
}
|
|
|
|
if (isBrowser()) {
|
|
return createBrowserGenerator();
|
|
}
|
|
|
|
return createNodeGenerator();
|
|
}
|