@umodeapporg/ui 0.14.0 → 0.16.0

package/dist/components/UI/ImageAiAdjust/ImageAiVerificationNotice.js

@@ -0,0 +1,39 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import classNames from "classnames";
+import { useTranslation } from "react-i18next";
+import { MaterialSymbol } from "../MaterialSymbol/index.js";
+const ImageAiVerificationNotice = ({ verification, className }) => {
+  const { t } = useTranslation("ui");
+  const changedTooMuch = verification?.changedMoreThanRequested === true;
+  const colorCheck = verification?.colorCheck ?? null;
+  const colorFailed = colorCheck?.passed === false;
+  if (!changedTooMuch && !colorFailed) return null;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      role: "status",
+      className: classNames(
+        "flex flex-col gap-y-1 rounded-xl border border-warning-border bg-warning-soft px-3 py-2 text-xs",
+        "text-warning-emphasis",
+        className
+      ),
+      children: [
+        changedTooMuch && /* @__PURE__ */ jsxs("span", { className: "flex items-start gap-x-1.5", children: [
+          /* @__PURE__ */ jsx(MaterialSymbol, { "aria-hidden": true, icon: "warning", size: 14, className: "mt-px shrink-0" }),
+          t("imageAiAdjust.verification.changedMoreThanRequested")
+        ] }),
+        colorFailed && colorCheck && /* @__PURE__ */ jsxs("span", { className: "flex items-start gap-x-1.5", children: [
+          /* @__PURE__ */ jsx(MaterialSymbol, { "aria-hidden": true, icon: "warning", size: 14, className: "mt-px shrink-0" }),
+          t("imageAiAdjust.verification.colorMismatch", {
+            dominant: colorCheck.dominantHex,
+            target: colorCheck.targetHex
+          })
+        ] })
+      ]
+    }
+  );
+};
+export {
+  ImageAiVerificationNotice as default
+};
+//# sourceMappingURL=ImageAiVerificationNotice.js.map

package/dist/components/UI/ImageAiAdjust/ImageAiVerificationNotice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageAiVerificationNotice.js","sources":["../../../../src/components/UI/ImageAiAdjust/ImageAiVerificationNotice.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport { MaterialSymbol } from '@/components/UI/MaterialSymbol';\n\nimport { IImageAiVerification } from './imageAiVerification';\n\ninterface IImageAiVerificationNoticeProps {\n  verification: IImageAiVerification | null | undefined;\n  className?: string;\n}\n\n/** Renders nothing unless the backend flagged the result; the flags are advisory only. */\nconst ImageAiVerificationNotice: React.FC<IImageAiVerificationNoticeProps> = ({ verification, className }) => {\n  const { t } = useTranslation('ui');\n\n  const changedTooMuch = verification?.changedMoreThanRequested === true;\n  const colorCheck = verification?.colorCheck ?? null;\n  const colorFailed = colorCheck?.passed === false;\n  if (!changedTooMuch && !colorFailed) return null;\n\n  return (\n    <div\n      role=\"status\"\n      className={classNames(\n        'flex flex-col gap-y-1 rounded-xl border border-warning-border bg-warning-soft px-3 py-2 text-xs',\n        'text-warning-emphasis',\n        className,\n      )}\n    >\n      {changedTooMuch && (\n        <span className=\"flex items-start gap-x-1.5\">\n          <MaterialSymbol aria-hidden icon=\"warning\" size={14} className=\"mt-px shrink-0\" />\n          {t('imageAiAdjust.verification.changedMoreThanRequested')}\n        </span>\n      )}\n      {colorFailed && colorCheck && (\n        <span className=\"flex items-start gap-x-1.5\">\n          <MaterialSymbol aria-hidden icon=\"warning\" size={14} className=\"mt-px shrink-0\" />\n          {t('imageAiAdjust.verification.colorMismatch', {\n            dominant: colorCheck.dominantHex,\n            target: colorCheck.targetHex,\n          })}\n        </span>\n      )}\n    </div>\n  );\n};\n\nexport default ImageAiVerificationNotice;\n"],"names":[],"mappings":";;;;AAaA,MAAM,4BAAuE,CAAC,EAAE,cAAc,gBAAgB;AAC5G,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AAEjC,QAAM,iBAAiB,cAAc,6BAA6B;AAClE,QAAM,aAAa,cAAc,cAAc;AAC/C,QAAM,cAAc,YAAY,WAAW;AAC3C,MAAI,CAAC,kBAAkB,CAAC,YAAa,QAAO;AAE5C,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,MAGD,UAAA;AAAA,QAAA,kBACC,qBAAC,QAAA,EAAK,WAAU,8BACd,UAAA;AAAA,UAAA,oBAAC,gBAAA,EAAe,eAAW,MAAC,MAAK,WAAU,MAAM,IAAI,WAAU,iBAAA,CAAiB;AAAA,UAC/E,EAAE,qDAAqD;AAAA,QAAA,GAC1D;AAAA,QAED,eAAe,cACd,qBAAC,QAAA,EAAK,WAAU,8BACd,UAAA;AAAA,UAAA,oBAAC,gBAAA,EAAe,eAAW,MAAC,MAAK,WAAU,MAAM,IAAI,WAAU,iBAAA,CAAiB;AAAA,UAC/E,EAAE,4CAA4C;AAAA,YAC7C,UAAU,WAAW;AAAA,YACrB,QAAQ,WAAW;AAAA,UAAA,CACpB;AAAA,QAAA,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/components/UI/ImageAiAdjust/imageAiReview.d.ts

@@ -0,0 +1,22 @@
+/** Why a user discarded an AI result; mirrors the backend ReviewReasonCode. */
+export declare const IMAGE_AI_REVIEW_REASON_CODES: readonly ["changed_the_product", "wrong_color", "bad_quality", "person_changed", "text_or_logo", "not_what_i_asked", "other"];
+export type TImageAiReviewReasonCode = (typeof IMAGE_AI_REVIEW_REASON_CODES)[number];
+export type TImageAiReviewDecision = 'approved' | 'discarded';
+/** Matches the backend limit for the free-text review reason. */
+export declare const IMAGE_AI_REVIEW_REASON_MAX = 500;
+/** Keys in the `ui` namespace, so hosts can render the same labels. */
+export declare const IMAGE_AI_REVIEW_REASON_LABEL_KEYS: Record<TImageAiReviewReasonCode, string>;
+export declare const isImageAiReviewReasonCode: (value: unknown) => value is TImageAiReviewReasonCode;
+export interface IImageAiDiscardReason {
+    reasonCode: TImageAiReviewReasonCode;
+    reason?: string;
+}
+export interface IImageAiReview {
+    generationId: string;
+    decision: TImageAiReviewDecision;
+    reasonCode?: TImageAiReviewReasonCode;
+    reason?: string;
+}
+export type TImageAiReviewHandler = (review: IImageAiReview) => Promise<void> | void;
+/** A review is feedback, never a gate: failures are logged and swallowed. */
+export declare const submitImageAiReview: (handler: TImageAiReviewHandler | undefined, review: IImageAiReview) => Promise<void>;

package/dist/components/UI/ImageAiAdjust/imageAiReview.js

@@ -0,0 +1,37 @@
+import { uiLogger } from "../../../helpers/uiLogger.js";
+const IMAGE_AI_REVIEW_REASON_CODES = [
+  "changed_the_product",
+  "wrong_color",
+  "bad_quality",
+  "person_changed",
+  "text_or_logo",
+  "not_what_i_asked",
+  "other"
+];
+const IMAGE_AI_REVIEW_REASON_MAX = 500;
+const IMAGE_AI_REVIEW_REASON_LABEL_KEYS = {
+  changed_the_product: "imageAiReview.reasons.changed_the_product",
+  wrong_color: "imageAiReview.reasons.wrong_color",
+  bad_quality: "imageAiReview.reasons.bad_quality",
+  person_changed: "imageAiReview.reasons.person_changed",
+  text_or_logo: "imageAiReview.reasons.text_or_logo",
+  not_what_i_asked: "imageAiReview.reasons.not_what_i_asked",
+  other: "imageAiReview.reasons.other"
+};
+const isImageAiReviewReasonCode = (value) => typeof value === "string" && IMAGE_AI_REVIEW_REASON_CODES.includes(value);
+const submitImageAiReview = async (handler, review) => {
+  if (!handler || !review.generationId) return;
+  try {
+    await handler(review);
+  } catch (error) {
+    uiLogger.warn("Failed to submit the AI image review", error);
+  }
+};
+export {
+  IMAGE_AI_REVIEW_REASON_CODES,
+  IMAGE_AI_REVIEW_REASON_LABEL_KEYS,
+  IMAGE_AI_REVIEW_REASON_MAX,
+  isImageAiReviewReasonCode,
+  submitImageAiReview
+};
+//# sourceMappingURL=imageAiReview.js.map

package/dist/components/UI/ImageAiAdjust/imageAiReview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"imageAiReview.js","sources":["../../../../src/components/UI/ImageAiAdjust/imageAiReview.ts"],"sourcesContent":["import { uiLogger } from '@/helpers/uiLogger';\n\n/** Why a user discarded an AI result; mirrors the backend ReviewReasonCode. */\nexport const IMAGE_AI_REVIEW_REASON_CODES = [\n  'changed_the_product',\n  'wrong_color',\n  'bad_quality',\n  'person_changed',\n  'text_or_logo',\n  'not_what_i_asked',\n  'other',\n] as const;\n\nexport type TImageAiReviewReasonCode = (typeof IMAGE_AI_REVIEW_REASON_CODES)[number];\n\nexport type TImageAiReviewDecision = 'approved' | 'discarded';\n\n/** Matches the backend limit for the free-text review reason. */\nexport const IMAGE_AI_REVIEW_REASON_MAX = 500;\n\n/** Keys in the `ui` namespace, so hosts can render the same labels. */\nexport const IMAGE_AI_REVIEW_REASON_LABEL_KEYS: Record<TImageAiReviewReasonCode, string> = {\n  changed_the_product: 'imageAiReview.reasons.changed_the_product',\n  wrong_color: 'imageAiReview.reasons.wrong_color',\n  bad_quality: 'imageAiReview.reasons.bad_quality',\n  person_changed: 'imageAiReview.reasons.person_changed',\n  text_or_logo: 'imageAiReview.reasons.text_or_logo',\n  not_what_i_asked: 'imageAiReview.reasons.not_what_i_asked',\n  other: 'imageAiReview.reasons.other',\n};\n\nexport const isImageAiReviewReasonCode = (value: unknown): value is TImageAiReviewReasonCode =>\n  typeof value === 'string' && (IMAGE_AI_REVIEW_REASON_CODES as ReadonlyArray<string>).includes(value);\n\nexport interface IImageAiDiscardReason {\n  reasonCode: TImageAiReviewReasonCode;\n  reason?: string;\n}\n\nexport interface IImageAiReview {\n  generationId: string;\n  decision: TImageAiReviewDecision;\n  reasonCode?: TImageAiReviewReasonCode;\n  reason?: string;\n}\n\nexport type TImageAiReviewHandler = (review: IImageAiReview) => Promise<void> | void;\n\n/** A review is feedback, never a gate: failures are logged and swallowed. */\nexport const submitImageAiReview = async (\n  handler: TImageAiReviewHandler | undefined,\n  review: IImageAiReview,\n): Promise<void> => {\n  if (!handler || !review.generationId) return;\n\n  try {\n    await handler(review);\n  } catch (error) {\n    uiLogger.warn('Failed to submit the AI image review', error);\n  }\n};\n"],"names":[],"mappings":";AAGO,MAAM,+BAA+B;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAOO,MAAM,6BAA6B;AAGnC,MAAM,oCAA8E;AAAA,EACzF,qBAAqB;AAAA,EACrB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,OAAO;AACT;AAEO,MAAM,4BAA4B,CAAC,UACxC,OAAO,UAAU,YAAa,6BAAuD,SAAS,KAAK;AAiB9F,MAAM,sBAAsB,OACjC,SACA,WACkB;AAClB,MAAI,CAAC,WAAW,CAAC,OAAO,aAAc;AAEtC,MAAI;AACF,UAAM,QAAQ,MAAM;AAAA,EACtB,SAAS,OAAO;AACd,aAAS,KAAK,wCAAwC,KAAK;AAAA,EAC7D;AACF;"}

package/dist/components/UI/ImageAiAdjust/imageAiVerification.d.ts

@@ -0,0 +1,19 @@
+/** Backend check of the dominant garment colour against the requested one (CIEDE2000). */
+export interface IImageAiColorCheck {
+    targetHex: string;
+    dominantHex: string;
+    deltaE: number;
+    passed: boolean;
+}
+/** What the backend measured on an AI result; every field is advisory, never blocking. */
+export interface IImageAiVerification {
+    /** Mean normalized difference outside the painted area (whole image without a mask), 0..1. */
+    changeScore: number | null;
+    threshold: number;
+    changedMoreThanRequested: boolean;
+    /** True when pixels outside the mask were restored from the source. */
+    composited: boolean;
+    colorCheck: IImageAiColorCheck | null;
+}
+/** Coerces whatever the host received into the verification shape, or null when absent/garbled. */
+export declare const normalizeImageAiVerification: (value: unknown) => IImageAiVerification | null;

package/dist/components/UI/ImageAiAdjust/imageAiVerification.js

@@ -0,0 +1,25 @@
+const isRecord = (value) => typeof value === "object" && value !== null;
+const finiteOr = (value, fallback) => typeof value === "number" && Number.isFinite(value) ? value : fallback;
+const normalizeColorCheck = (value) => {
+  if (!isRecord(value) || typeof value.passed !== "boolean") return null;
+  return {
+    targetHex: typeof value.targetHex === "string" ? value.targetHex : "",
+    dominantHex: typeof value.dominantHex === "string" ? value.dominantHex : "",
+    deltaE: finiteOr(value.deltaE, 0),
+    passed: value.passed
+  };
+};
+const normalizeImageAiVerification = (value) => {
+  if (!isRecord(value)) return null;
+  return {
+    changeScore: finiteOr(value.changeScore, null),
+    threshold: finiteOr(value.threshold, 0),
+    changedMoreThanRequested: value.changedMoreThanRequested === true,
+    composited: value.composited === true,
+    colorCheck: normalizeColorCheck(value.colorCheck)
+  };
+};
+export {
+  normalizeImageAiVerification
+};
+//# sourceMappingURL=imageAiVerification.js.map

package/dist/components/UI/ImageAiAdjust/imageAiVerification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"imageAiVerification.js","sources":["../../../../src/components/UI/ImageAiAdjust/imageAiVerification.ts"],"sourcesContent":["/** Backend check of the dominant garment colour against the requested one (CIEDE2000). */\nexport interface IImageAiColorCheck {\n  targetHex: string;\n  dominantHex: string;\n  deltaE: number;\n  passed: boolean;\n}\n\n/** What the backend measured on an AI result; every field is advisory, never blocking. */\nexport interface IImageAiVerification {\n  /** Mean normalized difference outside the painted area (whole image without a mask), 0..1. */\n  changeScore: number | null;\n  threshold: number;\n  changedMoreThanRequested: boolean;\n  /** True when pixels outside the mask were restored from the source. */\n  composited: boolean;\n  colorCheck: IImageAiColorCheck | null;\n}\n\nconst isRecord = (value: unknown): value is Record<string, unknown> => typeof value === 'object' && value !== null;\n\nconst finiteOr = <T>(value: unknown, fallback: T): number | T =>\n  typeof value === 'number' && Number.isFinite(value) ? value : fallback;\n\nconst normalizeColorCheck = (value: unknown): IImageAiColorCheck | null => {\n  if (!isRecord(value) || typeof value.passed !== 'boolean') return null;\n  return {\n    targetHex: typeof value.targetHex === 'string' ? value.targetHex : '',\n    dominantHex: typeof value.dominantHex === 'string' ? value.dominantHex : '',\n    deltaE: finiteOr(value.deltaE, 0),\n    passed: value.passed,\n  };\n};\n\n/** Coerces whatever the host received into the verification shape, or null when absent/garbled. */\nexport const normalizeImageAiVerification = (value: unknown): IImageAiVerification | null => {\n  if (!isRecord(value)) return null;\n  return {\n    changeScore: finiteOr(value.changeScore, null),\n    threshold: finiteOr(value.threshold, 0),\n    changedMoreThanRequested: value.changedMoreThanRequested === true,\n    composited: value.composited === true,\n    colorCheck: normalizeColorCheck(value.colorCheck),\n  };\n};\n"],"names":[],"mappings":"AAmBA,MAAM,WAAW,CAAC,UAAqD,OAAO,UAAU,YAAY,UAAU;AAE9G,MAAM,WAAW,CAAI,OAAgB,aACnC,OAAO,UAAU,YAAY,OAAO,SAAS,KAAK,IAAI,QAAQ;AAEhE,MAAM,sBAAsB,CAAC,UAA8C;AACzE,MAAI,CAAC,SAAS,KAAK,KAAK,OAAO,MAAM,WAAW,UAAW,QAAO;AAClE,SAAO;AAAA,IACL,WAAW,OAAO,MAAM,cAAc,WAAW,MAAM,YAAY;AAAA,IACnE,aAAa,OAAO,MAAM,gBAAgB,WAAW,MAAM,cAAc;AAAA,IACzE,QAAQ,SAAS,MAAM,QAAQ,CAAC;AAAA,IAChC,QAAQ,MAAM;AAAA,EAAA;AAElB;AAGO,MAAM,+BAA+B,CAAC,UAAgD;AAC3F,MAAI,CAAC,SAAS,KAAK,EAAG,QAAO;AAC7B,SAAO;AAAA,IACL,aAAa,SAAS,MAAM,aAAa,IAAI;AAAA,IAC7C,WAAW,SAAS,MAAM,WAAW,CAAC;AAAA,IACtC,0BAA0B,MAAM,6BAA6B;AAAA,IAC7D,YAAY,MAAM,eAAe;AAAA,IACjC,YAAY,oBAAoB,MAAM,UAAU;AAAA,EAAA;AAEpD;"}

package/dist/components/UI/ImageAiAdjust/useImageAiAdjust.d.ts

@@ -1,11 +1,30 @@
+import { IImageAiVerification } from './imageAiVerification';
+export type { IImageAiColorCheck, IImageAiVerification } from './imageAiVerification';
+/** Matches the backend limit for the adjustment instructions. */
+export declare const IMAGE_AI_ADJUST_MAX_INSTRUCTIONS = 2000;
+/**
+ * An adjuster may reject with an error carrying `displayMessage`: a short reason the host has
+ * already vetted as safe to show (for example why the model refused). Anything else stays generic.
+ */
+export interface IImageAiAdjustDisplayableError {
+    displayMessage: string;
+}
+export declare const getImageAiAdjustDisplayMessage: (error: unknown) => string | null;
 export interface IImageAiAdjustRequest {
-    /** The current image, already resized for transport. */
+    /** The current image at full resolution, only re-encoded when it exceeds the upload budget. */
     baseImage: File;
     instructions: string;
     productId?: string;
+    /** PNG at the source's natural size: white = the only area that may change, black = keep. */
+    mask?: File;
 }
 export interface IImageAiAdjustResult {
     imageUrl: string;
+    /** Present when the host logs generations; enables the approve/discard review. */
+    generationId?: string;
+    costUsd?: number;
+    /** Backend checks on the result; a warning is shown when it changed more than asked. */
+    verification?: IImageAiVerification | null;
 }
 /** The host decides which AI backend serves the adjustment; the UI only knows this contract. */
 export type TImageAiAdjuster = (request: IImageAiAdjustRequest, signal: AbortSignal) => Promise<IImageAiAdjustResult>;
@@ -14,11 +33,15 @@ export interface IUseImageAiAdjustParams {
     imageName?: string;
     productId?: string;
     adjustImage: TImageAiAdjuster;
+    /** Optional painted region; sent with the request only when present. */
+    mask?: File | null;
 }
 export interface IUseImageAiAdjust {
     instructions: string;
     setInstructions: (value: string) => void;
     resultUrl: string | null;
+    resultGenerationId: string | null;
+    resultVerification: IImageAiVerification | null;
     isGenerating: boolean;
     canGenerate: boolean;
     generate: () => Promise<void>;
@@ -26,4 +49,4 @@ export interface IUseImageAiAdjust {
     discardResult: () => void;
     buildResultFile: () => Promise<File>;
 }
-export declare const useImageAiAdjust: ({ imageUrl, imageName, productId, adjustImage, }: IUseImageAiAdjustParams) => IUseImageAiAdjust;
+export declare const useImageAiAdjust: ({ imageUrl, imageName, productId, adjustImage, mask, }: IUseImageAiAdjustParams) => IUseImageAiAdjust;

package/dist/components/UI/ImageAiAdjust/useImageAiAdjust.js

@@ -1,26 +1,34 @@
 import { useRef, useState, useEffect, useCallback } from "react";
 import { useTranslation } from "react-i18next";
-import { fileFromUrl, resizeImageFile } from "../../../helpers/imageFile.js";
+import { fileFromUrl, imageExtensionForType, fitImageToUploadBudget } from "../../../helpers/imageFile.js";
 import { uiLogger } from "../../../helpers/uiLogger.js";
 import { useNotification } from "../../../hooks/useNotification.js";
-const ADJUSTED_IMAGE_MAX_DIMENSION = 1600;
-const ADJUSTED_IMAGE_QUALITY = 0.9;
+import { normalizeImageAiVerification } from "./imageAiVerification.js";
+const IMAGE_AI_ADJUST_MAX_INSTRUCTIONS = 2e3;
 const isAbortError = (error) => error instanceof DOMException && error.name === "AbortError";
-const adjustedFileName = (imageName) => {
+const getImageAiAdjustDisplayMessage = (error) => {
+  if (typeof error !== "object" || error === null || !("displayMessage" in error)) return null;
+  const { displayMessage } = error;
+  return typeof displayMessage === "string" && displayMessage.trim() ? displayMessage.trim() : null;
+};
+const adjustedFileName = (imageName, type) => {
   const base = (imageName ?? "image").replace(/\.[^.]+$/, "") || "image";
-  return `${base}-ia.jpg`;
+  return `${base}-ia.${imageExtensionForType(type)}`;
 };
 const useImageAiAdjust = ({
   imageUrl,
   imageName,
   productId,
-  adjustImage
+  adjustImage,
+  mask
 }) => {
   const { t } = useTranslation("ui");
   const { notify } = useNotification();
   const abortRef = useRef(null);
   const [instructions, setInstructions] = useState("");
   const [resultUrl, setResultUrl] = useState(null);
+  const [resultGenerationId, setResultGenerationId] = useState(null);
+  const [resultVerification, setResultVerification] = useState(null);
   const [isGenerating, setIsGenerating] = useState(false);
   useEffect(
     () => () => {
@@ -32,46 +40,61 @@ const useImageAiAdjust = ({
   const cancel = useCallback(() => {
     abortRef.current?.abort();
   }, []);
-  const discardResult = useCallback(() => setResultUrl(null), []);
+  const discardResult = useCallback(() => {
+    setResultUrl(null);
+    setResultGenerationId(null);
+    setResultVerification(null);
+  }, []);
   const generate = useCallback(async () => {
     const prompt = instructions.trim();
-    if (!prompt || isGenerating) return;
+    if (!prompt || prompt.length > IMAGE_AI_ADJUST_MAX_INSTRUCTIONS || isGenerating) return;
     abortRef.current?.abort();
     const controller = new AbortController();
     abortRef.current = controller;
     setIsGenerating(true);
     try {
-      const baseFile = await fileFromUrl(imageUrl, "base-image.jpg", controller.signal);
+      const fetched = await fileFromUrl(imageUrl, "base-image", controller.signal);
       if (controller.signal.aborted) return;
-      const baseImage = await resizeImageFile(baseFile);
+      const baseFile = new File([fetched], `base-image.${imageExtensionForType(fetched.type)}`, { type: fetched.type });
+      const baseImage = await fitImageToUploadBudget(baseFile);
       if (controller.signal.aborted) return;
-      const response = await adjustImage({ baseImage, instructions: prompt, productId }, controller.signal);
+      const request = { baseImage, instructions: prompt, productId };
+      if (mask) request.mask = mask;
+      const response = await adjustImage(request, controller.signal);
       if (controller.signal.aborted) return;
       setResultUrl(response.imageUrl);
+      setResultGenerationId(
+        typeof response.generationId === "string" && response.generationId ? response.generationId : null
+      );
+      setResultVerification(normalizeImageAiVerification(response.verification));
     } catch (error) {
-      if (isAbortError(error)) return;
+      if (isAbortError(error) || controller.signal.aborted) return;
       uiLogger.error("Failed to adjust the image with AI", error);
-      notify({ message: t("imageAiAdjust.errorGenerate"), type: "error" });
+      const reason = getImageAiAdjustDisplayMessage(error);
+      notify({
+        message: reason ? t("imageAiAdjust.errorRefused", { reason }) : t("imageAiAdjust.errorGenerate"),
+        type: "error"
+      });
     } finally {
       if (abortRef.current === controller) {
         abortRef.current = null;
         setIsGenerating(false);
       }
     }
-  }, [instructions, isGenerating, imageUrl, productId, adjustImage, notify, t]);
+  }, [instructions, isGenerating, imageUrl, productId, adjustImage, mask, notify, t]);
   const buildResultFile = useCallback(async () => {
     if (!resultUrl) throw new Error("No adjusted image to save");
-    return resizeImageFile(await fileFromUrl(resultUrl, adjustedFileName(imageName)), {
-      maxDimension: ADJUSTED_IMAGE_MAX_DIMENSION,
-      quality: ADJUSTED_IMAGE_QUALITY
-    });
+    const fetched = await fileFromUrl(resultUrl, "adjusted-image");
+    return new File([fetched], adjustedFileName(imageName, fetched.type), { type: fetched.type });
   }, [resultUrl, imageName]);
   return {
     instructions,
     setInstructions,
     resultUrl,
+    resultGenerationId,
+    resultVerification,
     isGenerating,
-    canGenerate: Boolean(instructions.trim()) && !isGenerating,
+    canGenerate: Boolean(instructions.trim()) && instructions.trim().length <= IMAGE_AI_ADJUST_MAX_INSTRUCTIONS && !isGenerating,
     generate,
     cancel,
     discardResult,
@@ -79,6 +102,8 @@ const useImageAiAdjust = ({
   };
 };
 export {
+  IMAGE_AI_ADJUST_MAX_INSTRUCTIONS,
+  getImageAiAdjustDisplayMessage,
   useImageAiAdjust
 };
 //# sourceMappingURL=useImageAiAdjust.js.map

package/dist/components/UI/ImageAiAdjust/useImageAiAdjust.js.map

@@ -1 +1 @@
-{"version":3,"file":"useImageAiAdjust.js","sources":["../../../../src/components/UI/ImageAiAdjust/useImageAiAdjust.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { fileFromUrl, resizeImageFile } from '@/helpers/imageFile';\nimport { uiLogger } from '@/helpers/uiLogger';\nimport { useNotification } from '@/hooks/useNotification';\n\nconst ADJUSTED_IMAGE_MAX_DIMENSION = 1600;\nconst ADJUSTED_IMAGE_QUALITY = 0.9;\n\nconst isAbortError = (error: unknown): boolean => error instanceof DOMException && error.name === 'AbortError';\n\nexport interface IImageAiAdjustRequest {\n  /** The current image, already resized for transport. */\n  baseImage: File;\n  instructions: string;\n  productId?: string;\n}\n\nexport interface IImageAiAdjustResult {\n  imageUrl: string;\n}\n\n/** The host decides which AI backend serves the adjustment; the UI only knows this contract. */\nexport type TImageAiAdjuster = (request: IImageAiAdjustRequest, signal: AbortSignal) => Promise<IImageAiAdjustResult>;\n\nexport interface IUseImageAiAdjustParams {\n  imageUrl: string;\n  imageName?: string;\n  productId?: string;\n  adjustImage: TImageAiAdjuster;\n}\n\nexport interface IUseImageAiAdjust {\n  instructions: string;\n  setInstructions: (value: string) => void;\n  resultUrl: string | null;\n  isGenerating: boolean;\n  canGenerate: boolean;\n  generate: () => Promise<void>;\n  cancel: () => void;\n  discardResult: () => void;\n  buildResultFile: () => Promise<File>;\n}\n\nconst adjustedFileName = (imageName: string | undefined): string => {\n  const base = (imageName ?? 'image').replace(/\\.[^.]+$/, '') || 'image';\n  return `${base}-ia.jpg`;\n};\n\nexport const useImageAiAdjust = ({\n  imageUrl,\n  imageName,\n  productId,\n  adjustImage,\n}: IUseImageAiAdjustParams): IUseImageAiAdjust => {\n  const { t } = useTranslation('ui');\n  const { notify } = useNotification();\n\n  const abortRef = useRef<AbortController | null>(null);\n  const [instructions, setInstructions] = useState('');\n  const [resultUrl, setResultUrl] = useState<string | null>(null);\n  const [isGenerating, setIsGenerating] = useState(false);\n\n  // Closing the dialog mid-generation would leave an orphan request holding the connection.\n  useEffect(\n    () => () => {\n      abortRef.current?.abort();\n      abortRef.current = null;\n    },\n    [],\n  );\n\n  const cancel = useCallback(() => {\n    abortRef.current?.abort();\n  }, []);\n\n  const discardResult = useCallback(() => setResultUrl(null), []);\n\n  const generate = useCallback(async () => {\n    const prompt = instructions.trim();\n    if (!prompt || isGenerating) return;\n\n    abortRef.current?.abort();\n    const controller = new AbortController();\n    abortRef.current = controller;\n    setIsGenerating(true);\n\n    try {\n      const baseFile = await fileFromUrl(imageUrl, 'base-image.jpg', controller.signal);\n      if (controller.signal.aborted) return;\n\n      const baseImage = await resizeImageFile(baseFile);\n      if (controller.signal.aborted) return;\n\n      const response = await adjustImage({ baseImage, instructions: prompt, productId }, controller.signal);\n      if (controller.signal.aborted) return;\n\n      setResultUrl(response.imageUrl);\n    } catch (error) {\n      if (isAbortError(error)) return;\n      uiLogger.error('Failed to adjust the image with AI', error);\n      notify({ message: t('imageAiAdjust.errorGenerate'), type: 'error' });\n    } finally {\n      if (abortRef.current === controller) {\n        abortRef.current = null;\n        setIsGenerating(false);\n      }\n    }\n  }, [instructions, isGenerating, imageUrl, productId, adjustImage, notify, t]);\n\n  const buildResultFile = useCallback(async () => {\n    if (!resultUrl) throw new Error('No adjusted image to save');\n\n    return resizeImageFile(await fileFromUrl(resultUrl, adjustedFileName(imageName)), {\n      maxDimension: ADJUSTED_IMAGE_MAX_DIMENSION,\n      quality: ADJUSTED_IMAGE_QUALITY,\n    });\n  }, [resultUrl, imageName]);\n\n  return {\n    instructions,\n    setInstructions,\n    resultUrl,\n    isGenerating,\n    canGenerate: Boolean(instructions.trim()) && !isGenerating,\n    generate,\n    cancel,\n    discardResult,\n    buildResultFile,\n  };\n};\n"],"names":[],"mappings":";;;;;AAOA,MAAM,+BAA+B;AACrC,MAAM,yBAAyB;AAE/B,MAAM,eAAe,CAAC,UAA4B,iBAAiB,gBAAgB,MAAM,SAAS;AAmClG,MAAM,mBAAmB,CAAC,cAA0C;AAClE,QAAM,QAAQ,aAAa,SAAS,QAAQ,YAAY,EAAE,KAAK;AAC/D,SAAO,GAAG,IAAI;AAChB;AAEO,MAAM,mBAAmB,CAAC;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAkD;AAChD,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,QAAM,EAAE,OAAA,IAAW,gBAAA;AAEnB,QAAM,WAAW,OAA+B,IAAI;AACpD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,EAAE;AACnD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAwB,IAAI;AAC9D,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAGtD;AAAA,IACE,MAAM,MAAM;AACV,eAAS,SAAS,MAAA;AAClB,eAAS,UAAU;AAAA,IACrB;AAAA,IACA,CAAA;AAAA,EAAC;AAGH,QAAM,SAAS,YAAY,MAAM;AAC/B,aAAS,SAAS,MAAA;AAAA,EACpB,GAAG,CAAA,CAAE;AAEL,QAAM,gBAAgB,YAAY,MAAM,aAAa,IAAI,GAAG,CAAA,CAAE;AAE9D,QAAM,WAAW,YAAY,YAAY;AACvC,UAAM,SAAS,aAAa,KAAA;AAC5B,QAAI,CAAC,UAAU,aAAc;AAE7B,aAAS,SAAS,MAAA;AAClB,UAAM,aAAa,IAAI,gBAAA;AACvB,aAAS,UAAU;AACnB,oBAAgB,IAAI;AAEpB,QAAI;AACF,YAAM,WAAW,MAAM,YAAY,UAAU,kBAAkB,WAAW,MAAM;AAChF,UAAI,WAAW,OAAO,QAAS;AAE/B,YAAM,YAAY,MAAM,gBAAgB,QAAQ;AAChD,UAAI,WAAW,OAAO,QAAS;AAE/B,YAAM,WAAW,MAAM,YAAY,EAAE,WAAW,cAAc,QAAQ,UAAA,GAAa,WAAW,MAAM;AACpG,UAAI,WAAW,OAAO,QAAS;AAE/B,mBAAa,SAAS,QAAQ;AAAA,IAChC,SAAS,OAAO;AACd,UAAI,aAAa,KAAK,EAAG;AACzB,eAAS,MAAM,sCAAsC,KAAK;AAC1D,aAAO,EAAE,SAAS,EAAE,6BAA6B,GAAG,MAAM,SAAS;AAAA,IACrE,UAAA;AACE,UAAI,SAAS,YAAY,YAAY;AACnC,iBAAS,UAAU;AACnB,wBAAgB,KAAK;AAAA,MACvB;AAAA,IACF;AAAA,EACF,GAAG,CAAC,cAAc,cAAc,UAAU,WAAW,aAAa,QAAQ,CAAC,CAAC;AAE5E,QAAM,kBAAkB,YAAY,YAAY;AAC9C,QAAI,CAAC,UAAW,OAAM,IAAI,MAAM,2BAA2B;AAE3D,WAAO,gBAAgB,MAAM,YAAY,WAAW,iBAAiB,SAAS,CAAC,GAAG;AAAA,MAChF,cAAc;AAAA,MACd,SAAS;AAAA,IAAA,CACV;AAAA,EACH,GAAG,CAAC,WAAW,SAAS,CAAC;AAEzB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa,QAAQ,aAAa,KAAA,CAAM,KAAK,CAAC;AAAA,IAC9C;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useImageAiAdjust.js","sources":["../../../../src/components/UI/ImageAiAdjust/useImageAiAdjust.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport { fileFromUrl, fitImageToUploadBudget, imageExtensionForType } from '@/helpers/imageFile';\nimport { uiLogger } from '@/helpers/uiLogger';\nimport { useNotification } from '@/hooks/useNotification';\n\nimport { IImageAiVerification, normalizeImageAiVerification } from './imageAiVerification';\n\nexport type { IImageAiColorCheck, IImageAiVerification } from './imageAiVerification';\n\n/** Matches the backend limit for the adjustment instructions. */\nexport const IMAGE_AI_ADJUST_MAX_INSTRUCTIONS = 2000;\n\nconst isAbortError = (error: unknown): boolean => error instanceof DOMException && error.name === 'AbortError';\n\n/**\n * An adjuster may reject with an error carrying `displayMessage`: a short reason the host has\n * already vetted as safe to show (for example why the model refused). Anything else stays generic.\n */\nexport interface IImageAiAdjustDisplayableError {\n  displayMessage: string;\n}\n\nexport const getImageAiAdjustDisplayMessage = (error: unknown): string | null => {\n  if (typeof error !== 'object' || error === null || !('displayMessage' in error)) return null;\n  const { displayMessage } = error as Partial<IImageAiAdjustDisplayableError>;\n  return typeof displayMessage === 'string' && displayMessage.trim() ? displayMessage.trim() : null;\n};\n\nexport interface IImageAiAdjustRequest {\n  /** The current image at full resolution, only re-encoded when it exceeds the upload budget. */\n  baseImage: File;\n  instructions: string;\n  productId?: string;\n  /** PNG at the source's natural size: white = the only area that may change, black = keep. */\n  mask?: File;\n}\n\nexport interface IImageAiAdjustResult {\n  imageUrl: string;\n  /** Present when the host logs generations; enables the approve/discard review. */\n  generationId?: string;\n  costUsd?: number;\n  /** Backend checks on the result; a warning is shown when it changed more than asked. */\n  verification?: IImageAiVerification | null;\n}\n\n/** The host decides which AI backend serves the adjustment; the UI only knows this contract. */\nexport type TImageAiAdjuster = (request: IImageAiAdjustRequest, signal: AbortSignal) => Promise<IImageAiAdjustResult>;\n\nexport interface IUseImageAiAdjustParams {\n  imageUrl: string;\n  imageName?: string;\n  productId?: string;\n  adjustImage: TImageAiAdjuster;\n  /** Optional painted region; sent with the request only when present. */\n  mask?: File | null;\n}\n\nexport interface IUseImageAiAdjust {\n  instructions: string;\n  setInstructions: (value: string) => void;\n  resultUrl: string | null;\n  resultGenerationId: string | null;\n  resultVerification: IImageAiVerification | null;\n  isGenerating: boolean;\n  canGenerate: boolean;\n  generate: () => Promise<void>;\n  cancel: () => void;\n  discardResult: () => void;\n  buildResultFile: () => Promise<File>;\n}\n\nconst adjustedFileName = (imageName: string | undefined, type: string): string => {\n  const base = (imageName ?? 'image').replace(/\\.[^.]+$/, '') || 'image';\n  return `${base}-ia.${imageExtensionForType(type)}`;\n};\n\nexport const useImageAiAdjust = ({\n  imageUrl,\n  imageName,\n  productId,\n  adjustImage,\n  mask,\n}: IUseImageAiAdjustParams): IUseImageAiAdjust => {\n  const { t } = useTranslation('ui');\n  const { notify } = useNotification();\n\n  const abortRef = useRef<AbortController | null>(null);\n  const [instructions, setInstructions] = useState('');\n  const [resultUrl, setResultUrl] = useState<string | null>(null);\n  const [resultGenerationId, setResultGenerationId] = useState<string | null>(null);\n  const [resultVerification, setResultVerification] = useState<IImageAiVerification | null>(null);\n  const [isGenerating, setIsGenerating] = useState(false);\n\n  // Closing the dialog mid-generation would leave an orphan request holding the connection.\n  useEffect(\n    () => () => {\n      abortRef.current?.abort();\n      abortRef.current = null;\n    },\n    [],\n  );\n\n  const cancel = useCallback(() => {\n    abortRef.current?.abort();\n  }, []);\n\n  const discardResult = useCallback(() => {\n    setResultUrl(null);\n    setResultGenerationId(null);\n    setResultVerification(null);\n  }, []);\n\n  const generate = useCallback(async () => {\n    const prompt = instructions.trim();\n    if (!prompt || prompt.length > IMAGE_AI_ADJUST_MAX_INSTRUCTIONS || isGenerating) return;\n\n    abortRef.current?.abort();\n    const controller = new AbortController();\n    abortRef.current = controller;\n    setIsGenerating(true);\n\n    try {\n      const fetched = await fileFromUrl(imageUrl, 'base-image', controller.signal);\n      if (controller.signal.aborted) return;\n\n      const baseFile = new File([fetched], `base-image.${imageExtensionForType(fetched.type)}`, { type: fetched.type });\n      const baseImage = await fitImageToUploadBudget(baseFile);\n      if (controller.signal.aborted) return;\n\n      const request: IImageAiAdjustRequest = { baseImage, instructions: prompt, productId };\n      if (mask) request.mask = mask;\n      const response = await adjustImage(request, controller.signal);\n      if (controller.signal.aborted) return;\n\n      setResultUrl(response.imageUrl);\n      setResultGenerationId(\n        typeof response.generationId === 'string' && response.generationId ? response.generationId : null,\n      );\n      setResultVerification(normalizeImageAiVerification(response.verification));\n    } catch (error) {\n      // Hosts may reject a cancelled request with their own error type (axios CanceledError).\n      if (isAbortError(error) || controller.signal.aborted) return;\n      uiLogger.error('Failed to adjust the image with AI', error);\n      const reason = getImageAiAdjustDisplayMessage(error);\n      notify({\n        message: reason ? t('imageAiAdjust.errorRefused', { reason }) : t('imageAiAdjust.errorGenerate'),\n        type: 'error',\n      });\n    } finally {\n      if (abortRef.current === controller) {\n        abortRef.current = null;\n        setIsGenerating(false);\n      }\n    }\n  }, [instructions, isGenerating, imageUrl, productId, adjustImage, mask, notify, t]);\n\n  const buildResultFile = useCallback(async () => {\n    if (!resultUrl) throw new Error('No adjusted image to save');\n\n    // Kept byte for byte: re-encoding would throw away the quality the adjustment preserved.\n    const fetched = await fileFromUrl(resultUrl, 'adjusted-image');\n    return new File([fetched], adjustedFileName(imageName, fetched.type), { type: fetched.type });\n  }, [resultUrl, imageName]);\n\n  return {\n    instructions,\n    setInstructions,\n    resultUrl,\n    resultGenerationId,\n    resultVerification,\n    isGenerating,\n    canGenerate:\n      Boolean(instructions.trim()) && instructions.trim().length <= IMAGE_AI_ADJUST_MAX_INSTRUCTIONS && !isGenerating,\n    generate,\n    cancel,\n    discardResult,\n    buildResultFile,\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist/components/UI/ImageMaskPainter/index.d.ts

@@ -0,0 +1,19 @@
+export type { TMaskBrushMode } from './maskStrokes';
+/** Brush diameter in on-screen pixels; converted to natural pixels per stroke. */
+export declare const IMAGE_MASK_BRUSH_MIN = 8;
+export declare const IMAGE_MASK_BRUSH_MAX = 96;
+export interface IImageMaskPainterProps {
+    imageUrl: string;
+    /**
+     * Called after every stroke, undo and clear with a PNG at the image's natural resolution
+     * (white = painted, black = untouched), or null when nothing is painted.
+     */
+    onMaskChange: (mask: File | null) => void;
+    disabled?: boolean;
+    maskFileName?: string;
+    /** Sizes the image; defaults to fitting a dialog preview. */
+    imageClassName?: string;
+    className?: string;
+}
+declare const ImageMaskPainter: React.FC<IImageMaskPainterProps>;
+export default ImageMaskPainter;