-
-
-
|
- - - 
-
- Download RapidRAW-Get the latest release for Windows, macOS, Linux, and Android. Packaged and ready to run. - Download Latest Version → -- |
-
- - - 
-
- Read the Docs-Learn how RapidRAW works with step-by-step tutorials, from adjustments to masking. - View Tutorials & Docs → -- |
-
- Core Editing Engine-
Professional Grade Adjustments-
|
-
- Library & Workflow-
Productivity & UI-
|
-
- 
- The main editor interface in action.
-
- 
- - Powerful batch operations and export. - |
-
- 
- - Customizable editor layout and panels. - |
-
- 
- - Advanced masking to speedup workflow. - |
-
- 
- - Experimental generative AI features. - |
-
- 
- - Library navigation and folder management. - |
-
- 
- - Beautiful themes and UI customization. - |
-
-
-
- Generative Replace, which can be powered by either a local ComfyUI backend or the upcoming optional cloud service.
-
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 +103 +104 +105 +106 +107 +108 +109 +110 +111 +112 +113 +114 +115 +116 +117 +118 +119 +120 +121 +122 +123 +124 +125 +126 +127 +128 +129 +130 +131 +132 +133 +134 +135 +136 +137 +138 +139 +140 +141 +142 +143 +144 +145 +146 +147 +148 +149 +150 +151 +152 +153 +154 +155 +156 +157 +158 +159 +160 +161 +162 +163 +164 +165 +166 +167 +168 +169 +170 +171 +172 +173 +174 +175 +176 +177 +178 +179 +180 +181 +182 +183 +184 +185 +186 +187 +188 +189 +190 +191 +192 +193 +194 +195 +196 +197 +198 +199 +200 +201 +202 +203 +204 +205 +206 +207 +208 +209 +210 +211 +212 +213 +214 +215 +216 +217 +218 +219 +220 +221 +222 +223 +224 +225 +226 +227 +228 +229 +230 +231 +232 +233 +234 +235 +236 +237 +238 +239 +240 +241 +242 +243 +244 +245 +246 +247 +248 +249 +250 +251 +252 +253 +254 +255 +256 +257 +258 +259 +260 +261 +262 +263 +264 +265 +266 +267 +268 +269 +270 +271 +272 +273 +274 +275 +276 +277 +278 +279 +280 +281 +282 +283 +284 +285 +286 +287 +288 +289 +290 +291 +292 +293 +294 | + + + + + + + + + + + + + + + + + + +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + | import {
+ Brush,
+ BringToFront,
+ Circle,
+ Cloud,
+ Droplet,
+ Droplets,
+ Eraser,
+ MoreHorizontal,
+ RectangleHorizontal,
+ Sparkles,
+ TriangleRight,
+ User,
+ Sun,
+ Stamp,
+ Bandage,
+} from 'lucide-react';
+import i18n from 'i18next';
+
+export enum Mask {
+ AiDepth = 'ai-depth',
+ AiForeground = 'ai-foreground',
+ AiSky = 'ai-sky',
+ AiSubject = 'ai-subject',
+ All = 'all',
+ Brush = 'brush',
+ Flow = 'flow',
+ Color = 'color',
+ Linear = 'linear',
+ Luminance = 'luminance',
+ QuickEraser = 'quick-eraser',
+ Radial = 'radial',
+ Clone = 'clone',
+ Heal = 'heal',
+}
+
+export enum SubMaskMode {
+ Additive = 'additive',
+ Subtractive = 'subtractive',
+ Intersect = 'intersect',
+}
+
+export enum ToolType {
+ AiSeletor = 'ai-selector',
+ Brush = 'brush',
+ Eraser = 'eraser',
+ GenerativeReplace = 'generative-replace',
+ SelectSubject = 'select-subject',
+}
+
+export interface MaskType {
+ disabled: boolean;
+ icon: any;
+ id?: string;
+ name: string;
+ type: Mask;
+}
+
+export interface SubMask {
+ id: string;
+ invert: boolean;
+ mode: SubMaskMode;
+ name?: string;
+ opacity: number;
+ parameters?: any;
+ type: Mask;
+ visible: boolean;
+}
+
+export function formatMaskTypeName(type: string) {
+ if (type === Mask.AiDepth) return i18n.t('masks.types.depth');
+ if (type === Mask.AiSubject) return i18n.t('masks.types.subject');
+ if (type === Mask.AiForeground) return i18n.t('masks.types.foreground');
+ if (type === Mask.AiSky) return i18n.t('masks.types.sky');
+ if (type === Mask.All) return i18n.t('masks.types.all');
+ if (type === Mask.QuickEraser) return i18n.t('masks.types.quickEraser');
+ if (type === Mask.Brush) return i18n.t('masks.types.brush');
+ if (type === Mask.Flow) return i18n.t('masks.types.flow');
+ if (type === Mask.Color) return i18n.t('masks.types.color');
+ if (type === Mask.Linear) return i18n.t('masks.types.linear');
+ if (type === Mask.Luminance) return i18n.t('masks.types.luminance');
+ if (type === Mask.Radial) return i18n.t('masks.types.radial');
+ if (type === Mask.Clone) return i18n.t('masks.types.clone');
+ if (type === Mask.Heal) return i18n.t('masks.types.heal');
+ return type.charAt(0).toUpperCase() + type.slice(1);
+}
+
+export function getMaskTypeName(mask: MaskType) {
+ if (mask.id === 'others') return i18n.t('masks.types.others');
+ if (mask.type === Mask.QuickEraser && mask.name === 'Quick Erase') {
+ return i18n.t('masks.types.quickErase');
+ }
+ return formatMaskTypeName(mask.type);
+}
+
+export function getSubMaskName(subMask: Pick<SubMask, 'name' | 'type'>) {
+ return subMask.name?.trim() || formatMaskTypeName(subMask.type);
+}
+
+export const MASK_ICON_MAP: Record<Mask, any> = {
+ [Mask.AiDepth]: BringToFront,
+ [Mask.AiForeground]: User,
+ [Mask.AiSky]: Cloud,
+ [Mask.AiSubject]: Sparkles,
+ [Mask.All]: RectangleHorizontal,
+ [Mask.Brush]: Brush,
+ [Mask.Flow]: Droplets,
+ [Mask.Color]: Droplet,
+ [Mask.Linear]: TriangleRight,
+ [Mask.Luminance]: Sparkles,
+ [Mask.QuickEraser]: Eraser,
+ [Mask.Radial]: Circle,
+ [Mask.Clone]: Stamp,
+ [Mask.Heal]: Bandage,
+};
+
+export const MASK_PANEL_CREATION_TYPES: Array<MaskType> = [
+ {
+ disabled: false,
+ icon: Sparkles,
+ name: 'Subject',
+ type: Mask.AiSubject,
+ },
+ {
+ disabled: false,
+ icon: Cloud,
+ name: 'Sky',
+ type: Mask.AiSky,
+ },
+ {
+ disabled: false,
+ icon: User,
+ name: 'Foreground',
+ type: Mask.AiForeground,
+ },
+ {
+ disabled: false,
+ icon: TriangleRight,
+ name: 'Linear',
+ type: Mask.Linear,
+ },
+ {
+ disabled: false,
+ icon: Circle,
+ name: 'Radial',
+ type: Mask.Radial,
+ },
+ {
+ disabled: false,
+ icon: MoreHorizontal,
+ id: 'others',
+ name: 'Others',
+ type: null as any,
+ },
+];
+
+export const AI_MANUAL_CLEANUP_TYPES: Array<MaskType> = [
+ {
+ disabled: false,
+ icon: Stamp,
+ name: 'Clone',
+ type: Mask.Clone,
+ },
+ {
+ disabled: false,
+ icon: Bandage,
+ name: 'Heal',
+ type: Mask.Heal,
+ },
+];
+
+export const AI_GENERATIVE_CREATION_TYPES: Array<MaskType> = [
+ {
+ disabled: false,
+ icon: Eraser,
+ name: 'Quick Erase',
+ type: Mask.QuickEraser,
+ },
+ {
+ disabled: false,
+ icon: Sparkles,
+ name: 'Subject',
+ type: Mask.AiSubject,
+ },
+ {
+ disabled: false,
+ icon: User,
+ name: 'Foreground',
+ type: Mask.AiForeground,
+ },
+ {
+ disabled: false,
+ icon: Brush,
+ name: 'Brush',
+ type: Mask.Brush,
+ },
+ {
+ disabled: false,
+ icon: TriangleRight,
+ name: 'Linear',
+ type: Mask.Linear,
+ },
+ {
+ disabled: false,
+ icon: Circle,
+ name: 'Radial',
+ type: Mask.Radial,
+ },
+];
+
+export const SUB_MASK_COMPONENT_TYPES: Array<MaskType> = [
+ {
+ disabled: false,
+ icon: Sparkles,
+ name: 'Subject',
+ type: Mask.AiSubject,
+ },
+ {
+ disabled: false,
+ icon: Cloud,
+ name: 'Sky',
+ type: Mask.AiSky,
+ },
+ {
+ disabled: false,
+ icon: User,
+ name: 'Foreground',
+ type: Mask.AiForeground,
+ },
+ {
+ disabled: false,
+ icon: TriangleRight,
+ name: 'Linear',
+ type: Mask.Linear,
+ },
+ {
+ disabled: false,
+ icon: Circle,
+ name: 'Radial',
+ type: Mask.Radial,
+ },
+ {
+ disabled: false,
+ icon: MoreHorizontal,
+ id: 'others',
+ name: 'Others',
+ type: null as any,
+ },
+];
+
+export const OTHERS_MASK_TYPES: Array<MaskType> = [
+ {
+ disabled: false,
+ icon: BringToFront,
+ name: 'Depth',
+ type: Mask.AiDepth,
+ },
+ {
+ disabled: false,
+ icon: Droplet,
+ name: 'Color',
+ type: Mask.Color,
+ },
+ {
+ disabled: false,
+ icon: Sun,
+ name: 'Luminance',
+ type: Mask.Luminance,
+ },
+ {
+ disabled: false,
+ icon: Brush,
+ name: 'Brush',
+ type: Mask.Brush,
+ },
+ {
+ disabled: false,
+ icon: Droplets,
+ name: 'Flow',
+ type: Mask.Flow,
+ },
+ {
+ disabled: false,
+ icon: RectangleHorizontal,
+ name: 'Whole Image',
+ type: Mask.All,
+ },
+];
+
+export const AI_SUB_MASK_COMPONENT_TYPES: Array<MaskType> = [
+ ...AI_MANUAL_CLEANUP_TYPES,
+ ...AI_GENERATIVE_CREATION_TYPES,
+];
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| Masks.tsx | +
+
+ |
+ 47.76% | +32/67 | +0% | +0/36 | +50% | +3/6 | +61.53% | +32/52 | +
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 | + + + + + + + + + + + + + + + + +1x + + + + + + + + +3x +3x +3x + +3x + +2x + + +10x +10x + + + + + + + +1x + + +1x + + + + + + + + + + + + | import { Home, SlidersHorizontal, Palette, UserCircle, FileInput } from 'lucide-react';
+import clsx from 'clsx';
+import { useTranslation } from 'react-i18next';
+
+import { Panel } from './AppProperties';
+import { useUIStore } from '../../store/useUIStore';
+
+interface AndroidBottomNavProps {
+ isAndroid: boolean;
+}
+
+interface NavItem {
+ panel: Panel | null;
+ icon: typeof Home;
+ labelKey: string;
+}
+
+const navItems: NavItem[] = [
+ { panel: null, icon: Home, labelKey: 'editor.android.bottomNav.library' },
+ { panel: Panel.Adjustments, icon: SlidersHorizontal, labelKey: 'editor.android.bottomNav.basic' },
+ { panel: Panel.Color, icon: Palette, labelKey: 'editor.android.bottomNav.color' },
+ { panel: Panel.Portrait, icon: UserCircle, labelKey: 'editor.android.bottomNav.portrait' },
+ { panel: Panel.Export, icon: FileInput, labelKey: 'editor.android.bottomNav.export' },
+];
+
+export default function AndroidBottomNav({ isAndroid }: AndroidBottomNavProps) {
+ const { t } = useTranslation();
+ const activeRightPanel = useUIStore((s) => s.activeRightPanel);
+ const setRightPanel = useUIStore((s) => s.setRightPanel);
+
+ if (!isAndroid) return null;
+
+ return (
+ <div className="flex items-center justify-around shrink-0 h-14 bg-bg-secondary border-t border-border-color">
+ {navItems.map(({ panel, icon: Icon, labelKey }) => {
+ const isActive = panel ? activeRightPanel === panel : activeRightPanel === null;
+ return (
+ <button
+ key={labelKey}
+ className={clsx(
+ 'flex flex-col items-center justify-center gap-0.5 px-3 py-1 rounded-md transition-colors',
+ isActive ? 'text-accent' : 'text-text-secondary',
+ )}
+ onClick={() => {
+ Iif (panel === null) {
+ setRightPanel(null);
+ } else {
+ setRightPanel(activeRightPanel === panel ? null : panel);
+ }
+ }}
+ >
+ <Icon size={22} strokeWidth={1.8} />
+ <span className="text-[11px] leading-tight font-medium tracking-wide">{t(labelKey as any)}</span>
+ </button>
+ );
+ })}
+ </div>
+ );
+}
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 +103 +104 +105 +106 +107 +108 +109 +110 +111 +112 +113 +114 +115 +116 +117 +118 | + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + +6x +6x + +6x + +1x +1x +1x +1x + + + + + + + +1x +1x + + + + + +6x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +20x + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + | import React, { useCallback, useState } from 'react';
+import { invoke } from '@tauri-apps/api/core';
+import { Share2, MessageCircle, X } from 'lucide-react';
+import { useTranslation } from 'react-i18next';
+import { motion, AnimatePresence } from 'framer-motion';
+import Text from './Text';
+import { TextVariants } from '../../types/typography';
+
+interface AndroidShareSheetProps {
+ filePath: string;
+ mimeType: string;
+ visible: boolean;
+ onClose: () => void;
+}
+
+interface ShareTarget {
+ id: string;
+ labelKey: string;
+ icon: React.ReactNode;
+}
+
+const SHARE_TARGETS: ShareTarget[] = [
+ { id: 'wechat', labelKey: 'androidShare.wechat', icon: <MessageCircle size={20} /> },
+ { id: 'qq', labelKey: 'androidShare.qq', icon: <MessageCircle size={20} /> },
+ { id: 'weibo', labelKey: 'androidShare.weibo', icon: <MessageCircle size={20} /> },
+ { id: 'more', labelKey: 'androidShare.more', icon: <Share2 size={20} /> },
+];
+
+export default function AndroidShareSheet({
+ filePath,
+ mimeType,
+ visible,
+ onClose,
+}: AndroidShareSheetProps) {
+ const { t } = useTranslation();
+ const [sharing, setSharing] = useState(false);
+
+ const handleShare = useCallback(
+ async (targetId: string) => {
+ Iif (sharing) return;
+ setSharing(true);
+ try {
+ await invoke('share_image', {
+ filePath,
+ mimeType,
+ title: t('androidShare.title' as any, { target: t(`androidShare.${targetId}` as any) }),
+ });
+ } catch (err) {
+ console.error('Share failed:', err);
+ } finally {
+ setSharing(false);
+ onClose();
+ }
+ },
+ [filePath, mimeType, sharing, t, onClose],
+ );
+
+ return (
+ <AnimatePresence>
+ {visible && (
+ <>
+ <motion.div
+ className="fixed inset-0 bg-black/40 z-40"
+ initial={{ opacity: 0 }}
+ animate={{ opacity: 1 }}
+ exit={{ opacity: 0 }}
+ onClick={onClose}
+ />
+ <motion.div
+ className="fixed bottom-0 left-0 right-0 bg-bg-primary rounded-t-2xl z-50 shadow-lg border-t border-surface"
+ initial={{ y: '100%' }}
+ animate={{ y: 0 }}
+ exit={{ y: '100%' }}
+ transition={{ type: 'spring', damping: 25, stiffness: 300 }}
+ >
+ <div className="flex items-center justify-between p-4 border-b border-surface">
+ <Text variant={TextVariants.title}>{t('androidShare.titleDefault' as any)}</Text>
+ <button
+ onClick={onClose}
+ className="p-1 rounded-full hover:bg-surface transition-colors"
+ >
+ <X size={20} className="text-text-secondary" />
+ </button>
+ </div>
+ <div className="p-4">
+ <div className="grid grid-cols-4 gap-4">
+ {SHARE_TARGETS.map((target) => (
+ <button
+ key={target.id}
+ onClick={() => handleShare(target.id)}
+ disabled={sharing}
+ className="flex flex-col items-center gap-2 p-3 rounded-xl hover:bg-surface transition-colors disabled:opacity-50"
+ >
+ <div className="w-12 h-12 rounded-full bg-surface flex items-center justify-center text-text-primary">
+ {target.icon}
+ </div>
+ <Text variant={TextVariants.small} className="text-text-secondary">
+ {t(target.labelKey as any)}
+ </Text>
+ </button>
+ ))}
+ </div>
+ </div>
+ <div className="p-4 pt-0">
+ <button
+ onClick={onClose}
+ className="w-full py-3 rounded-xl bg-surface text-text-secondary font-medium text-sm hover:bg-card-active transition-colors"
+ >
+ {t('androidShare.cancel' as any)}
+ </button>
+ </div>
+ </motion.div>
+ </>
+ )}
+ </AnimatePresence>
+ );
+}
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 +103 +104 +105 +106 +107 +108 +109 +110 +111 +112 +113 +114 +115 +116 +117 +118 +119 +120 +121 +122 +123 +124 +125 +126 +127 +128 +129 +130 +131 +132 +133 +134 +135 +136 +137 +138 +139 +140 +141 +142 +143 +144 +145 +146 +147 +148 +149 +150 +151 +152 +153 +154 +155 +156 +157 +158 +159 +160 +161 +162 +163 +164 +165 +166 +167 +168 +169 +170 +171 +172 +173 +174 +175 +176 +177 +178 +179 +180 +181 +182 +183 +184 +185 +186 +187 +188 +189 +190 +191 +192 +193 +194 +195 +196 +197 +198 +199 +200 +201 +202 +203 +204 +205 +206 +207 +208 +209 +210 +211 +212 +213 +214 +215 +216 +217 +218 +219 +220 +221 +222 +223 +224 +225 +226 +227 +228 +229 +230 +231 +232 +233 +234 +235 +236 +237 +238 +239 +240 +241 +242 +243 +244 +245 +246 +247 +248 +249 +250 +251 +252 +253 +254 +255 +256 +257 +258 +259 +260 +261 +262 +263 +264 +265 +266 +267 +268 +269 +270 +271 +272 +273 +274 +275 +276 +277 +278 +279 +280 +281 +282 +283 +284 +285 +286 +287 +288 +289 +290 +291 +292 +293 +294 +295 +296 +297 +298 +299 +300 +301 +302 +303 +304 +305 +306 +307 +308 +309 +310 +311 +312 +313 +314 +315 +316 +317 +318 +319 +320 +321 +322 +323 +324 +325 +326 +327 +328 +329 +330 +331 +332 +333 +334 +335 +336 +337 +338 +339 +340 +341 +342 +343 +344 +345 +346 +347 +348 +349 +350 +351 +352 +353 +354 +355 +356 +357 +358 +359 +360 +361 +362 +363 +364 +365 +366 +367 +368 +369 +370 +371 +372 +373 +374 +375 +376 +377 +378 +379 +380 +381 +382 +383 +384 +385 +386 +387 +388 +389 +390 +391 +392 +393 +394 +395 +396 +397 +398 +399 +400 +401 +402 | + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + +1x + +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x + + +1x +1x +1x + + + + + + + + + +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x +1x +1x + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x +1x +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x +1x +1x +1x +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + | import { ExportPreset } from './ExportImportProperties';
+import { Adjustments, CopyPasteSettings } from '../../utils/adjustments';
+import { ToolType } from '../panel/right/Masks';
+
+export const GLOBAL_KEYS = [
+ ' ',
+ 'ArrowUp',
+ 'ArrowDown',
+ 'ArrowLeft',
+ 'ArrowRight',
+ 'f',
+ 'b',
+ 'a',
+ 's',
+ 'd',
+ 'r',
+ 'm',
+ 'k',
+ 'p',
+ 'i',
+ 'e',
+ '0',
+ '1',
+ '2',
+ '3',
+ '4',
+ '5',
+ 'Enter',
+];
+export const OPTION_SEPARATOR = 'separator';
+
+export enum Invokes {
+ AddTagForPaths = 'add_tag_for_paths',
+ ApplyAdjustments = 'apply_adjustments',
+ ApplyAdjustmentsToPaths = 'apply_adjustments_to_paths',
+ ApplyAutoAdjustmentsToPaths = 'apply_auto_adjustments_to_paths',
+ ApplyDenoising = 'apply_denoising',
+ CalculateAutoAdjustments = 'calculate_auto_adjustments',
+ CancelExport = 'cancel_export',
+ CheckAIConnectorStatus = 'check_ai_connector_status',
+ ClearAllSidecars = 'clear_all_sidecars',
+ ClearAiTags = 'clear_ai_tags',
+ ClearAllTags = 'clear_all_tags',
+ ClearThumbnailCache = 'clear_thumbnail_cache',
+ CopyFiles = 'copy_files',
+ CreateFolder = 'create_folder',
+ CreateVirtualCopy = 'create_virtual_copy',
+ CullImages = 'cull_images',
+ DeleteFolder = 'delete_folder',
+ DuplicateFile = 'duplicate_file',
+ EstimateExportSizes = 'estimate_export_sizes',
+ ExportImages = 'export_images',
+ FrontendLog = 'frontend_log',
+ GenerateAiForegroundMask = 'generate_ai_foreground_mask',
+ GenerateAiSkyMask = 'generate_ai_sky_mask',
+ GenerateAiSubjectMask = 'generate_ai_subject_mask',
+ GenerateAiRating = 'generate_ai_rating',
+ GenerateAiRatingsBatch = 'generate_ai_ratings_batch',
+ GenerateFullscreenPreview = 'generate_fullscreen_preview',
+ GeneratePreviewForPath = 'generate_preview_for_path',
+ GenerateMaskOverlay = 'generate_mask_overlay',
+ GeneratePresetPreview = 'generate_preset_preview',
+ GenerateThumbnailsProgressive = 'generate_thumbnails_progressive',
+ GenerateUncroppedPreview = 'generate_uncropped_preview',
+ GetFolderTree = 'get_folder_tree',
+ GetFolderChildren = 'get_folder_children',
+ GetLogFilePath = 'get_log_file_path',
+ GetOrCreateInternalLibraryRoot = 'get_or_create_internal_library_root',
+ GetPinnedFolderTrees = 'get_pinned_folder_trees',
+ GetSupportedFileTypes = 'get_supported_file_types',
+ HandleExportPresetsToFile = 'handle_export_presets_to_file',
+ HandleImportPresetsFromFile = 'handle_import_presets_from_file',
+ HandleImportLegacyPresetsFromFile = 'handle_import_legacy_presets_from_file',
+ ImportFiles = 'import_files',
+ InvokeGenerativeReplace = 'invoke_generative_replace',
+ InvokeGenerativeReplaseWithMaskDef = 'invoke_generative_replace_with_mask_def',
+ ListImagesInDir = 'list_images_in_dir',
+ ListImagesRecursive = 'list_images_recursive',
+ LoadImage = 'load_image',
+ LoadMetadata = 'load_metadata',
+ LoadPresets = 'load_presets',
+ LoadSettings = 'load_settings',
+ MoveFiles = 'move_files',
+ ReadExifForPaths = 'read_exif_for_paths',
+ RemoveTagForPaths = 'remove_tag_for_paths',
+ RenameFiles = 'rename_files',
+ RenameFolder = 'rename_folder',
+ ResetAdjustmentsForPaths = 'reset_adjustments_for_paths',
+ SaveMetadataAndUpdateThumbnail = 'save_metadata_and_update_thumbnail',
+ SaveCollage = 'save_collage',
+ SaveDenoisedImage = 'save_denoised_image',
+ SavePanorama = 'save_panorama',
+ SaveHdr = 'save_hdr',
+ SavePresets = 'save_presets',
+ SaveSettings = 'save_settings',
+ SetColorLabelForPaths = 'set_color_label_for_paths',
+ SetRatingForPaths = 'set_rating_for_paths',
+ ShowInFinder = 'show_in_finder',
+ StartBackgroundIndexing = 'start_background_indexing',
+ StitchPanorama = 'stitch_panorama',
+ MergeHdr = 'merge_hdr',
+ TestAIConnectorConnection = 'test_ai_connector_connection',
+ UpdateWgpuTransform = 'update_wgpu_transform',
+ UpdateExifFields = 'update_exif_fields',
+ FetchCommunityPresets = 'fetch_community_presets',
+ GenerateAllCommunityPreviews = 'generate_all_community_previews',
+ SaveCommunityPreset = 'save_community_preset',
+ SaveTempFile = 'save_temp_file',
+ GetAlbums = 'get_albums',
+ SaveAlbums = 'save_albums',
+ AddToAlbum = 'add_to_album',
+ GetAlbumImages = 'get_album_images',
+}
+
+export enum ExifOverlay {
+ Off = 'off',
+ Hover = 'hover',
+ Always = 'always',
+}
+
+export enum Panel {
+ Adjustments = 'adjustments',
+ Ai = 'ai',
+ Color = 'color',
+ Crop = 'crop',
+ Export = 'export',
+ Masks = 'masks',
+ Metadata = 'metadata',
+ Portrait = 'portrait',
+ Presets = 'presets',
+}
+
+export enum RawStatus {
+ All = 'all',
+ NonRawOnly = 'nonRawOnly',
+ RawOnly = 'rawOnly',
+ RawOverNonRaw = 'rawOverNonRaw',
+}
+
+export enum SortDirection {
+ Ascending = 'asc',
+ Descending = 'desc',
+}
+
+export type FolderSortKey = 'name' | 'modified' | 'created' | 'imageCount';
+
+export interface FolderTreeSort {
+ key: FolderSortKey;
+ order: SortDirection;
+}
+
+export enum Theme {
+ Arctic = 'arctic',
+ Blue = 'blue',
+ Dark = 'dark',
+ Grey = 'grey',
+ Light = 'light',
+ MutedGreen = 'muted-green',
+ Sepia = 'sepia',
+ Snow = 'snow',
+}
+
+export enum ThumbnailAspectRatio {
+ Cover = 'cover',
+ Contain = 'contain',
+}
+
+export interface AppSettings {
+ aiConnectorAddress?: string;
+ aiProvider?: string;
+ decorations?: any;
+ editorPreviewResolution?: number;
+ enableZoomHifi?: boolean;
+ useFullDpiRendering?: boolean;
+ highResZoomMultiplier?: number;
+ enableLivePreviews?: boolean;
+ livePreviewQuality?: string;
+ enableAiTagging?: boolean;
+ filterCriteria?: FilterCriteria;
+ lastFolderState?: any;
+ pinnedFolders?: any;
+ rootFolders?: string[];
+ taggingShortcuts?: string[];
+ lastRootPath: string | null;
+ libraryViewMode?: LibraryViewMode;
+ sortCriteria?: SortCriteria;
+ theme: Theme;
+ thumbnailSize?: ThumbnailSize;
+ thumbnailAspectRatio?: ThumbnailAspectRatio;
+ uiVisibility?: UiVisibility;
+ adjustmentVisibility?: { [key: string]: boolean };
+ rawHighlightCompression?: number;
+ processingBackend?: string;
+ linuxGpuOptimization?: boolean;
+ exportPresets?: ExportPreset[];
+ myLenses?: any;
+ enableFolderImageCounts?: boolean;
+ displayEditIcon?: boolean;
+ linearRawMode?: string;
+ enableXmpSync?: boolean;
+ createXmpIfMissing?: boolean;
+ isWaveformVisible?: boolean;
+ waveformHeight?: number;
+ activeWaveformChannel?: string;
+ useWgpuRenderer?: boolean;
+ canvasInputMode?: 'mouse' | 'trackpad';
+ zoomSpeedMultiplier?: number;
+ keybinds?: { [action: string]: string[] };
+ tonemapperOverrideEnabled?: boolean;
+ defaultRawTonemapper?: string;
+ defaultNonRawTonemapper?: string;
+ copyPasteSettings?: CopyPasteSettings;
+ enableFocusMode?: boolean;
+ openTreeSections?: string[];
+ folderIcons?: Record<string, string>;
+ exifOverlay?: ExifOverlay;
+ language?: string;
+ folderTreeSort?: FolderTreeSort;
+}
+
+export interface BrushSettings {
+ feather: number;
+ size: number;
+ tool: ToolType;
+}
+
+export enum LibraryViewMode {
+ Flat = 'flat',
+ Recursive = 'recursive',
+}
+
+export const EditedStatus = {
+ All: 'all',
+ EditedOnly: 'editedOnly',
+ UneditedOnly: 'uneditedOnly',
+} as const;
+
+export type EditedStatus = (typeof EditedStatus)[keyof typeof EditedStatus];
+
+export interface FilterCriteria {
+ colors: Array<string>;
+ rating: number;
+ rawStatus: RawStatus;
+ editedStatus?: EditedStatus;
+}
+
+export interface Folder {
+ children: any;
+ id?: string | undefined;
+ name?: string | undefined;
+ imageCount?: number;
+}
+
+export interface ImageFile {
+ is_edited: boolean;
+ modified: number;
+ path: string;
+ rating: number;
+ tags: Array<string> | null;
+ exif: { [key: string]: string } | null;
+ is_virtual_copy: boolean;
+ is_cloud_placeholder: boolean;
+}
+
+export interface Option {
+ color?: string;
+ disabled?: boolean;
+ icon?: any;
+ isDestructive?: boolean;
+ label?: string;
+ onClick?(): void;
+ onRightClick?(): void;
+ submenu?: any;
+ type?: string;
+}
+
+export enum Orientation {
+ Horizontal = 'horizontal',
+ Vertical = 'vertical',
+}
+
+export interface Preset {
+ adjustments: Partial<Adjustments>;
+ folder?: Folder;
+ id: string;
+ name: string;
+ includeMasks?: boolean;
+ includeCropTransform?: boolean;
+ presetType?: 'tool' | 'style' | 'portrait' | 'color' | 'ai-color' | 'combined';
+}
+
+export interface Progress {
+ completed?: number;
+ current?: number;
+ total: number;
+}
+
+export interface SelectedImage {
+ exif: any;
+ height: number;
+ isRaw: boolean;
+ isReady: boolean;
+ metadata?: any;
+ original_base64?: string;
+ originalUrl: string | null;
+ path: string;
+ thumbnailUrl: string;
+ width: number;
+}
+
+export interface SortCriteria {
+ key: string;
+ label?: string;
+ order: string;
+}
+
+export interface SupportedTypes {
+ nonRaw: Array<string>;
+ raw: Array<string>;
+}
+
+export enum ThumbnailSize {
+ Large = 'large',
+ Medium = 'medium',
+ Small = 'small',
+ List = 'list',
+}
+
+export interface TransformState {
+ positionX: number;
+ positionY: number;
+ scale: number;
+}
+
+export interface UiVisibility {
+ folderTree: boolean;
+ filmstrip: boolean;
+}
+
+export interface WaveformData {
+ blue: string;
+ green: string;
+ height: number;
+ luma: string;
+ red: string;
+ rgb: string;
+ parade: string;
+ vectorscope: string;
+ width: number;
+}
+
+export interface CullingSettings {
+ similarityThreshold: number;
+ blurThreshold: number;
+ groupSimilar: boolean;
+ filterBlurry: boolean;
+}
+
+export interface ImageAnalysisResult {
+ path: string;
+ qualityScore: number;
+ sharpnessMetric: number;
+ centerFocusMetric: number;
+ exposureMetric: number;
+ width: number;
+ height: number;
+}
+
+export interface CullGroup {
+ representative: ImageAnalysisResult;
+ duplicates: ImageAnalysisResult[];
+}
+
+export interface CullingSuggestions {
+ similarGroups: CullGroup[];
+ blurryImages: ImageAnalysisResult[];
+ failedPaths: string[];
+}
+
+export interface KeybindHandler {
+ shouldFire?: () => boolean;
+ execute: (event: KeyboardEvent) => void;
+}
+
+export type AlbumItem = Album | AlbumGroup;
+
+export interface Album {
+ type: 'album';
+ id: string;
+ name: string;
+ icon?: string;
+ images: string[];
+}
+
+export interface AlbumGroup {
+ type: 'group';
+ id: string;
+ name: string;
+ icon?: string;
+ children: AlbumItem[];
+}
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 | + + + + + + + + + + + + + + + + + + +1x + +25x + +25x + + + + + + + + + + + + + + + + + +1x + + | import React, { forwardRef } from 'react';
+import clsx from 'clsx';
+import {
+ TextWeight,
+ TextColor,
+ VariantConfig,
+ TEXT_WEIGHT_KEYS,
+ TEXT_COLOR_KEYS,
+ TextVariants,
+} from '../../types/typography';
+
+export interface TextProps extends React.HTMLAttributes<HTMLElement> {
+ variant?: VariantConfig;
+ weight?: TextWeight;
+ color?: TextColor;
+ as?: React.ElementType;
+ children: React.ReactNode;
+}
+
+export const Text = forwardRef<HTMLElement, TextProps>(
+ ({ variant = TextVariants.body, weight, color, as, className, children, ...props }, ref) => {
+ const Component = as || variant.defaultElement;
+
+ return (
+ <Component
+ ref={ref}
+ className={clsx(
+ variant.size,
+ TEXT_WEIGHT_KEYS[weight ?? variant.defaultWeight],
+ TEXT_COLOR_KEYS[color ?? variant.defaultColor],
+ variant.extraClasses,
+ className,
+ )}
+ {...props}
+ >
+ {children}
+ </Component>
+ );
+ },
+);
+
+Text.displayName = 'Text';
+export default Text;
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| AndroidBottomNav.tsx | +
+
+ |
+ 92.85% | +13/14 | +80% | +8/10 | +100% | +5/5 | +90.9% | +10/11 | +
| AndroidShareSheet.tsx | +
+
+ |
+ 86.66% | +13/15 | +75% | +3/4 | +100% | +4/4 | +92.85% | +13/14 | +
| AppProperties.tsx | +
+
+ |
+ 100% | +129/129 | +100% | +0/0 | +100% | +10/10 | +100% | +129/129 | +
| Text.tsx | +
+
+ |
+ 100% | +4/4 | +100% | +7/7 | +100% | +1/1 | +100% | +4/4 | +
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| useAndroidBackHandler.ts | +
+
+ |
+ 45.61% | +26/57 | +56.25% | +18/32 | +57.14% | +4/7 | +47.16% | +25/53 | +
| useTouchGestures.ts | +
+
+ |
+ 44.24% | +73/165 | +17.3% | +9/52 | +37.5% | +12/32 | +47.71% | +73/153 | +
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 | + + + + +4x +4x +4x + +3x +2x + +2x +1x +1x + +1x + + + +1x + + + +1x + + + +1x + + + +1x + + + +1x + + + +1x + + + +1x + + + +1x + + + + + + + + + + + + +1x + + + + + + + + + + + + +1x + + + +1x + + + +1x + + + + + +1x + + + + +1x + + +3x +3x + + + + | import { useEffect } from 'react';
+import { useUIStore } from '../store/useUIStore';
+import { useSettingsStore } from '../store/useSettingsStore';
+
+export function useAndroidBackHandler() {
+ useEffect(() => {
+ const osPlatform = useSettingsStore.getState().osPlatform;
+ if (osPlatform !== 'android') return;
+
+ (window as any).__handleAndroidBack = () => {
+ const ui = useUIStore.getState();
+
+ if (ui.confirmModalState.isOpen) {
+ ui.setUI((state: any) => ({ confirmModalState: { ...state.confirmModalState, isOpen: false } }));
+ return;
+ }
+ Iif (ui.isCreateFolderModalOpen) {
+ ui.setUI({ isCreateFolderModalOpen: false });
+ return;
+ }
+ Iif (ui.isRenameFolderModalOpen) {
+ ui.setUI({ isRenameFolderModalOpen: false });
+ return;
+ }
+ Iif (ui.isRenameFileModalOpen) {
+ ui.setUI({ isRenameFileModalOpen: false });
+ return;
+ }
+ Iif (ui.isImportModalOpen) {
+ ui.setUI({ isImportModalOpen: false });
+ return;
+ }
+ Iif (ui.isCopyPasteSettingsModalOpen) {
+ ui.setUI({ isCopyPasteSettingsModalOpen: false });
+ return;
+ }
+ Iif (ui.isCreateAlbumModalOpen) {
+ ui.setUI({ isCreateAlbumModalOpen: false });
+ return;
+ }
+ Iif (ui.isCreateAlbumGroupModalOpen) {
+ ui.setUI({ isCreateAlbumGroupModalOpen: false });
+ return;
+ }
+ Iif (ui.isRenameAlbumModalOpen) {
+ ui.setUI({ isRenameAlbumModalOpen: false });
+ return;
+ }
+ Iif (ui.panoramaModalState.isOpen) {
+ ui.setUI({
+ panoramaModalState: {
+ isOpen: false,
+ isProcessing: false,
+ progressMessage: '',
+ finalImageBase64: null,
+ error: null,
+ stitchingSourcePaths: [],
+ },
+ });
+ return;
+ }
+ Iif (ui.hdrModalState.isOpen) {
+ ui.setUI({
+ hdrModalState: {
+ isOpen: false,
+ isProcessing: false,
+ progressMessage: '',
+ finalImageBase64: null,
+ error: null,
+ stitchingSourcePaths: [],
+ },
+ });
+ return;
+ }
+ Iif (ui.negativeModalState.isOpen) {
+ ui.setUI((state: any) => ({ negativeModalState: { ...state.negativeModalState, isOpen: false } }));
+ return;
+ }
+ Iif (ui.denoiseModalState.isOpen) {
+ ui.setUI((state: any) => ({ denoiseModalState: { ...state.denoiseModalState, isOpen: false } }));
+ return;
+ }
+ Iif (ui.cullingModalState.isOpen) {
+ ui.setUI({
+ cullingModalState: { isOpen: false, progress: null, suggestions: null, error: null, pathsToCull: [] },
+ });
+ return;
+ }
+ Iif (ui.collageModalState.isOpen) {
+ ui.setUI({ collageModalState: { isOpen: false, sourceImages: [] } });
+ return;
+ }
+
+ window.dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape', code: 'Escape', bubbles: true, cancelable: true }));
+ };
+
+ return () => {
+ delete (window as any).__handleAndroidBack;
+ };
+ }, []);
+}
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 +103 +104 +105 +106 +107 +108 +109 +110 +111 +112 +113 +114 +115 +116 +117 +118 +119 +120 +121 +122 +123 +124 +125 +126 +127 +128 +129 +130 +131 +132 +133 +134 +135 +136 +137 +138 +139 +140 +141 +142 +143 +144 +145 +146 +147 +148 +149 +150 +151 +152 +153 +154 +155 +156 +157 +158 +159 +160 +161 +162 +163 +164 +165 +166 +167 +168 +169 +170 +171 +172 +173 +174 +175 +176 +177 +178 +179 +180 +181 +182 +183 +184 +185 +186 +187 +188 +189 +190 +191 +192 +193 +194 +195 +196 +197 +198 +199 +200 +201 +202 +203 +204 +205 +206 +207 +208 +209 +210 +211 +212 +213 +214 +215 +216 +217 +218 +219 +220 +221 +222 +223 +224 +225 +226 +227 +228 +229 +230 +231 +232 +233 +234 +235 +236 +237 +238 +239 +240 +241 +242 +243 +244 +245 +246 +247 +248 +249 +250 +251 +252 +253 +254 +255 +256 +257 +258 +259 +260 +261 +262 +263 +264 +265 +266 +267 +268 +269 +270 +271 +272 +273 +274 +275 +276 +277 +278 +279 +280 +281 +282 +283 +284 +285 +286 +287 +288 +289 +290 +291 +292 +293 +294 +295 +296 +297 +298 +299 +300 +301 +302 +303 +304 +305 +306 +307 +308 +309 +310 +311 +312 +313 +314 +315 +316 +317 +318 +319 +320 +321 +322 +323 +324 +325 +326 +327 +328 +329 +330 +331 +332 | + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x +1x +1x + +1x +1x + +1x + + + + + + + +1x + + + + + + + + + + + + + + + + + +1x + + + + + + + + + +1x +1x +1x + +1x +1x +1x + +1x +1x +1x +1x + + + +1x + + + + + + + + + + + + + + + + +1x +1x +1x + +1x + + + + + + + +1x + + + + + + + + + + + + + +1x + + + + + +1x +1x +1x + +1x +1x +1x + +1x +1x +1x +1x + + + +1x + + + + + + + + + + + + + + + + + + +1x +1x +1x + +1x +1x +1x + +1x + + + + + + + + + + +1x + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + +1x +1x +1x + +1x +1x +1x + +1x +1x +1x +1x + + + +1x + + + + + + + + + + + + + + + + + + + + + +1x +1x +1x + +1x +1x + +1x + + + + + +1x + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + +1x +1x + + + + + + +1x +1x +1x + +1x +1x +1x +1x + + + + | import { useEffect, useCallback, useRef, RefObject } from 'react';
+
+interface Point {
+ x: number;
+ y: number;
+}
+
+function getTouchPoint(touch: Touch): Point {
+ return { x: touch.clientX, y: touch.clientY };
+}
+
+function getDistance(p1: Point, p2: Point): number {
+ const dx = p1.x - p2.x;
+ const dy = p1.y - p2.y;
+ return Math.sqrt(dx * dx + dy * dy);
+}
+
+function getAngle(p1: Point, p2: Point): number {
+ return Math.atan2(p2.y - p1.y, p2.x - p1.x);
+}
+
+function getMidpoint(p1: Point, p2: Point): Point {
+ return { x: (p1.x + p2.x) / 2, y: (p1.y + p2.y) / 2 };
+}
+
+/**
+ * 双指缩放手势 hook
+ * 监听元素上的双指捏合/张开手势，回调当前缩放比例
+ */
+export function usePinchZoom(
+ ref: RefObject<HTMLElement>,
+ options?: {
+ minScale?: number;
+ maxScale?: number;
+ onScaleChange?: (scale: number) => void;
+ },
+) {
+ const minScale = options?.minScale ?? 0.1;
+ const maxScale = options?.maxScale ?? 10;
+ const onScaleChange = options?.onScaleChange;
+
+ const initialDistanceRef = useRef(0);
+ const currentScaleRef = useRef(1);
+
+ const handleTouchStart = useCallback((e: TouchEvent) => {
+ if (e.touches.length !== 2) return;
+ e.preventDefault();
+ const p1 = getTouchPoint(e.touches[0]);
+ const p2 = getTouchPoint(e.touches[1]);
+ initialDistanceRef.current = getDistance(p1, p2);
+ }, []);
+
+ const handleTouchMove = useCallback(
+ (e: TouchEvent) => {
+ if (e.touches.length !== 2) return;
+ e.preventDefault();
+ const p1 = getTouchPoint(e.touches[0]);
+ const p2 = getTouchPoint(e.touches[1]);
+ const currentDistance = getDistance(p1, p2);
+ if (initialDistanceRef.current === 0) {
+ initialDistanceRef.current = currentDistance;
+ return;
+ }
+ const ratio = currentDistance / initialDistanceRef.current;
+ const newScale = Math.min(maxScale, Math.max(minScale, currentScaleRef.current * ratio));
+ onScaleChange?.(newScale);
+ },
+ [minScale, maxScale, onScaleChange],
+ );
+
+ const handleTouchEnd = useCallback((e: TouchEvent) => {
+ if (e.touches.length < 2) {
+ // Finalize the scale
+ // The last scale value is already applied via onScaleChange
+ initialDistanceRef.current = 0;
+ // Update the ref to the last emitted scale so next gesture is relative
+ // Consumer should call a setter to keep currentScaleRef in sync
+ }
+ }, []);
+
+ useEffect(() => {
+ const el = ref.current;
+ Iif (!el) return;
+
+ el.addEventListener('touchstart', handleTouchStart, { passive: false });
+ el.addEventListener('touchmove', handleTouchMove, { passive: false });
+ el.addEventListener('touchend', handleTouchEnd);
+
+ return () => {
+ el.removeEventListener('touchstart', handleTouchStart);
+ el.removeEventListener('touchmove', handleTouchMove);
+ el.removeEventListener('touchend', handleTouchEnd);
+ };
+ }, [ref, handleTouchStart, handleTouchMove, handleTouchEnd]);
+
+ return {
+ setCurrentScale: (scale: number) => {
+ currentScaleRef.current = scale;
+ },
+ };
+}
+
+/**
+ * 双指旋转手势 hook
+ * 监听元素上的双指旋转手势，回调旋转角度（弧度）
+ */
+export function useTwoFingerRotate(
+ ref: RefObject<HTMLElement>,
+ options?: {
+ onRotationChange?: (rotation: number) => void;
+ },
+) {
+ const onRotationChange = options?.onRotationChange;
+ const initialAngleRef = useRef(0);
+ const currentRotationRef = useRef(0);
+
+ const handleTouchStart = useCallback((e: TouchEvent) => {
+ if (e.touches.length !== 2) return;
+ e.preventDefault();
+ const p1 = getTouchPoint(e.touches[0]);
+ const p2 = getTouchPoint(e.touches[1]);
+ initialAngleRef.current = getAngle(p1, p2);
+ }, []);
+
+ const handleTouchMove = useCallback(
+ (e: TouchEvent) => {
+ if (e.touches.length !== 2) return;
+ e.preventDefault();
+ const p1 = getTouchPoint(e.touches[0]);
+ const p2 = getTouchPoint(e.touches[1]);
+ const currentAngle = getAngle(p1, p2);
+ const delta = currentAngle - initialAngleRef.current;
+ const newRotation = currentRotationRef.current + delta;
+ onRotationChange?.(newRotation);
+ },
+ [onRotationChange],
+ );
+
+ const handleTouchEnd = useCallback(() => {
+ if (initialAngleRef.current !== 0) {
+ initialAngleRef.current = 0;
+ }
+ }, []);
+
+ useEffect(() => {
+ const el = ref.current;
+ Iif (!el) return;
+
+ el.addEventListener('touchstart', handleTouchStart, { passive: false });
+ el.addEventListener('touchmove', handleTouchMove, { passive: false });
+ el.addEventListener('touchend', handleTouchEnd);
+
+ return () => {
+ el.removeEventListener('touchstart', handleTouchStart);
+ el.removeEventListener('touchmove', handleTouchMove);
+ el.removeEventListener('touchend', handleTouchEnd);
+ };
+ }, [ref, handleTouchStart, handleTouchMove, handleTouchEnd]);
+
+ return {
+ setCurrentRotation: (rotation: number) => {
+ currentRotationRef.current = rotation;
+ },
+ };
+}
+
+/**
+ * 单指拖拽画布手势 hook
+ * 监听元素上的单指拖拽，回调偏移量 {dx, dy}
+ */
+export function useCanvasPan(
+ ref: RefObject<HTMLElement>,
+ options?: {
+ onPanChange?: (offset: { dx: number; dy: number }) => void;
+ onPanStart?: () => void;
+ onPanEnd?: () => void;
+ },
+) {
+ const onPanChange = options?.onPanChange;
+ const onPanStart = options?.onPanStart;
+ const onPanEnd = options?.onPanEnd;
+
+ const startPointRef = useRef<Point | null>(null);
+ const accumulatedRef = useRef({ dx: 0, dy: 0 });
+ const isPanningRef = useRef(false);
+
+ const handleTouchStart = useCallback(
+ (e: TouchEvent) => {
+ if (e.touches.length !== 1) return;
+ const point = getTouchPoint(e.touches[0]);
+ startPointRef.current = point;
+ isPanningRef.current = true;
+ onPanStart?.();
+ },
+ [onPanStart],
+ );
+
+ const handleTouchMove = useCallback(
+ (e: TouchEvent) => {
+ if (!isPanningRef.current || e.touches.length !== 1 || !startPointRef.current) return;
+ e.preventDefault();
+ const currentPoint = getTouchPoint(e.touches[0]);
+ const dx = currentPoint.x - startPointRef.current.x;
+ const dy = currentPoint.y - startPointRef.current.y;
+ onPanChange?.({ dx: accumulatedRef.current.dx + dx, dy: accumulatedRef.current.dy + dy });
+ },
+ [onPanChange],
+ );
+
+ const handleTouchEnd = useCallback(
+ (e: TouchEvent) => {
+ if (!isPanningRef.current || !startPointRef.current) return;
+ // Finalize: accumulate the delta
+ if (e.changedTouches.length > 0) {
+ const endPoint = getTouchPoint(e.changedTouches[0]);
+ const dx = endPoint.x - startPointRef.current.x;
+ const dy = endPoint.y - startPointRef.current.y;
+ accumulatedRef.current = {
+ dx: accumulatedRef.current.dx + dx,
+ dy: accumulatedRef.current.dy + dy,
+ };
+ }
+ isPanningRef.current = false;
+ startPointRef.current = null;
+ onPanEnd?.();
+ },
+ [onPanEnd],
+ );
+
+ useEffect(() => {
+ const el = ref.current;
+ Iif (!el) return;
+
+ el.addEventListener('touchstart', handleTouchStart, { passive: false });
+ el.addEventListener('touchmove', handleTouchMove, { passive: false });
+ el.addEventListener('touchend', handleTouchEnd);
+
+ return () => {
+ el.removeEventListener('touchstart', handleTouchStart);
+ el.removeEventListener('touchmove', handleTouchMove);
+ el.removeEventListener('touchend', handleTouchEnd);
+ };
+ }, [ref, handleTouchStart, handleTouchMove, handleTouchEnd]);
+
+ return {
+ resetOffset: () => {
+ accumulatedRef.current = { dx: 0, dy: 0 };
+ onPanChange?.({ dx: 0, dy: 0 });
+ },
+ setOffset: (dx: number, dy: number) => {
+ accumulatedRef.current = { dx, dy };
+ },
+ };
+}
+
+/**
+ * 滑动翻页手势 hook（胶片条使用）
+ * 检测左滑/右滑手势并回调方向
+ */
+export function useSwipeNavigation(
+ options?: {
+ threshold?: number;
+ onSwipeLeft?: () => void;
+ onSwipeRight?: () => void;
+ },
+) {
+ const threshold = options?.threshold ?? 50;
+ const onSwipeLeft = options?.onSwipeLeft;
+ const onSwipeRight = options?.onSwipeRight;
+
+ const startPointRef = useRef<Point | null>(null);
+ const startTimeRef = useRef(0);
+
+ const handleTouchStart = useCallback((e: TouchEvent) => {
+ if (e.touches.length !== 1) return;
+ startPointRef.current = getTouchPoint(e.touches[0]);
+ startTimeRef.current = Date.now();
+ }, []);
+
+ const handleTouchMove = useCallback(
+ (e: TouchEvent) => {
+ // Optional: could add real-time visual feedback here
+ },
+ [],
+ );
+
+ const handleTouchEnd = useCallback(
+ (e: TouchEvent) => {
+ if (!startPointRef.current || e.changedTouches.length === 0) return;
+ const endPoint = getTouchPoint(e.changedTouches[0]);
+ const dx = endPoint.x - startPointRef.current.x;
+ const dy = endPoint.y - startPointRef.current.y;
+ const dt = Date.now() - startTimeRef.current;
+
+ // Only count as swipe if horizontal movement is dominant and exceeds threshold
+ const isHorizontalSwipe = Math.abs(dx) > Math.abs(dy) * 1.5;
+ const isFastEnough = dt < 500;
+ const exceedsThreshold = Math.abs(dx) > threshold;
+
+ if (isHorizontalSwipe && isFastEnough && exceedsThreshold) {
+ if (dx < 0) {
+ onSwipeLeft?.();
+ } else {
+ onSwipeRight?.();
+ }
+ }
+
+ startPointRef.current = null;
+ },
+ [threshold, onSwipeLeft, onSwipeRight],
+ );
+
+ useEffect(() => {
+ const handler = {
+ start: handleTouchStart,
+ move: handleTouchMove,
+ end: handleTouchEnd,
+ };
+
+ // Attach to window for global swipe detection (e.g. filmstrip)
+ window.addEventListener('touchstart', handler.start, { passive: true });
+ window.addEventListener('touchmove', handler.move, { passive: true });
+ window.addEventListener('touchend', handler.end);
+
+ return () => {
+ window.removeEventListener('touchstart', handler.start);
+ window.removeEventListener('touchmove', handler.move);
+ window.removeEventListener('touchend', handler.end);
+ };
+ }, [handleTouchStart, handleTouchMove, handleTouchEnd]);
+}
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| components/panel/right | +
+
+ |
+ 47.76% | +32/67 | +0% | +0/36 | +50% | +3/6 | +61.53% | +32/52 | +
| components/ui | +
+
+ |
+ 98.14% | +159/162 | +85.71% | +18/21 | +100% | +20/20 | +98.73% | +156/158 | +
| hooks | +
+
+ |
+ 44.59% | +99/222 | +32.14% | +27/84 | +41.02% | +16/39 | +47.57% | +98/206 | +
| store | +
+
+ |
+ 25% | +3/12 | +0% | +0/10 | +20% | +1/5 | +20% | +2/10 | +
| types | +
+
+ |
+ 100% | +5/5 | +100% | +0/0 | +100% | +0/0 | +100% | +5/5 | +
| utils | +
+
+ |
+ 95.16% | +118/124 | +39.65% | +46/116 | +84% | +21/25 | +96.61% | +114/118 | +
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| useUIStore.ts | +
+
+ |
+ 25% | +3/12 | +0% | +0/10 | +20% | +1/5 | +20% | +2/10 | +
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 +103 +104 +105 +106 +107 +108 +109 +110 +111 +112 +113 +114 +115 +116 +117 +118 +119 +120 +121 +122 +123 +124 +125 +126 +127 +128 +129 +130 +131 +132 +133 +134 +135 +136 +137 +138 +139 +140 +141 +142 +143 +144 +145 +146 +147 +148 +149 +150 +151 +152 +153 +154 +155 +156 +157 +158 +159 +160 +161 +162 +163 +164 +165 +166 +167 +168 +169 +170 +171 +172 +173 +174 +175 +176 +177 +178 +179 +180 +181 +182 +183 +184 +185 +186 +187 +188 +189 +190 +191 +192 +193 +194 +195 +196 +197 +198 +199 +200 +201 +202 +203 +204 +205 +206 +207 +208 +209 +210 +211 +212 +213 +214 +215 +216 +217 +218 +219 +220 +221 | + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + | import { create } from 'zustand';
+import { ImageFile, LibraryViewMode, Panel, UiVisibility, CullingSuggestions } from '../components/ui/AppProperties';
+
+const RIGHT_PANEL_ORDER = [
+ Panel.Metadata,
+ Panel.Adjustments,
+ Panel.Color,
+ Panel.Portrait,
+ Panel.Crop,
+ Panel.Masks,
+ Panel.Ai,
+ Panel.Presets,
+ Panel.Export,
+];
+
+export interface CollapsibleSectionsState {
+ basic: boolean;
+ color: boolean;
+ curves: boolean;
+ details: boolean;
+ effects: boolean;
+}
+
+export interface ConfirmModalState {
+ confirmText?: string;
+ confirmVariant?: string;
+ isOpen: boolean;
+ message?: string;
+ onConfirm?(): void;
+ title?: string;
+}
+
+export interface CollageModalState {
+ isOpen: boolean;
+ sourceImages: ImageFile[];
+}
+
+export interface PanoramaModalState {
+ error: string | null;
+ finalImageBase64: string | null;
+ isOpen: boolean;
+ isProcessing: boolean;
+ progressMessage: string | null;
+ stitchingSourcePaths: Array<string>;
+}
+
+export interface HdrModalState {
+ error: string | null;
+ finalImageBase64: string | null;
+ isOpen: boolean;
+ isProcessing: boolean;
+ progressMessage: string | null;
+ stitchingSourcePaths: Array<string>;
+}
+
+export interface DenoiseModalState {
+ isOpen: boolean;
+ isProcessing: boolean;
+ previewBase64: string | null;
+ originalBase64?: string | null;
+ error: string | null;
+ targetPaths: string[];
+ progressMessage: string | null;
+ isRaw: boolean;
+}
+
+export interface NegativeConversionModalState {
+ isOpen: boolean;
+ targetPaths: Array<string>;
+}
+
+export interface CullingModalState {
+ isOpen: boolean;
+ suggestions: CullingSuggestions | null;
+ progress: { current: number; total: number; stage: string } | null;
+ error: string | null;
+ pathsToCull: Array<string>;
+}
+
+interface UIState {
+ // View & Layout
+ activeView: string;
+ isFullScreen: boolean;
+ isWindowFullScreen: boolean;
+ isInstantTransition: boolean;
+ isLayoutReady: boolean;
+ uiVisibility: UiVisibility;
+ isLibraryExportPanelVisible: boolean;
+
+ // Dimensions
+ leftPanelWidth: number;
+ rightPanelWidth: number;
+ bottomPanelHeight: number;
+ compactEditorPanelHeightOverride: number | null;
+
+ // Right Panel
+ activeRightPanel: Panel | null;
+ renderedRightPanel: Panel | null;
+ slideDirection: number;
+ collapsibleSectionsState: CollapsibleSectionsState;
+
+ // Modals & Dialogs
+ isCreateFolderModalOpen: boolean;
+ isRenameFolderModalOpen: boolean;
+ isRenameFileModalOpen: boolean;
+ renameTargetPaths: Array<string>;
+ isImportModalOpen: boolean;
+ isCopyPasteSettingsModalOpen: boolean;
+ importTargetFolder: string | null;
+ importSourcePaths: Array<string>;
+ folderActionTarget: string | null;
+
+ // Album Modals
+ isCreateAlbumModalOpen: boolean;
+ isCreateAlbumGroupModalOpen: boolean;
+ isRenameAlbumModalOpen: boolean;
+ isSmartAlbumModalOpen: boolean;
+ albumActionTarget: string | null;
+
+ // Complex Modal States
+ confirmModalState: ConfirmModalState;
+ panoramaModalState: PanoramaModalState;
+ hdrModalState: HdrModalState;
+ negativeModalState: NegativeConversionModalState;
+ denoiseModalState: DenoiseModalState;
+ cullingModalState: CullingModalState;
+ collageModalState: CollageModalState;
+
+ // Actions
+ setUI: (updater: Partial<UIState> | ((state: UIState) => Partial<UIState>)) => void;
+ setRightPanel: (panel: Panel | null) => void;
+ customEscapeHandler: (() => void) | null;
+ setCustomEscapeHandler: (handler: (() => void) | null) => void;
+}
+
+export const useUIStore = create<UIState>((set, get) => ({
+ activeView: 'library',
+ isFullScreen: false,
+ isWindowFullScreen: false,
+ isInstantTransition: false,
+ isLayoutReady: false,
+ uiVisibility: { folderTree: true, filmstrip: true },
+ isLibraryExportPanelVisible: false,
+
+ leftPanelWidth: 256,
+ rightPanelWidth: 320,
+ bottomPanelHeight: 144,
+ compactEditorPanelHeightOverride: null,
+
+ activeRightPanel: Panel.Adjustments,
+ renderedRightPanel: Panel.Adjustments,
+ slideDirection: 1,
+ collapsibleSectionsState: { basic: true, color: false, curves: true, details: false, effects: false },
+
+ isCreateFolderModalOpen: false,
+ isRenameFolderModalOpen: false,
+ isRenameFileModalOpen: false,
+ renameTargetPaths: [],
+ isImportModalOpen: false,
+ isCopyPasteSettingsModalOpen: false,
+ importTargetFolder: null,
+ importSourcePaths: [],
+ folderActionTarget: null,
+
+ isCreateAlbumModalOpen: false,
+ isCreateAlbumGroupModalOpen: false,
+ isRenameAlbumModalOpen: false,
+ isSmartAlbumModalOpen: false,
+ albumActionTarget: null,
+
+ confirmModalState: { isOpen: false },
+ panoramaModalState: {
+ error: null,
+ finalImageBase64: null,
+ isOpen: false,
+ isProcessing: false,
+ progressMessage: '',
+ stitchingSourcePaths: [],
+ },
+ hdrModalState: {
+ error: null,
+ finalImageBase64: null,
+ isOpen: false,
+ isProcessing: false,
+ progressMessage: '',
+ stitchingSourcePaths: [],
+ },
+ negativeModalState: { isOpen: false, targetPaths: [] },
+ denoiseModalState: {
+ isOpen: false,
+ isProcessing: false,
+ previewBase64: null,
+ error: null,
+ targetPaths: [],
+ progressMessage: null,
+ isRaw: false,
+ },
+ cullingModalState: { isOpen: false, suggestions: null, progress: null, error: null, pathsToCull: [] },
+ collageModalState: { isOpen: false, sourceImages: [] },
+
+ setUI: (updater) => set((state) => (typeof updater === 'function' ? updater(state) : updater)),
+
+ setRightPanel: (panelId) => {
+ const current = get().activeRightPanel;
+ if (panelId === current) {
+ set({ activeRightPanel: null });
+ } else {
+ const currentIndex = current ? RIGHT_PANEL_ORDER.indexOf(current) : -1;
+ const newIndex = panelId ? RIGHT_PANEL_ORDER.indexOf(panelId) : -1;
+ set({
+ slideDirection: newIndex > currentIndex ? 1 : -1,
+ activeRightPanel: panelId,
+ renderedRightPanel: panelId,
+ });
+ }
+ },
+
+ customEscapeHandler: null,
+ setCustomEscapeHandler: (handler) => set({ customEscapeHandler: handler }),
+}));
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| typography.ts | +
+
+ |
+ 100% | +5/5 | +100% | +0/0 | +100% | +0/0 | +100% | +5/5 | +
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 | + + + +1x + + + + + +1x + + + + + + + + + + + +1x + + + + + +1x + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + | export type TextVariant = 'displayLarge' | 'display' | 'headline' | 'title' | 'heading' | 'body' | 'label' | 'small';
+export type TextWeight = 'bold' | 'semibold' | 'medium' | 'normal';
+export type TextColor = 'primary' | 'secondary' | 'accent' | 'button' | 'info' | 'success' | 'error' | 'white';
+
+export const TextWeights: Record<TextWeight, TextWeight> = {
+ bold: 'bold',
+ semibold: 'semibold',
+ medium: 'medium',
+ normal: 'normal',
+};
+export const TextColors: Record<TextColor, TextColor> = {
+ primary: 'primary',
+ secondary: 'secondary',
+ accent: 'accent',
+ button: 'button',
+ info: 'info',
+ success: 'success',
+ error: 'error',
+ white: 'white',
+};
+
+// Map keys to classes
+export const TEXT_WEIGHT_KEYS: Record<TextWeight, string> = {
+ bold: 'font-bold',
+ semibold: 'font-semibold',
+ medium: 'font-medium',
+ normal: 'font-normal',
+};
+export const TEXT_COLOR_KEYS: Record<TextColor, string> = {
+ primary: 'text-text-primary',
+ secondary: 'text-text-secondary',
+ accent: 'text-accent',
+ button: 'text-button-text',
+ info: 'text-blue-400',
+ success: 'text-green-400',
+ error: 'text-red-400',
+ white: 'text-white',
+};
+
+export interface VariantConfig {
+ size: string;
+ defaultWeight: TextWeight;
+ defaultColor: TextColor;
+ defaultElement: React.ElementType;
+ extraClasses?: string;
+}
+
+export const TextVariants: Record<TextVariant, VariantConfig> = {
+ displayLarge: {
+ size: 'text-5xl',
+ defaultWeight: 'bold',
+ defaultColor: 'primary',
+ defaultElement: 'h1',
+ extraClasses: 'text-shadow-shiny mb-4',
+ },
+ display: {
+ size: 'text-3xl',
+ defaultWeight: 'bold',
+ defaultColor: 'primary',
+ defaultElement: 'h1',
+ extraClasses: 'text-shadow-shiny',
+ },
+ headline: {
+ size: 'text-2xl',
+ defaultWeight: 'bold',
+ defaultColor: 'primary',
+ defaultElement: 'h1',
+ extraClasses: 'text-shadow-shiny',
+ },
+ title: {
+ size: 'text-xl',
+ defaultWeight: 'bold',
+ defaultColor: 'primary',
+ defaultElement: 'h2',
+ extraClasses: 'text-shadow-shiny',
+ },
+ heading: {
+ size: 'text-base',
+ defaultWeight: 'semibold',
+ defaultColor: 'primary',
+ defaultElement: 'h3',
+ },
+ body: {
+ size: 'text-sm',
+ defaultWeight: 'normal',
+ defaultColor: 'secondary',
+ defaultElement: 'p',
+ },
+ label: {
+ size: 'text-sm',
+ defaultWeight: 'medium',
+ defaultColor: 'secondary',
+ defaultElement: 'span',
+ },
+ small: {
+ size: 'text-xs',
+ defaultWeight: 'normal',
+ defaultColor: 'secondary',
+ defaultElement: 'p',
+ },
+};
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| 1 +2 +3 +4 +5 +6 +7 +8 +9 +10 +11 +12 +13 +14 +15 +16 +17 +18 +19 +20 +21 +22 +23 +24 +25 +26 +27 +28 +29 +30 +31 +32 +33 +34 +35 +36 +37 +38 +39 +40 +41 +42 +43 +44 +45 +46 +47 +48 +49 +50 +51 +52 +53 +54 +55 +56 +57 +58 +59 +60 +61 +62 +63 +64 +65 +66 +67 +68 +69 +70 +71 +72 +73 +74 +75 +76 +77 +78 +79 +80 +81 +82 +83 +84 +85 +86 +87 +88 +89 +90 +91 +92 +93 +94 +95 +96 +97 +98 +99 +100 +101 +102 +103 +104 +105 +106 +107 +108 +109 +110 +111 +112 +113 +114 +115 +116 +117 +118 +119 +120 +121 +122 +123 +124 +125 +126 +127 +128 +129 +130 +131 +132 +133 +134 +135 +136 +137 +138 +139 +140 +141 +142 +143 +144 +145 +146 +147 +148 +149 +150 +151 +152 +153 +154 +155 +156 +157 +158 +159 +160 +161 +162 +163 +164 +165 +166 +167 +168 +169 +170 +171 +172 +173 +174 +175 +176 +177 +178 +179 +180 +181 +182 +183 +184 +185 +186 +187 +188 +189 +190 +191 +192 +193 +194 +195 +196 +197 +198 +199 +200 +201 +202 +203 +204 +205 +206 +207 +208 +209 +210 +211 +212 +213 +214 +215 +216 +217 +218 +219 +220 +221 +222 +223 +224 +225 +226 +227 +228 +229 +230 +231 +232 +233 +234 +235 +236 +237 +238 +239 +240 +241 +242 +243 +244 +245 +246 +247 +248 +249 +250 +251 +252 +253 +254 +255 +256 +257 +258 +259 +260 +261 +262 +263 +264 +265 +266 +267 +268 +269 +270 +271 +272 +273 +274 +275 +276 +277 +278 +279 +280 +281 +282 +283 +284 +285 +286 +287 +288 +289 +290 +291 +292 +293 +294 +295 +296 +297 +298 +299 +300 +301 +302 +303 +304 +305 +306 +307 +308 +309 +310 +311 +312 +313 +314 +315 +316 +317 +318 +319 +320 +321 +322 +323 +324 +325 +326 +327 +328 +329 +330 +331 +332 +333 +334 +335 +336 +337 +338 +339 +340 +341 +342 +343 +344 +345 +346 +347 +348 +349 +350 +351 +352 +353 +354 +355 +356 +357 +358 +359 +360 +361 +362 +363 +364 +365 +366 +367 +368 +369 +370 +371 +372 +373 +374 +375 +376 +377 +378 +379 +380 +381 +382 +383 +384 +385 +386 +387 +388 +389 +390 +391 +392 +393 +394 +395 +396 +397 +398 +399 +400 +401 +402 +403 +404 +405 +406 +407 +408 +409 +410 +411 +412 +413 +414 +415 +416 +417 +418 +419 +420 +421 +422 +423 +424 +425 +426 +427 +428 +429 +430 +431 +432 +433 +434 +435 +436 +437 +438 +439 +440 +441 +442 +443 +444 +445 +446 +447 +448 +449 +450 +451 +452 +453 +454 +455 +456 +457 +458 +459 +460 +461 +462 +463 +464 +465 +466 +467 +468 +469 +470 +471 +472 +473 +474 +475 +476 +477 +478 +479 +480 +481 +482 +483 +484 +485 +486 +487 +488 +489 +490 +491 +492 +493 +494 +495 +496 +497 +498 +499 +500 +501 +502 +503 +504 +505 +506 +507 +508 +509 +510 +511 +512 +513 +514 +515 +516 +517 +518 +519 +520 +521 +522 +523 +524 +525 +526 +527 +528 +529 +530 +531 +532 +533 +534 +535 +536 +537 +538 +539 +540 +541 +542 +543 +544 +545 +546 +547 +548 +549 +550 +551 +552 +553 +554 +555 +556 +557 +558 +559 +560 +561 +562 +563 +564 +565 +566 +567 +568 +569 +570 +571 +572 +573 +574 +575 +576 +577 +578 +579 +580 +581 +582 +583 +584 +585 +586 +587 +588 +589 +590 +591 +592 +593 +594 +595 +596 +597 +598 +599 +600 +601 +602 +603 +604 +605 +606 +607 +608 +609 +610 +611 +612 +613 +614 +615 +616 +617 +618 +619 +620 +621 +622 +623 +624 +625 +626 +627 +628 +629 +630 +631 +632 +633 +634 +635 +636 +637 +638 +639 +640 +641 +642 +643 +644 +645 +646 +647 +648 +649 +650 +651 +652 +653 +654 +655 +656 +657 +658 +659 +660 +661 +662 +663 +664 +665 +666 +667 +668 +669 +670 +671 +672 +673 +674 +675 +676 +677 +678 +679 +680 +681 +682 +683 +684 +685 +686 +687 +688 +689 +690 +691 +692 +693 +694 +695 +696 +697 +698 +699 +700 +701 +702 +703 +704 +705 +706 +707 +708 +709 +710 +711 +712 +713 +714 +715 +716 +717 +718 +719 +720 +721 +722 +723 +724 +725 +726 +727 +728 +729 +730 +731 +732 +733 +734 +735 +736 +737 +738 +739 +740 +741 +742 +743 +744 +745 +746 +747 +748 +749 +750 +751 +752 +753 +754 +755 +756 +757 +758 +759 +760 +761 +762 +763 +764 +765 +766 +767 +768 +769 +770 +771 +772 +773 +774 +775 +776 +777 +778 +779 +780 +781 +782 +783 +784 +785 +786 +787 +788 +789 +790 +791 +792 +793 +794 +795 +796 +797 +798 +799 +800 +801 +802 +803 +804 +805 +806 +807 +808 +809 +810 +811 +812 +813 +814 +815 +816 +817 +818 +819 +820 +821 +822 +823 +824 +825 +826 +827 +828 +829 +830 +831 +832 +833 +834 +835 +836 +837 +838 +839 +840 +841 +842 +843 +844 +845 +846 +847 +848 +849 +850 +851 +852 +853 +854 +855 +856 +857 +858 +859 +860 +861 +862 +863 +864 +865 +866 +867 +868 +869 +870 +871 +872 +873 +874 +875 +876 +877 +878 +879 +880 +881 +882 +883 +884 +885 +886 +887 +888 +889 +890 +891 +892 +893 +894 +895 +896 +897 +898 +899 +900 +901 +902 +903 +904 +905 +906 +907 +908 +909 +910 +911 +912 +913 +914 +915 +916 +917 +918 +919 | + + + +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x + + +1x +1x +1x + + + + + + + + +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x +1x +1x + + +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + +1x + + + + + + + + +1x + + + + + + + + + +1x + + + + + + + + + + + +3x + + + + + + +4x + + + + + + + + + + + + + + + + + + +1x + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +2x +4x + + + +4x + + + +4x + + + +4x + + + + + +1x + + + + + + +1x +2x +1x + + +1x + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +2x + + + + + +2x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +1x + +21x + +1x + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + | import { Crop } from 'react-image-crop';
+import { v4 as uuidv4 } from 'uuid';
+import { SubMask, SubMaskMode } from '../components/panel/right/Masks';
+
+export enum ActiveChannel {
+ Blue = 'blue',
+ Green = 'green',
+ Luma = 'luma',
+ Red = 'red',
+}
+
+export enum DisplayMode {
+ Luma = 'luma',
+ Rgb = 'rgb',
+ Parade = 'parade',
+ Vectorscope = 'vectorscope',
+ Histogram = 'histogram',
+}
+
+export enum PasteMode {
+ Merge = 'merge',
+ Replace = 'replace',
+}
+
+export interface CopyPasteSettings {
+ mode: PasteMode;
+ includedAdjustments: Array<string>;
+ knownAdjustments: Array<string>;
+}
+
+export enum BasicAdjustment {
+ Blacks = 'blacks',
+ Brightness = 'brightness',
+ Contrast = 'contrast',
+ Exposure = 'exposure',
+ Highlights = 'highlights',
+ Shadows = 'shadows',
+ Whites = 'whites',
+}
+
+export enum ColorAdjustment {
+ ColorGrading = 'colorGrading',
+ Hsl = 'hsl',
+ Hue = 'hue',
+ Luminance = 'luminance',
+ Saturation = 'saturation',
+ Temperature = 'temperature',
+ Tint = 'tint',
+ Vibrance = 'vibrance',
+}
+
+export enum ColorGrading {
+ Balance = 'balance',
+ Blending = 'blending',
+ Global = 'global',
+ Highlights = 'highlights',
+ Midtones = 'midtones',
+ Shadows = 'shadows',
+}
+
+export enum DetailsAdjustment {
+ Clarity = 'clarity',
+ Dehaze = 'dehaze',
+ Structure = 'structure',
+ Centré = 'centré',
+ ColorNoiseReduction = 'colorNoiseReduction',
+ LumaNoiseReduction = 'lumaNoiseReduction',
+ Sharpness = 'sharpness',
+ SharpnessThreshold = 'sharpnessThreshold',
+ ChromaticAberrationRedCyan = 'chromaticAberrationRedCyan',
+ ChromaticAberrationBlueYellow = 'chromaticAberrationBlueYellow',
+}
+
+export enum Effect {
+ GrainAmount = 'grainAmount',
+ GrainRoughness = 'grainRoughness',
+ GrainSize = 'grainSize',
+ LutData = 'lutData',
+ LutIntensity = 'lutIntensity',
+ LutName = 'lutName',
+ LutPath = 'lutPath',
+ LutSize = 'lutSize',
+ VignetteAmount = 'vignetteAmount',
+ VignetteFeather = 'vignetteFeather',
+ VignetteMidpoint = 'vignetteMidpoint',
+ VignetteRoundness = 'vignetteRoundness',
+}
+
+export enum CreativeAdjustment {
+ GlowAmount = 'glowAmount',
+ HalationAmount = 'halationAmount',
+ FlareAmount = 'flareAmount',
+}
+
+export enum TransformAdjustment {
+ TransformDistortion = 'transformDistortion',
+ TransformVertical = 'transformVertical',
+ TransformHorizontal = 'transformHorizontal',
+ TransformRotate = 'transformRotate',
+ TransformAspect = 'transformAspect',
+ TransformScale = 'transformScale',
+ TransformXOffset = 'transformXOffset',
+ TransformYOffset = 'transformYOffset',
+}
+
+export enum LensAdjustment {
+ LensCorrectionMode = 'lensCorrectionMode',
+ LensMaker = 'lensMaker',
+ LensModel = 'lensModel',
+ LensDistortionAmount = 'lensDistortionAmount',
+ LensVignetteAmount = 'lensVignetteAmount',
+ LensTcaAmount = 'lensTcaAmount',
+ LensDistortionParams = 'lensDistortionParams',
+ LensDistortionEnabled = 'lensDistortionEnabled',
+ LensTcaEnabled = 'lensTcaEnabled',
+ LensVignetteEnabled = 'lensVignetteEnabled',
+}
+
+export interface ColorCalibration {
+ shadowsTint: number;
+ redHue: number;
+ redSaturation: number;
+ greenHue: number;
+ greenSaturation: number;
+ blueHue: number;
+ blueSaturation: number;
+}
+
+export interface ParametricCurveSettings {
+ darks: number;
+ shadows: number;
+ highlights: number;
+ lights: number;
+ whiteLevel: number;
+ blackLevel: number;
+ split1: number;
+ split2: number;
+ split3: number;
+}
+
+export interface ParametricCurve {
+ [index: string]: ParametricCurveSettings;
+ blue: ParametricCurveSettings;
+ green: ParametricCurveSettings;
+ luma: ParametricCurveSettings;
+ red: ParametricCurveSettings;
+}
+
+export interface PortraitAdjustments {
+ skinSmoothingStrength: number;
+ skinSmoothingDetailPreserve: number;
+ faceSlimAmount: number;
+ jawAmount: number;
+ foreheadAmount: number;
+ eyeEnlargeAmount: number;
+ eyeBrightenAmount: number;
+ teethWhitenBrightness: number;
+ teethWhitenDesaturate: number;
+ lipstickColor: string;
+ lipstickOpacity: number;
+ blushColor: string;
+ blushOpacity: number;
+ eyebrowColor: string;
+ eyebrowOpacity: number;
+ hairHueShift: number;
+ hairBrightness: number;
+ bodySlimAmount: number;
+ bodyHeightAmount: number;
+ legLengthAmount: number;
+ blemishSpots: Array<{ x: number; y: number; radius: number }>;
+}
+
+export const INITIAL_PORTRAIT_ADJUSTMENTS: PortraitAdjustments = {
+ skinSmoothingStrength: 0,
+ skinSmoothingDetailPreserve: 0,
+ faceSlimAmount: 0,
+ jawAmount: 0,
+ foreheadAmount: 0,
+ eyeEnlargeAmount: 0,
+ eyeBrightenAmount: 0,
+ teethWhitenBrightness: 0,
+ teethWhitenDesaturate: 0,
+ lipstickColor: '#cc2244',
+ lipstickOpacity: 0,
+ blushColor: '#dd6688',
+ blushOpacity: 0,
+ eyebrowColor: '#443322',
+ eyebrowOpacity: 0,
+ hairHueShift: 0,
+ hairBrightness: 0,
+ bodySlimAmount: 0,
+ bodyHeightAmount: 0,
+ legLengthAmount: 0,
+ blemishSpots: [],
+};
+
+export interface Adjustments {
+ [index: string]: any;
+ aiPatches: Array<AiPatch>;
+ aspectRatio: number | null;
+ blacks: number;
+ brightness: number;
+ centré: number;
+ clarity: number;
+ chromaticAberrationBlueYellow: number;
+ chromaticAberrationRedCyan: number;
+ colorCalibration: ColorCalibration;
+ colorGrading: ColorGradingProps;
+ colorNoiseReduction: number;
+ contrast: number;
+ curves: Curves;
+ pointCurves?: Curves;
+ parametricCurve?: ParametricCurve;
+ curveMode?: 'point' | 'parametric';
+ crop: Crop | null;
+ dehaze: number;
+ exposure: number;
+ flipHorizontal: boolean;
+ flipVertical: boolean;
+ flareAmount: number;
+ glowAmount: number;
+ grainAmount: number;
+ grainRoughness: number;
+ grainSize: number;
+ halationAmount: number;
+ highlights: number;
+ hsl: Hsl;
+ hue: number;
+ lensCorrectionMode: 'auto' | 'manual';
+ lensDistortionAmount: number;
+ lensVignetteAmount: number;
+ lensTcaAmount: number;
+ lensDistortionEnabled: boolean;
+ lensTcaEnabled: boolean;
+ lensVignetteEnabled: boolean;
+ lensDistortionParams: {
+ k1: number;
+ k2: number;
+ k3: number;
+ model: number;
+ tca_vr: number;
+ tca_vb: number;
+ vig_k1: number;
+ vig_k2: number;
+ vig_k3: number;
+ } | null;
+ lensMaker: string | null;
+ lensModel: string | null;
+ lumaNoiseReduction: number;
+ lutData?: string | null;
+ lutIntensity?: number;
+ lutName?: string | null;
+ lutPath?: string | null;
+ lutSize?: number;
+ masks: Array<MaskContainer>;
+ orientationSteps: number;
+ portrait: PortraitAdjustments;
+ rotation: number;
+ saturation: number;
+ sectionVisibility: SectionVisibility;
+ shadows: number;
+ sharpness: number;
+ sharpnessThreshold: number;
+ showClipping: boolean;
+ structure: number;
+ temperature: number;
+ tint: number;
+ toneMapper: 'agx' | 'basic';
+ transformDistortion: number;
+ transformVertical: number;
+ transformHorizontal: number;
+ transformRotate: number;
+ transformAspect: number;
+ transformScale: number;
+ transformXOffset: number;
+ transformYOffset: number;
+ vibrance: number;
+ vignetteAmount: number;
+ vignetteFeather: number;
+ vignetteMidpoint: number;
+ vignetteRoundness: number;
+ whites: number;
+}
+
+export interface AiPatch {
+ id: string;
+ isLoading: boolean;
+ invert: boolean;
+ name: string;
+ patchData: any | null;
+ prompt: string;
+ subMasks: Array<SubMask>;
+ visible: boolean;
+}
+
+export interface Color {
+ color: string;
+ name: string;
+}
+
+interface ColorGradingProps {
+ [index: string]: number | HueSatLum;
+ balance: number;
+ blending: number;
+ global: HueSatLum;
+ highlights: HueSatLum;
+ midtones: HueSatLum;
+ shadows: HueSatLum;
+}
+
+export interface Coord {
+ x: number;
+ y: number;
+}
+
+export interface Curves {
+ [index: string]: Array<Coord>;
+ blue: Array<Coord>;
+ green: Array<Coord>;
+ luma: Array<Coord>;
+ red: Array<Coord>;
+}
+
+export interface HueSatLum {
+ hue: number;
+ saturation: number;
+ luminance: number;
+}
+
+interface Hsl {
+ [index: string]: HueSatLum;
+ aquas: HueSatLum;
+ blues: HueSatLum;
+ greens: HueSatLum;
+ magentas: HueSatLum;
+ oranges: HueSatLum;
+ purples: HueSatLum;
+ reds: HueSatLum;
+ yellows: HueSatLum;
+}
+
+export interface MaskAdjustments {
+ [index: string]: any;
+ blacks: number;
+ brightness: number;
+ clarity: number;
+ colorGrading: ColorGradingProps;
+ colorNoiseReduction: number;
+ contrast: number;
+ curves: Curves;
+ pointCurves?: Curves;
+ parametricCurve?: ParametricCurve;
+ curveMode?: 'point' | 'parametric';
+ dehaze: number;
+ exposure: number;
+ flareAmount: number;
+ glowAmount: number;
+ halationAmount: number;
+ highlights: number;
+ hsl: Hsl;
+ hue: number;
+ id?: string;
+ lumaNoiseReduction: number;
+ saturation: number;
+ sectionVisibility: SectionVisibility;
+ shadows: number;
+ sharpness: number;
+ sharpnessThreshold: number;
+ structure: number;
+ temperature: number;
+ tint: number;
+ vibrance: number;
+ whites: number;
+}
+
+export interface MaskContainer {
+ adjustments: MaskAdjustments;
+ id?: any;
+ invert: boolean;
+ name: string;
+ opacity: number;
+ subMasks: Array<SubMask>;
+ visible: boolean;
+}
+
+export interface Sections {
+ [index: string]: Array<string>;
+ basic: Array<string>;
+ curves: Array<string>;
+ color: Array<string>;
+ details: Array<string>;
+ effects: Array<string>;
+}
+
+export interface SectionVisibility {
+ [index: string]: boolean;
+ basic: boolean;
+ curves: boolean;
+ color: boolean;
+ details: boolean;
+ effects: boolean;
+}
+
+export const COLOR_LABELS: Array<Color> = [
+ { name: 'red', color: '#ef4444' },
+ { name: 'yellow', color: '#facc15' },
+ { name: 'green', color: '#4ade80' },
+ { name: 'blue', color: '#60a5fa' },
+ { name: 'purple', color: '#a78bfa' },
+];
+
+const INITIAL_COLOR_GRADING: ColorGradingProps = {
+ balance: 0,
+ blending: 50,
+ global: { hue: 0, saturation: 0, luminance: 0 },
+ highlights: { hue: 0, saturation: 0, luminance: 0 },
+ midtones: { hue: 0, saturation: 0, luminance: 0 },
+ shadows: { hue: 0, saturation: 0, luminance: 0 },
+};
+
+const INITIAL_COLOR_CALIBRATION: ColorCalibration = {
+ shadowsTint: 0,
+ redHue: 0,
+ redSaturation: 0,
+ greenHue: 0,
+ greenSaturation: 0,
+ blueHue: 0,
+ blueSaturation: 0,
+};
+
+export const DEFAULT_PARAMETRIC_CURVE_SETTINGS: ParametricCurveSettings = {
+ darks: 0,
+ shadows: 0,
+ highlights: 0,
+ lights: 0,
+ whiteLevel: 0,
+ blackLevel: 0,
+ split1: 25,
+ split2: 50,
+ split3: 75,
+};
+
+export const getDefaultParametricCurve = (): ParametricCurve => ({
+ luma: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS },
+ red: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS },
+ green: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS },
+ blue: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS },
+});
+
+export const getDefaultCurves = (): Curves => ({
+ blue: [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+ green: [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+ luma: [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+ red: [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+});
+
+export const DEFAULT_PARAMETRIC_CURVE = getDefaultParametricCurve();
+
+export const INITIAL_MASK_ADJUSTMENTS: MaskAdjustments = {
+ blacks: 0,
+ brightness: 0,
+ clarity: 0,
+ colorGrading: { ...INITIAL_COLOR_GRADING },
+ colorNoiseReduction: 0,
+ contrast: 0,
+ curves: getDefaultCurves(),
+ pointCurves: getDefaultCurves(),
+ parametricCurve: getDefaultParametricCurve(),
+ curveMode: 'point',
+ dehaze: 0,
+ exposure: 0,
+ flareAmount: 0,
+ glowAmount: 0,
+ halationAmount: 0,
+ highlights: 0,
+ hsl: {
+ aquas: { hue: 0, saturation: 0, luminance: 0 },
+ blues: { hue: 0, saturation: 0, luminance: 0 },
+ greens: { hue: 0, saturation: 0, luminance: 0 },
+ magentas: { hue: 0, saturation: 0, luminance: 0 },
+ oranges: { hue: 0, saturation: 0, luminance: 0 },
+ purples: { hue: 0, saturation: 0, luminance: 0 },
+ reds: { hue: 0, saturation: 0, luminance: 0 },
+ yellows: { hue: 0, saturation: 0, luminance: 0 },
+ },
+ hue: 0,
+ lumaNoiseReduction: 0,
+ saturation: 0,
+ sectionVisibility: {
+ basic: true,
+ curves: true,
+ color: true,
+ details: true,
+ effects: true,
+ },
+ shadows: 0,
+ sharpness: 0,
+ sharpnessThreshold: 15,
+ structure: 0,
+ temperature: 0,
+ tint: 0,
+ vibrance: 0,
+ whites: 0,
+};
+
+export const INITIAL_MASK_CONTAINER: MaskContainer = {
+ adjustments: INITIAL_MASK_ADJUSTMENTS,
+ invert: false,
+ name: 'New Mask',
+ opacity: 100,
+ subMasks: [],
+ visible: true,
+};
+
+export const INITIAL_ADJUSTMENTS: Adjustments = {
+ aiPatches: [],
+ aspectRatio: null,
+ blacks: 0,
+ brightness: 0,
+ centré: 0,
+ clarity: 0,
+ chromaticAberrationBlueYellow: 0,
+ chromaticAberrationRedCyan: 0,
+ colorCalibration: { ...INITIAL_COLOR_CALIBRATION },
+ colorGrading: { ...INITIAL_COLOR_GRADING },
+ colorNoiseReduction: 0,
+ contrast: 0,
+ crop: null,
+ curves: getDefaultCurves(),
+ pointCurves: getDefaultCurves(),
+ parametricCurve: getDefaultParametricCurve(),
+ curveMode: 'point',
+ dehaze: 0,
+ exposure: 0,
+ flipHorizontal: false,
+ flipVertical: false,
+ flareAmount: 0,
+ glowAmount: 0,
+ grainAmount: 0,
+ grainRoughness: 50,
+ grainSize: 25,
+ halationAmount: 0,
+ highlights: 0,
+ hsl: {
+ aquas: { hue: 0, saturation: 0, luminance: 0 },
+ blues: { hue: 0, saturation: 0, luminance: 0 },
+ greens: { hue: 0, saturation: 0, luminance: 0 },
+ magentas: { hue: 0, saturation: 0, luminance: 0 },
+ oranges: { hue: 0, saturation: 0, luminance: 0 },
+ purples: { hue: 0, saturation: 0, luminance: 0 },
+ reds: { hue: 0, saturation: 0, luminance: 0 },
+ yellows: { hue: 0, saturation: 0, luminance: 0 },
+ },
+ hue: 0,
+ lensCorrectionMode: 'manual',
+ lensDistortionAmount: 100,
+ lensVignetteAmount: 100,
+ lensTcaAmount: 100,
+ lensDistortionEnabled: true,
+ lensTcaEnabled: true,
+ lensVignetteEnabled: true,
+ lensDistortionParams: null,
+ lensMaker: null,
+ lensModel: null,
+ lumaNoiseReduction: 0,
+ lutData: null,
+ lutIntensity: 100,
+ lutName: null,
+ lutPath: null,
+ lutSize: 0,
+ masks: [],
+ orientationSteps: 0,
+ portrait: { ...INITIAL_PORTRAIT_ADJUSTMENTS },
+ rotation: 0,
+ saturation: 0,
+ sectionVisibility: {
+ basic: true,
+ curves: true,
+ color: true,
+ details: true,
+ effects: true,
+ },
+ shadows: 0,
+ sharpness: 0,
+ sharpnessThreshold: 15,
+ showClipping: false,
+ structure: 0,
+ temperature: 0,
+ tint: 0,
+ toneMapper: 'basic',
+ transformDistortion: 0,
+ transformVertical: 0,
+ transformHorizontal: 0,
+ transformRotate: 0,
+ transformAspect: 0,
+ transformScale: 100,
+ transformXOffset: 0,
+ transformYOffset: 0,
+ vibrance: 0,
+ vignetteAmount: 0,
+ vignetteFeather: 50,
+ vignetteMidpoint: 50,
+ vignetteRoundness: 0,
+ whites: 0,
+};
+
+const deepCloneCurves = (curves: any): Curves => ({
+ blue: curves?.blue?.map((p: Coord) => ({ ...p })) || [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+ green: curves?.green?.map((p: Coord) => ({ ...p })) || [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+ luma: curves?.luma?.map((p: Coord) => ({ ...p })) || [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+ red: curves?.red?.map((p: Coord) => ({ ...p })) || [
+ { x: 0, y: 0 },
+ { x: 255, y: 255 },
+ ],
+});
+
+const deepCloneParametric = (pCurve: any): ParametricCurve => ({
+ luma: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS, ...(pCurve?.luma || {}) },
+ red: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS, ...(pCurve?.red || {}) },
+ green: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS, ...(pCurve?.green || {}) },
+ blue: { ...DEFAULT_PARAMETRIC_CURVE_SETTINGS, ...(pCurve?.blue || {}) },
+});
+
+export const normalizeLoadedAdjustments = (loadedAdjustments: Adjustments): any => {
+ if (!loadedAdjustments) {
+ return INITIAL_ADJUSTMENTS;
+ }
+
+ const normalizeSubMasks = (subMasks: any[]) => {
+ return (subMasks || []).map((subMask: Partial<SubMask>) => ({
+ visible: true,
+ mode: SubMaskMode.Additive,
+ invert: false,
+ opacity: 100,
+ ...subMask,
+ }));
+ };
+
+ const normalizedMasks = (loadedAdjustments.masks || []).map((maskContainer: MaskContainer) => {
+ const containerAdjustments = maskContainer.adjustments || {};
+ const normalizedSubMasks = normalizeSubMasks(maskContainer.subMasks);
+
+ return {
+ ...INITIAL_MASK_CONTAINER,
+ id: maskContainer.id || uuidv4(),
+ ...maskContainer,
+ adjustments: {
+ ...INITIAL_MASK_ADJUSTMENTS,
+ ...containerAdjustments,
+ flareAmount: containerAdjustments.flareAmount ?? INITIAL_MASK_ADJUSTMENTS.flareAmount,
+ glowAmount: containerAdjustments.glowAmount ?? INITIAL_MASK_ADJUSTMENTS.glowAmount,
+ halationAmount: containerAdjustments.halationAmount ?? INITIAL_MASK_ADJUSTMENTS.halationAmount,
+ hue: containerAdjustments.hue ?? INITIAL_MASK_ADJUSTMENTS.hue,
+ colorGrading: { ...INITIAL_MASK_ADJUSTMENTS.colorGrading, ...(containerAdjustments.colorGrading || {}) },
+ hsl: { ...INITIAL_MASK_ADJUSTMENTS.hsl, ...(containerAdjustments.hsl || {}) },
+ curves: containerAdjustments.curves ? deepCloneCurves(containerAdjustments.curves) : getDefaultCurves(),
+ pointCurves: containerAdjustments.pointCurves
+ ? deepCloneCurves(containerAdjustments.pointCurves)
+ : getDefaultCurves(),
+ parametricCurve: containerAdjustments.parametricCurve
+ ? deepCloneParametric(containerAdjustments.parametricCurve)
+ : getDefaultParametricCurve(),
+ curveMode: containerAdjustments.curveMode || INITIAL_MASK_ADJUSTMENTS.curveMode,
+ sectionVisibility: {
+ ...INITIAL_MASK_ADJUSTMENTS.sectionVisibility,
+ ...(containerAdjustments.sectionVisibility || {}),
+ },
+ sharpnessThreshold: containerAdjustments.sharpnessThreshold ?? INITIAL_MASK_ADJUSTMENTS.sharpnessThreshold,
+ },
+ subMasks: normalizedSubMasks,
+ };
+ });
+
+ const normalizedAiPatches = (loadedAdjustments.aiPatches || []).map((patch: any) => ({
+ visible: true,
+ ...patch,
+ subMasks: normalizeSubMasks(patch.subMasks),
+ }));
+
+ return {
+ ...INITIAL_ADJUSTMENTS,
+ ...loadedAdjustments,
+ flareAmount: loadedAdjustments.flareAmount ?? INITIAL_ADJUSTMENTS.flareAmount,
+ glowAmount: loadedAdjustments.glowAmount ?? INITIAL_ADJUSTMENTS.glowAmount,
+ halationAmount: loadedAdjustments.halationAmount ?? INITIAL_ADJUSTMENTS.halationAmount,
+ lensCorrectionMode: loadedAdjustments.lensCorrectionMode || 'manual',
+ lensMaker: loadedAdjustments.lensMaker ?? INITIAL_ADJUSTMENTS.lensMaker,
+ lensModel: loadedAdjustments.lensModel ?? INITIAL_ADJUSTMENTS.lensModel,
+ lensDistortionAmount: loadedAdjustments.lensDistortionAmount ?? INITIAL_ADJUSTMENTS.lensDistortionAmount,
+ lensVignetteAmount: loadedAdjustments.lensVignetteAmount ?? INITIAL_ADJUSTMENTS.lensVignetteAmount,
+ lensTcaAmount: loadedAdjustments.lensTcaAmount ?? INITIAL_ADJUSTMENTS.lensTcaAmount,
+ lensDistortionEnabled: loadedAdjustments.lensDistortionEnabled ?? INITIAL_ADJUSTMENTS.lensDistortionEnabled,
+ lensTcaEnabled: loadedAdjustments.lensTcaEnabled ?? INITIAL_ADJUSTMENTS.lensTcaEnabled,
+ lensVignetteEnabled: loadedAdjustments.lensVignetteEnabled ?? INITIAL_ADJUSTMENTS.lensVignetteEnabled,
+ lensDistortionParams: loadedAdjustments.lensDistortionParams
+ ? { ...INITIAL_ADJUSTMENTS.lensDistortionParams, ...loadedAdjustments.lensDistortionParams }
+ : INITIAL_ADJUSTMENTS.lensDistortionParams,
+ transformDistortion: loadedAdjustments.transformDistortion ?? INITIAL_ADJUSTMENTS.transformDistortion,
+ transformVertical: loadedAdjustments.transformVertical ?? INITIAL_ADJUSTMENTS.transformVertical,
+ transformHorizontal: loadedAdjustments.transformHorizontal ?? INITIAL_ADJUSTMENTS.transformHorizontal,
+ transformRotate: loadedAdjustments.transformRotate ?? INITIAL_ADJUSTMENTS.transformRotate,
+ transformAspect: loadedAdjustments.transformAspect ?? INITIAL_ADJUSTMENTS.transformAspect,
+ transformScale: loadedAdjustments.transformScale ?? INITIAL_ADJUSTMENTS.transformScale,
+ transformXOffset: loadedAdjustments.transformXOffset ?? INITIAL_ADJUSTMENTS.transformXOffset,
+ transformYOffset: loadedAdjustments.transformYOffset ?? INITIAL_ADJUSTMENTS.transformYOffset,
+ colorCalibration: { ...INITIAL_ADJUSTMENTS.colorCalibration, ...(loadedAdjustments.colorCalibration || {}) },
+ colorGrading: { ...INITIAL_ADJUSTMENTS.colorGrading, ...(loadedAdjustments.colorGrading || {}) },
+ hsl: { ...INITIAL_ADJUSTMENTS.hsl, ...(loadedAdjustments.hsl || {}) },
+ curves: loadedAdjustments.curves ? deepCloneCurves(loadedAdjustments.curves) : getDefaultCurves(),
+ pointCurves: loadedAdjustments.pointCurves ? deepCloneCurves(loadedAdjustments.pointCurves) : getDefaultCurves(),
+ parametricCurve: loadedAdjustments.parametricCurve
+ ? deepCloneParametric(loadedAdjustments.parametricCurve)
+ : getDefaultParametricCurve(),
+ curveMode: loadedAdjustments.curveMode || INITIAL_ADJUSTMENTS.curveMode,
+ masks: normalizedMasks,
+ aiPatches: normalizedAiPatches,
+ portrait: {
+ ...INITIAL_PORTRAIT_ADJUSTMENTS,
+ ...(loadedAdjustments.portrait || {}),
+ blemishSpots: loadedAdjustments.portrait?.blemishSpots || [],
+ },
+ sectionVisibility: {
+ ...INITIAL_ADJUSTMENTS.sectionVisibility,
+ ...(loadedAdjustments.sectionVisibility || {}),
+ },
+ sharpnessThreshold: loadedAdjustments.sharpnessThreshold ?? INITIAL_ADJUSTMENTS.sharpnessThreshold,
+ };
+};
+
+export interface AdjustmentGroup {
+ label: string;
+ keys: string[];
+}
+
+export const ADJUSTMENT_GROUPS: Record<string, AdjustmentGroup[]> = {
+ basic: [
+ {
+ label: 'modals.copyPaste.groups.exposureToneMapper',
+ keys: [BasicAdjustment.Exposure, 'toneMapper'],
+ },
+ {
+ label: 'modals.copyPaste.groups.tone',
+ keys: [
+ BasicAdjustment.Brightness,
+ BasicAdjustment.Contrast,
+ BasicAdjustment.Highlights,
+ BasicAdjustment.Shadows,
+ BasicAdjustment.Whites,
+ BasicAdjustment.Blacks,
+ ],
+ },
+ {
+ label: 'modals.copyPaste.groups.curves',
+ keys: ['curves', 'pointCurves', 'parametricCurve', 'curveMode'],
+ },
+ ],
+ color: [
+ { label: 'modals.copyPaste.groups.whiteBalance', keys: [ColorAdjustment.Temperature, ColorAdjustment.Tint] },
+ { label: 'modals.copyPaste.groups.presence', keys: [ColorAdjustment.Saturation, ColorAdjustment.Vibrance] },
+ {
+ label: 'modals.copyPaste.groups.hueShift',
+ keys: [ColorAdjustment.Hue],
+ },
+ { label: 'modals.copyPaste.groups.colorGrading', keys: [ColorAdjustment.ColorGrading] },
+ { label: 'modals.copyPaste.groups.colorMixer', keys: [ColorAdjustment.Hsl] },
+ { label: 'modals.copyPaste.groups.colorCalibration', keys: ['colorCalibration'] },
+ ],
+ details: [
+ {
+ label: 'modals.copyPaste.groups.clarityDehaze',
+ keys: [
+ DetailsAdjustment.Clarity,
+ DetailsAdjustment.Structure,
+ DetailsAdjustment.Dehaze,
+ DetailsAdjustment.Centré,
+ ],
+ },
+ {
+ label: 'modals.copyPaste.groups.sharpness',
+ keys: [DetailsAdjustment.Sharpness, DetailsAdjustment.SharpnessThreshold],
+ },
+ {
+ label: 'modals.copyPaste.groups.noiseReduction',
+ keys: [DetailsAdjustment.LumaNoiseReduction, DetailsAdjustment.ColorNoiseReduction],
+ },
+ {
+ label: 'modals.copyPaste.groups.chromaticAberration',
+ keys: [DetailsAdjustment.ChromaticAberrationRedCyan, DetailsAdjustment.ChromaticAberrationBlueYellow],
+ },
+ ],
+ effects: [
+ {
+ label: 'modals.copyPaste.groups.vignette',
+ keys: [Effect.VignetteAmount, Effect.VignetteFeather, Effect.VignetteMidpoint, Effect.VignetteRoundness],
+ },
+ { label: 'modals.copyPaste.groups.grain', keys: [Effect.GrainAmount, Effect.GrainRoughness, Effect.GrainSize] },
+ {
+ label: 'modals.copyPaste.groups.halationGlow',
+ keys: [CreativeAdjustment.GlowAmount, CreativeAdjustment.HalationAmount, CreativeAdjustment.FlareAmount],
+ },
+ {
+ label: 'modals.copyPaste.groups.lut',
+ keys: [Effect.LutIntensity, Effect.LutName, Effect.LutPath, Effect.LutSize, Effect.LutData],
+ },
+ ],
+ geometry: [
+ { label: 'modals.copyPaste.groups.cropAspectRatio', keys: ['crop', 'aspectRatio'] },
+ {
+ label: 'modals.copyPaste.groups.transformRotation',
+ keys: [
+ 'rotation',
+ 'flipHorizontal',
+ 'flipVertical',
+ 'orientationSteps',
+ TransformAdjustment.TransformDistortion,
+ TransformAdjustment.TransformVertical,
+ TransformAdjustment.TransformHorizontal,
+ TransformAdjustment.TransformRotate,
+ TransformAdjustment.TransformAspect,
+ TransformAdjustment.TransformScale,
+ TransformAdjustment.TransformXOffset,
+ TransformAdjustment.TransformYOffset,
+ ],
+ },
+ {
+ label: 'modals.copyPaste.groups.lensCorrection',
+ keys: [
+ LensAdjustment.LensCorrectionMode,
+ LensAdjustment.LensMaker,
+ LensAdjustment.LensModel,
+ LensAdjustment.LensDistortionAmount,
+ LensAdjustment.LensVignetteAmount,
+ LensAdjustment.LensTcaAmount,
+ LensAdjustment.LensDistortionEnabled,
+ LensAdjustment.LensTcaEnabled,
+ LensAdjustment.LensVignetteEnabled,
+ ],
+ },
+ ],
+ masks: [{ label: 'modals.copyPaste.groups.masks', keys: ['masks'] }],
+};
+
+export const COPYABLE_ADJUSTMENT_KEYS: string[] = Object.values(ADJUSTMENT_GROUPS)
+ .flat()
+ .flatMap((group) => group.keys);
+
+export const ADJUSTMENT_SECTIONS: Sections = {
+ basic: [
+ BasicAdjustment.Brightness,
+ BasicAdjustment.Contrast,
+ BasicAdjustment.Highlights,
+ BasicAdjustment.Shadows,
+ BasicAdjustment.Whites,
+ BasicAdjustment.Blacks,
+ BasicAdjustment.Exposure,
+ 'toneMapper',
+ ],
+ curves: ['curves', 'pointCurves', 'parametricCurve', 'curveMode'],
+ color: [
+ ColorAdjustment.Saturation,
+ ColorAdjustment.Temperature,
+ ColorAdjustment.Tint,
+ ColorAdjustment.Vibrance,
+ ColorAdjustment.Hsl,
+ ColorAdjustment.ColorGrading,
+ 'colorCalibration',
+ ColorAdjustment.Hue,
+ ],
+ details: [
+ DetailsAdjustment.Clarity,
+ DetailsAdjustment.Dehaze,
+ DetailsAdjustment.Structure,
+ DetailsAdjustment.Centré,
+ DetailsAdjustment.Sharpness,
+ DetailsAdjustment.SharpnessThreshold,
+ DetailsAdjustment.LumaNoiseReduction,
+ DetailsAdjustment.ColorNoiseReduction,
+ DetailsAdjustment.ChromaticAberrationRedCyan,
+ DetailsAdjustment.ChromaticAberrationBlueYellow,
+ ],
+ effects: [
+ CreativeAdjustment.GlowAmount,
+ CreativeAdjustment.HalationAmount,
+ CreativeAdjustment.FlareAmount,
+ Effect.GrainAmount,
+ Effect.GrainRoughness,
+ Effect.GrainSize,
+ Effect.LutIntensity,
+ Effect.LutName,
+ Effect.LutPath,
+ Effect.LutSize,
+ Effect.VignetteAmount,
+ Effect.VignetteFeather,
+ Effect.VignetteMidpoint,
+ Effect.VignetteRoundness,
+ ],
+};
+ |
+ Press n or j to go to the next uncovered block, b, p or k for the previous block. +
+ +| File | ++ | Statements | ++ | Branches | ++ | Functions | ++ | Lines | ++ |
|---|---|---|---|---|---|---|---|---|---|
| adjustments.ts | +
+
+ |
+ 95.16% | +118/124 | +39.65% | +46/116 | +84% | +21/25 | +96.61% | +114/118 | +
RAW工坊 v1.8.5 - Bug修复与工作流优化
+RAW工坊 v1.7.0 - Android端全面增强·AI智能评分·语义搜索·智能相册
+RAW工坊 v1.6.1 - 深空黑主题·中文本地化·面板交互重构
+