@umodeapporg/ui 0.15.0 → 0.16.0

package/dist/components/Form/ControlledImage/index.d.ts

@@ -1,3 +1,4 @@
+import { TImageAiReviewHandler } from '../../UI/ImageAiAdjust/imageAiReview';
 import { TImageAiAdjuster } from '../../UI/ImageAiAdjust/useImageAiAdjust';
 export interface IControlledImageAiAdjust {
     adjustImage: TImageAiAdjuster;
@@ -5,6 +6,8 @@ export interface IControlledImageAiAdjust {
     onAdjusted: (file: File) => Promise<void> | void;
     /** Associates the generation with a product when the surface knows one. */
     productId?: string;
+    /** Receives approve/discard feedback when the adjuster returns a generationId. */
+    onReviewResult?: TImageAiReviewHandler;
 }
 interface IControlledImageProps {
     src: string | null | undefined;

package/dist/components/Form/ControlledImage/index.js

@@ -92,7 +92,8 @@ const ControlledImageContent = ({
           productId: aiAdjust.productId,
           adjustImage: aiAdjust.adjustImage,
           onClose: () => setAiAdjustOpen(false),
-          onSave: aiAdjust.onAdjusted
+          onSave: aiAdjust.onAdjusted,
+          onReviewResult: aiAdjust.onReviewResult
         }
       )
     ] })

package/dist/components/Form/ControlledImage/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Form/ControlledImage/index.tsx"],"sourcesContent":["import { lazy, Suspense, useState } from 'react';\nimport classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { TImageAiAdjuster } from '@/components/UI/ImageAiAdjust/useImageAiAdjust';\nimport ImagePlaceholder from '@/components/UI/ImagePlaceholder';\n\nimport ControlledButton from '../../Form/ControlledButton';\nimport LoadingSpinner from '../../UI/LoadingSpinner';\nimport { MaterialSymbol } from '../../UI/MaterialSymbol';\n\nimport Img from './Img';\n\n/**\n * Lazy por dois motivos: quebra o ciclo de import (o diálogo de IA renderiza um\n * `ControlledImage` no comparativo) e mantém os dois editores fora do bundle de quem só\n * exibe imagem, que é quase toda a aplicação.\n */\nconst ImageAnnotationDialog = lazy(() => import('@/components/UI/ImageAnnotator/ImageAnnotationDialog'));\nconst ImageAiAdjustDialog = lazy(() => import('@/components/UI/ImageAiAdjust/ImageAiAdjustDialog'));\n\nexport interface IControlledImageAiAdjust {\n  adjustImage: TImageAiAdjuster;\n  /** Receives the adjusted image; resolving closes the dialog, throwing keeps it open. */\n  onAdjusted: (file: File) => Promise<void> | void;\n  /** Associates the generation with a product when the surface knows one. */\n  productId?: string;\n}\n\ninterface IControlledImageProps {\n  src: string | null | undefined;\n  fallbackSrc?: string;\n  className?: string;\n  tooltip?: string;\n  onClickHook?: () => void;\n  /**\n   * Opts into the annotation flow (pencil overlay + editor). Hosts own what happens to the\n   * annotated file, so enabling it here never conflicts with other image click behaviors.\n   */\n  annotatable?: boolean;\n  /** Receives the annotated image; resolving closes the editor, throwing keeps it open. */\n  onAnnotated?: (file: File) => Promise<void> | void;\n  annotationFileName?: string;\n  /**\n   * Opts into the AI adjustment flow. Sibling of `annotatable`, same contract: the host owns the\n   * resulting file, and decides whether the feature is available at all.\n   */\n  aiAdjust?: IControlledImageAiAdjust;\n}\n\nconst ControlledImageContent: React.FC<IControlledImageProps> = ({\n  src,\n  fallbackSrc,\n  className,\n  tooltip,\n  onClickHook,\n  annotatable = false,\n  onAnnotated,\n  annotationFileName,\n  aiAdjust,\n}) => {\n  const { t } = useTranslation('ui');\n  const [annotatorOpen, setAnnotatorOpen] = useState(false);\n  const [aiAdjustOpen, setAiAdjustOpen] = useState(false);\n\n  const renderImage = () => {\n    if (!src) return <ImagePlaceholder className={className} />;\n\n    return (\n      <Img\n        onClick={onClickHook}\n        key={src}\n        src={src}\n        fallbackSrc={fallbackSrc}\n        className={className}\n        loader={\n          <div className={classNames('flex size-full items-center justify-center bg-muted', className)}>\n            <LoadingSpinner size={6} />\n          </div>\n        }\n        unloader={<ImagePlaceholder variant=\"broken\" className={className} />}\n      />\n    );\n  };\n\n  const image = tooltip ? <ControlledTooltip content={tooltip}>{renderImage()}</ControlledTooltip> : renderImage();\n\n  const showAnnotate = annotatable && Boolean(onAnnotated) && Boolean(src);\n  const showAiAdjust = Boolean(aiAdjust) && Boolean(src);\n\n  if (!src || (!showAnnotate && !showAiAdjust)) return image;\n\n  const overlayButtonClass =\n    'flex size-8 items-center justify-center rounded-full bg-scrim text-white transition-colors glass-tint hover:bg-scrim';\n\n  return (\n    <span className=\"relative inline-flex max-w-full\">\n      {image}\n\n      <span className=\"absolute right-2 top-2 flex items-center gap-x-1\">\n        {showAnnotate && (\n          <ControlledTooltip content={t('imageAnnotator.annotate')} className=\"z-[9999]\">\n            <ControlledButton\n              defaultHtmlButton\n              onClick={(event: React.MouseEvent) => {\n                event.stopPropagation();\n                setAnnotatorOpen(true);\n              }}\n              className={overlayButtonClass}\n            >\n              <MaterialSymbol icon=\"edit\" size={16} color=\"white\" />\n            </ControlledButton>\n          </ControlledTooltip>\n        )}\n\n        {showAiAdjust && (\n          <ControlledTooltip content={t('imageAiAdjust.action')} className=\"z-[9999]\">\n            <ControlledButton\n              defaultHtmlButton\n              onClick={(event: React.MouseEvent) => {\n                event.stopPropagation();\n                setAiAdjustOpen(true);\n              }}\n              className={overlayButtonClass}\n            >\n              <MaterialSymbol icon=\"auto_fix_high\" size={16} color=\"white\" />\n            </ControlledButton>\n          </ControlledTooltip>\n        )}\n      </span>\n\n      <Suspense fallback={null}>\n        {annotatorOpen && onAnnotated && (\n          <ImageAnnotationDialog\n            open={annotatorOpen}\n            imageUrl={src}\n            imageName={annotationFileName}\n            onClose={() => setAnnotatorOpen(false)}\n            onSave={onAnnotated}\n          />\n        )}\n\n        {aiAdjustOpen && aiAdjust && (\n          <ImageAiAdjustDialog\n            open={aiAdjustOpen}\n            imageUrl={src}\n            imageName={annotationFileName}\n            productId={aiAdjust.productId}\n            adjustImage={aiAdjust.adjustImage}\n            onClose={() => setAiAdjustOpen(false)}\n            onSave={aiAdjust.onAdjusted}\n          />\n        )}\n      </Suspense>\n    </span>\n  );\n};\n\nconst ControlledImage: React.FC<IControlledImageProps> = (props) => {\n  return <ControlledImageContent {...props} />;\n};\n\nexport default ControlledImage;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Form/ControlledImage/index.tsx"],"sourcesContent":["import { lazy, Suspense, useState } from 'react';\nimport classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport ControlledTooltip from '@/components/UI/ControlledTooltip';\nimport { TImageAiReviewHandler } from '@/components/UI/ImageAiAdjust/imageAiReview';\nimport { TImageAiAdjuster } from '@/components/UI/ImageAiAdjust/useImageAiAdjust';\nimport ImagePlaceholder from '@/components/UI/ImagePlaceholder';\n\nimport ControlledButton from '../../Form/ControlledButton';\nimport LoadingSpinner from '../../UI/LoadingSpinner';\nimport { MaterialSymbol } from '../../UI/MaterialSymbol';\n\nimport Img from './Img';\n\n/**\n * Lazy por dois motivos: quebra o ciclo de import (o diálogo de IA renderiza um\n * `ControlledImage` no comparativo) e mantém os dois editores fora do bundle de quem só\n * exibe imagem, que é quase toda a aplicação.\n */\nconst ImageAnnotationDialog = lazy(() => import('@/components/UI/ImageAnnotator/ImageAnnotationDialog'));\nconst ImageAiAdjustDialog = lazy(() => import('@/components/UI/ImageAiAdjust/ImageAiAdjustDialog'));\n\nexport interface IControlledImageAiAdjust {\n  adjustImage: TImageAiAdjuster;\n  /** Receives the adjusted image; resolving closes the dialog, throwing keeps it open. */\n  onAdjusted: (file: File) => Promise<void> | void;\n  /** Associates the generation with a product when the surface knows one. */\n  productId?: string;\n  /** Receives approve/discard feedback when the adjuster returns a generationId. */\n  onReviewResult?: TImageAiReviewHandler;\n}\n\ninterface IControlledImageProps {\n  src: string | null | undefined;\n  fallbackSrc?: string;\n  className?: string;\n  tooltip?: string;\n  onClickHook?: () => void;\n  /**\n   * Opts into the annotation flow (pencil overlay + editor). Hosts own what happens to the\n   * annotated file, so enabling it here never conflicts with other image click behaviors.\n   */\n  annotatable?: boolean;\n  /** Receives the annotated image; resolving closes the editor, throwing keeps it open. */\n  onAnnotated?: (file: File) => Promise<void> | void;\n  annotationFileName?: string;\n  /**\n   * Opts into the AI adjustment flow. Sibling of `annotatable`, same contract: the host owns the\n   * resulting file, and decides whether the feature is available at all.\n   */\n  aiAdjust?: IControlledImageAiAdjust;\n}\n\nconst ControlledImageContent: React.FC<IControlledImageProps> = ({\n  src,\n  fallbackSrc,\n  className,\n  tooltip,\n  onClickHook,\n  annotatable = false,\n  onAnnotated,\n  annotationFileName,\n  aiAdjust,\n}) => {\n  const { t } = useTranslation('ui');\n  const [annotatorOpen, setAnnotatorOpen] = useState(false);\n  const [aiAdjustOpen, setAiAdjustOpen] = useState(false);\n\n  const renderImage = () => {\n    if (!src) return <ImagePlaceholder className={className} />;\n\n    return (\n      <Img\n        onClick={onClickHook}\n        key={src}\n        src={src}\n        fallbackSrc={fallbackSrc}\n        className={className}\n        loader={\n          <div className={classNames('flex size-full items-center justify-center bg-muted', className)}>\n            <LoadingSpinner size={6} />\n          </div>\n        }\n        unloader={<ImagePlaceholder variant=\"broken\" className={className} />}\n      />\n    );\n  };\n\n  const image = tooltip ? <ControlledTooltip content={tooltip}>{renderImage()}</ControlledTooltip> : renderImage();\n\n  const showAnnotate = annotatable && Boolean(onAnnotated) && Boolean(src);\n  const showAiAdjust = Boolean(aiAdjust) && Boolean(src);\n\n  if (!src || (!showAnnotate && !showAiAdjust)) return image;\n\n  const overlayButtonClass =\n    'flex size-8 items-center justify-center rounded-full bg-scrim text-white transition-colors glass-tint hover:bg-scrim';\n\n  return (\n    <span className=\"relative inline-flex max-w-full\">\n      {image}\n\n      <span className=\"absolute right-2 top-2 flex items-center gap-x-1\">\n        {showAnnotate && (\n          <ControlledTooltip content={t('imageAnnotator.annotate')} className=\"z-[9999]\">\n            <ControlledButton\n              defaultHtmlButton\n              onClick={(event: React.MouseEvent) => {\n                event.stopPropagation();\n                setAnnotatorOpen(true);\n              }}\n              className={overlayButtonClass}\n            >\n              <MaterialSymbol icon=\"edit\" size={16} color=\"white\" />\n            </ControlledButton>\n          </ControlledTooltip>\n        )}\n\n        {showAiAdjust && (\n          <ControlledTooltip content={t('imageAiAdjust.action')} className=\"z-[9999]\">\n            <ControlledButton\n              defaultHtmlButton\n              onClick={(event: React.MouseEvent) => {\n                event.stopPropagation();\n                setAiAdjustOpen(true);\n              }}\n              className={overlayButtonClass}\n            >\n              <MaterialSymbol icon=\"auto_fix_high\" size={16} color=\"white\" />\n            </ControlledButton>\n          </ControlledTooltip>\n        )}\n      </span>\n\n      <Suspense fallback={null}>\n        {annotatorOpen && onAnnotated && (\n          <ImageAnnotationDialog\n            open={annotatorOpen}\n            imageUrl={src}\n            imageName={annotationFileName}\n            onClose={() => setAnnotatorOpen(false)}\n            onSave={onAnnotated}\n          />\n        )}\n\n        {aiAdjustOpen && aiAdjust && (\n          <ImageAiAdjustDialog\n            open={aiAdjustOpen}\n            imageUrl={src}\n            imageName={annotationFileName}\n            productId={aiAdjust.productId}\n            adjustImage={aiAdjust.adjustImage}\n            onClose={() => setAiAdjustOpen(false)}\n            onSave={aiAdjust.onAdjusted}\n            onReviewResult={aiAdjust.onReviewResult}\n          />\n        )}\n      </Suspense>\n    </span>\n  );\n};\n\nconst ControlledImage: React.FC<IControlledImageProps> = (props) => {\n  return <ControlledImageContent {...props} />;\n};\n\nexport default ControlledImage;\n"],"names":[],"mappings":";;;;;;;;;;AAoBA,MAAM,wBAAwB,KAAK,MAAM,OAAO,kDAAsD,CAAC;AACvG,MAAM,sBAAsB,KAAK,MAAM,OAAO,+CAAmD,CAAC;AAiClG,MAAM,yBAA0D,CAAC;AAAA,EAC/D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,KAAK;AACxD,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEtD,QAAM,cAAc,MAAM;AACxB,QAAI,CAAC,IAAK,QAAO,oBAAC,oBAAiB,UAAA,CAAsB;AAEzD,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QAET;AAAA,QACA;AAAA,QACA;AAAA,QACA,QACE,oBAAC,OAAA,EAAI,WAAW,WAAW,uDAAuD,SAAS,GACzF,UAAA,oBAAC,gBAAA,EAAe,MAAM,EAAA,CAAG,GAC3B;AAAA,QAEF,UAAU,oBAAC,kBAAA,EAAiB,SAAQ,UAAS,UAAA,CAAsB;AAAA,MAAA;AAAA,MAT9D;AAAA,IAAA;AAAA,EAYX;AAEA,QAAM,QAAQ,UAAU,oBAAC,mBAAA,EAAkB,SAAS,SAAU,UAAA,cAAY,CAAE,IAAuB,YAAA;AAEnG,QAAM,eAAe,eAAe,QAAQ,WAAW,KAAK,QAAQ,GAAG;AACvE,QAAM,eAAe,QAAQ,QAAQ,KAAK,QAAQ,GAAG;AAErD,MAAI,CAAC,OAAQ,CAAC,gBAAgB,CAAC,aAAe,QAAO;AAErD,QAAM,qBACJ;AAEF,SACE,qBAAC,QAAA,EAAK,WAAU,mCACb,UAAA;AAAA,IAAA;AAAA,IAED,qBAAC,QAAA,EAAK,WAAU,oDACb,UAAA;AAAA,MAAA,oCACE,mBAAA,EAAkB,SAAS,EAAE,yBAAyB,GAAG,WAAU,YAClE,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,mBAAiB;AAAA,UACjB,SAAS,CAAC,UAA4B;AACpC,kBAAM,gBAAA;AACN,6BAAiB,IAAI;AAAA,UACvB;AAAA,UACA,WAAW;AAAA,UAEX,8BAAC,gBAAA,EAAe,MAAK,QAAO,MAAM,IAAI,OAAM,QAAA,CAAQ;AAAA,QAAA;AAAA,MAAA,GAExD;AAAA,MAGD,oCACE,mBAAA,EAAkB,SAAS,EAAE,sBAAsB,GAAG,WAAU,YAC/D,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,mBAAiB;AAAA,UACjB,SAAS,CAAC,UAA4B;AACpC,kBAAM,gBAAA;AACN,4BAAgB,IAAI;AAAA,UACtB;AAAA,UACA,WAAW;AAAA,UAEX,8BAAC,gBAAA,EAAe,MAAK,iBAAgB,MAAM,IAAI,OAAM,QAAA,CAAQ;AAAA,QAAA;AAAA,MAAA,EAC/D,CACF;AAAA,IAAA,GAEJ;AAAA,IAEA,qBAAC,UAAA,EAAS,UAAU,MACjB,UAAA;AAAA,MAAA,iBAAiB,eAChB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,UAAU;AAAA,UACV,WAAW;AAAA,UACX,SAAS,MAAM,iBAAiB,KAAK;AAAA,UACrC,QAAQ;AAAA,QAAA;AAAA,MAAA;AAAA,MAIX,gBAAgB,YACf;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAM;AAAA,UACN,UAAU;AAAA,UACV,WAAW;AAAA,UACX,WAAW,SAAS;AAAA,UACpB,aAAa,SAAS;AAAA,UACtB,SAAS,MAAM,gBAAgB,KAAK;AAAA,UACpC,QAAQ,SAAS;AAAA,UACjB,gBAAgB,SAAS;AAAA,QAAA;AAAA,MAAA;AAAA,IAC3B,EAAA,CAEJ;AAAA,EAAA,GACF;AAEJ;AAEA,MAAM,kBAAmD,CAAC,UAAU;AAClE,SAAO,oBAAC,wBAAA,EAAwB,GAAG,MAAA,CAAO;AAC5C;"}

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

@@ -1,3 +1,4 @@
+import { TImageAiReviewHandler } from './imageAiReview';
 import { TImageAiAdjuster } from './useImageAiAdjust';
 interface IImageAiAdjustDialogProps {
     open: boolean;
@@ -10,6 +11,11 @@ interface IImageAiAdjustDialogProps {
     onClose: () => void;
     /** Recebe a imagem ajustada; resolver fecha o diálogo, lançar mantém aberto. */
     onSave: (file: File) => Promise<void> | void;
+    /**
+     * Optional feedback sink. Only used when the adjuster resolved a `generationId`: using the
+     * result approves it, discarding asks for a reason first. Failures never block the flow.
+     */
+    onReviewResult?: TImageAiReviewHandler;
 }
 declare const ImageAiAdjustDialog: React.FC<IImageAiAdjustDialogProps>;
 export default ImageAiAdjustDialog;

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

@@ -1,4 +1,4 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useState } from "react";
 import classNames from "classnames";
 import { useTranslation } from "react-i18next";
@@ -6,12 +6,16 @@ import ControlledButton from "../../Form/ControlledButton.js";
 import ControlledDialog from "../../Form/ControlledDialog.js";
 import ControlledImage from "../../Form/ControlledImage/index.js";
 import ControlledTextarea from "../../Form/ControlledTextarea.js";
+import ImageMaskPainter from "../ImageMaskPainter/index.js";
 import LoadingSpinner from "../LoadingSpinner.js";
 import { MaterialSymbol } from "../MaterialSymbol/index.js";
 import { uiLogger } from "../../../helpers/uiLogger.js";
 import { useBreakpoint } from "../../../hooks/useBreakpoint.js";
 import { useNotification } from "../../../hooks/useNotification.js";
-import { useImageAiAdjust } from "./useImageAiAdjust.js";
+import ImageAiDiscardReasonDialog from "./ImageAiDiscardReasonDialog.js";
+import { submitImageAiReview } from "./imageAiReview.js";
+import ImageAiVerificationNotice from "./ImageAiVerificationNotice.js";
+import { useImageAiAdjust, IMAGE_AI_ADJUST_MAX_INSTRUCTIONS } from "./useImageAiAdjust.js";
 const ImageAiAdjustDialog = ({
   open,
   imageUrl,
@@ -19,28 +23,42 @@ const ImageAiAdjustDialog = ({
   productId,
   adjustImage,
   onClose,
-  onSave
+  onSave,
+  onReviewResult
 }) => {
   const { t } = useTranslation("ui");
   const { isTabletDown } = useBreakpoint();
   const { notify } = useNotification();
   const [saving, setSaving] = useState(false);
+  const [pendingDiscard, setPendingDiscard] = useState(null);
+  const [markingArea, setMarkingArea] = useState(false);
+  const [mask, setMask] = useState(null);
   const {
     instructions,
     setInstructions,
     resultUrl,
+    resultGenerationId,
+    resultVerification,
     isGenerating,
     canGenerate,
     generate,
     cancel,
     discardResult,
     buildResultFile
-  } = useImageAiAdjust({ imageUrl, imageName, productId, adjustImage });
+  } = useImageAiAdjust({ imageUrl, imageName, productId, adjustImage, mask: markingArea ? mask : null });
+  const toggleMarkingArea = () => {
+    if (markingArea) setMask(null);
+    setMarkingArea(!markingArea);
+  };
+  const reviewEnabled = Boolean(onReviewResult && resultGenerationId);
   const handleSave = async () => {
     if (!resultUrl || saving) return;
     setSaving(true);
     try {
       await onSave(await buildResultFile());
+      if (reviewEnabled && resultGenerationId) {
+        void submitImageAiReview(onReviewResult, { generationId: resultGenerationId, decision: "approved" });
+      }
       onClose();
     } catch (error) {
       uiLogger.error("Failed to save the AI adjusted image", error);
@@ -49,8 +67,39 @@ const ImageAiAdjustDialog = ({
       setSaving(false);
     }
   };
+  const handleTryAgain = () => {
+    if (reviewEnabled) {
+      setPendingDiscard("tryAgain");
+      return;
+    }
+    discardResult();
+  };
+  const handleGenerate = () => {
+    if (reviewEnabled && resultUrl) {
+      setPendingDiscard("regenerate");
+      return;
+    }
+    void generate();
+  };
+  const handleDiscardConfirmed = ({ reasonCode, reason }) => {
+    const action = pendingDiscard;
+    setPendingDiscard(null);
+    if (resultGenerationId) {
+      void submitImageAiReview(onReviewResult, {
+        generationId: resultGenerationId,
+        decision: "discarded",
+        reasonCode,
+        reason
+      });
+    }
+    if (action === "regenerate") {
+      void generate();
+      return;
+    }
+    discardResult();
+  };
   const previewClass = "max-h-[38vh] w-auto max-w-full rounded-lg object-contain";
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsxs(
     ControlledDialog,
     {
       open,
@@ -60,81 +109,122 @@ const ImageAiAdjustDialog = ({
       onCancel: onClose,
       useFooter: false,
       fitBody: true,
-      children: /* @__PURE__ */ jsxs("div", { className: "flex max-h-[76vh] flex-col gap-y-3 overflow-y-auto", children: [
-        /* @__PURE__ */ jsxs("div", { className: classNames("flex gap-3", isTabletDown ? "flex-col" : "flex-row"), children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-y-1.5", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-xxs font-semibold uppercase tracking-wide text-foreground-subtle", children: t("imageAiAdjust.original") }),
-            /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center rounded-xl bg-ink/95 p-2", children: /* @__PURE__ */ jsx(ControlledImage, { src: imageUrl, className: previewClass }) })
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-y-1.5", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-xxs font-semibold uppercase tracking-wide text-foreground-subtle", children: t("imageAiAdjust.result") }),
-            /* @__PURE__ */ jsxs("div", { className: "flex min-h-40 items-center justify-center rounded-xl bg-ink/95 p-2", children: [
-              isGenerating && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-y-2 p-4", children: [
-                /* @__PURE__ */ jsx(LoadingSpinner, { size: 8, color: "white" }),
-                /* @__PURE__ */ jsx("span", { className: "text-center text-xs text-white", children: t("imageAiAdjust.generating") })
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex max-h-[76vh] flex-col gap-y-3 overflow-y-auto", children: [
+          /* @__PURE__ */ jsxs("div", { className: classNames("flex gap-3", isTabletDown ? "flex-col" : "flex-row"), children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-y-1.5", children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
+                /* @__PURE__ */ jsx("span", { className: "text-xxs font-semibold uppercase tracking-wide text-foreground-subtle", children: t("imageAiAdjust.original") }),
+                /* @__PURE__ */ jsxs(
+                  ControlledButton,
+                  {
+                    size: "sm",
+                    variant: "text",
+                    tone: markingArea ? "brand" : "neutral",
+                    "aria-pressed": markingArea,
+                    disabled: isGenerating || saving,
+                    onClick: toggleMarkingArea,
+                    className: "flex items-center gap-x-1.5 px-2 py-1 normal-case",
+                    children: [
+                      /* @__PURE__ */ jsx(MaterialSymbol, { "aria-hidden": true, icon: markingArea ? "close" : "brush", size: 14 }),
+                      markingArea ? t("imageAiAdjust.mask.stop") : t("imageAiAdjust.mask.start")
+                    ]
+                  }
+                )
               ] }),
-              !isGenerating && resultUrl && /* @__PURE__ */ jsx(ControlledImage, { src: resultUrl, className: previewClass }),
-              !isGenerating && !resultUrl && /* @__PURE__ */ jsx("span", { className: "max-w-64 p-4 text-center text-xs text-white/70", children: t("imageAiAdjust.resultHint") })
+              markingArea ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx("span", { className: "text-xs text-foreground-muted", children: t("imageAiAdjust.mask.hint") }),
+                /* @__PURE__ */ jsx(
+                  ImageMaskPainter,
+                  {
+                    imageUrl,
+                    disabled: isGenerating || saving,
+                    onMaskChange: setMask,
+                    imageClassName: previewClass
+                  }
+                )
+              ] }) : /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center rounded-xl bg-ink/95 p-2", children: /* @__PURE__ */ jsx(ControlledImage, { src: imageUrl, className: previewClass }) })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-y-1.5", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-xxs font-semibold uppercase tracking-wide text-foreground-subtle", children: t("imageAiAdjust.result") }),
+              /* @__PURE__ */ jsxs("div", { className: "flex min-h-40 items-center justify-center rounded-xl bg-ink/95 p-2", children: [
+                isGenerating && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-y-2 p-4", children: [
+                  /* @__PURE__ */ jsx(LoadingSpinner, { size: 8, color: "white" }),
+                  /* @__PURE__ */ jsx("span", { className: "text-center text-xs text-white", children: t("imageAiAdjust.generating") })
+                ] }),
+                !isGenerating && resultUrl && /* @__PURE__ */ jsx(ControlledImage, { src: resultUrl, className: previewClass }),
+                !isGenerating && !resultUrl && /* @__PURE__ */ jsx("span", { className: "max-w-64 p-4 text-center text-xs text-white/70", children: t("imageAiAdjust.resultHint") })
+              ] }),
+              !isGenerating && resultUrl && /* @__PURE__ */ jsx(ImageAiVerificationNotice, { verification: resultVerification })
             ] })
-          ] })
+          ] }),
+          /* @__PURE__ */ jsx(
+            ControlledTextarea,
+            {
+              resize: "none",
+              value: instructions,
+              rows: 3,
+              maxLength: IMAGE_AI_ADJUST_MAX_INSTRUCTIONS,
+              disabled: isGenerating || saving,
+              "aria-label": t("imageAiAdjust.promptLabel"),
+              placeholder: t("imageAiAdjust.promptPlaceholder"),
+              onChange: (event) => setInstructions(event.target.value),
+              className: "rounded-xl"
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-end gap-2", children: isGenerating ? /* @__PURE__ */ jsx(ControlledButton, { size: "sm", variant: "outlined", onClick: cancel, className: "normal-case", children: t("actions.cancel") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            resultUrl && /* @__PURE__ */ jsxs(
+              ControlledButton,
+              {
+                size: "sm",
+                variant: "outlined",
+                disabled: saving,
+                onClick: handleTryAgain,
+                className: "flex items-center gap-x-1.5 normal-case",
+                children: [
+                  /* @__PURE__ */ jsx(MaterialSymbol, { icon: "refresh", size: 14 }),
+                  t("imageAiAdjust.tryAgain")
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              ControlledButton,
+              {
+                size: "sm",
+                variant: resultUrl ? "outlined" : "filled",
+                disabled: !canGenerate || saving,
+                onClick: handleGenerate,
+                className: "flex items-center gap-x-1.5 normal-case",
+                children: [
+                  /* @__PURE__ */ jsx(MaterialSymbol, { icon: "auto_fix_high", size: 14 }),
+                  t("imageAiAdjust.generate")
+                ]
+              }
+            ),
+            resultUrl && /* @__PURE__ */ jsxs(
+              ControlledButton,
+              {
+                size: "sm",
+                disabled: saving,
+                onClick: handleSave,
+                className: "flex items-center gap-x-1.5 normal-case",
+                children: [
+                  saving ? /* @__PURE__ */ jsx(LoadingSpinner, { size: 4, color: "white" }) : /* @__PURE__ */ jsx(MaterialSymbol, { icon: "check", size: 14, color: "white" }),
+                  t("imageAiAdjust.useResult")
+                ]
+              }
+            )
+          ] }) })
         ] }),
         /* @__PURE__ */ jsx(
-          ControlledTextarea,
+          ImageAiDiscardReasonDialog,
           {
-            resize: "none",
-            value: instructions,
-            rows: 3,
-            disabled: isGenerating || saving,
-            "aria-label": t("imageAiAdjust.promptLabel"),
-            placeholder: t("imageAiAdjust.promptPlaceholder"),
-            onChange: (event) => setInstructions(event.target.value),
-            className: "rounded-xl"
+            open: pendingDiscard !== null,
+            onCancel: () => setPendingDiscard(null),
+            onConfirm: handleDiscardConfirmed
           }
-        ),
-        /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center justify-end gap-2", children: isGenerating ? /* @__PURE__ */ jsx(ControlledButton, { size: "sm", variant: "outlined", onClick: cancel, className: "normal-case", children: t("actions.cancel") }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-          resultUrl && /* @__PURE__ */ jsxs(
-            ControlledButton,
-            {
-              size: "sm",
-              variant: "outlined",
-              disabled: saving,
-              onClick: discardResult,
-              className: "flex items-center gap-x-1.5 normal-case",
-              children: [
-                /* @__PURE__ */ jsx(MaterialSymbol, { icon: "refresh", size: 14 }),
-                t("imageAiAdjust.tryAgain")
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            ControlledButton,
-            {
-              size: "sm",
-              variant: resultUrl ? "outlined" : "filled",
-              disabled: !canGenerate || saving,
-              onClick: generate,
-              className: "flex items-center gap-x-1.5 normal-case",
-              children: [
-                /* @__PURE__ */ jsx(MaterialSymbol, { icon: "auto_fix_high", size: 14 }),
-                t("imageAiAdjust.generate")
-              ]
-            }
-          ),
-          resultUrl && /* @__PURE__ */ jsxs(
-            ControlledButton,
-            {
-              size: "sm",
-              disabled: saving,
-              onClick: handleSave,
-              className: "flex items-center gap-x-1.5 normal-case",
-              children: [
-                saving ? /* @__PURE__ */ jsx(LoadingSpinner, { size: 4, color: "white" }) : /* @__PURE__ */ jsx(MaterialSymbol, { icon: "check", size: 14, color: "white" }),
-                t("imageAiAdjust.useResult")
-              ]
-            }
-          )
-        ] }) })
-      ] })
+        )
+      ]
     }
   );
 };

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

@@ -1 +1 @@
-{"version":3,"file":"ImageAiAdjustDialog.js","sources":["../../../../src/components/UI/ImageAiAdjust/ImageAiAdjustDialog.tsx"],"sourcesContent":["import { useState } from 'react';\nimport classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport ControlledButton from '@/components/Form/ControlledButton';\nimport ControlledDialog from '@/components/Form/ControlledDialog';\nimport ControlledImage from '@/components/Form/ControlledImage';\nimport ControlledTextarea from '@/components/Form/ControlledTextarea';\nimport LoadingSpinner from '@/components/UI/LoadingSpinner';\nimport { MaterialSymbol } from '@/components/UI/MaterialSymbol';\nimport { uiLogger } from '@/helpers/uiLogger';\nimport { useBreakpoint } from '@/hooks/useBreakpoint';\nimport { useNotification } from '@/hooks/useNotification';\n\nimport { TImageAiAdjuster, useImageAiAdjust } from './useImageAiAdjust';\n\ninterface IImageAiAdjustDialogProps {\n  open: boolean;\n  imageUrl: string;\n  imageName?: string;\n  /** Opcional: quando existe, a geração fica associada ao produto no criAI. */\n  productId?: string;\n  /** Runs the generation; the host decides which AI backend serves it. */\n  adjustImage: TImageAiAdjuster;\n  onClose: () => void;\n  /** Recebe a imagem ajustada; resolver fecha o diálogo, lançar mantém aberto. */\n  onSave: (file: File) => Promise<void> | void;\n}\n\nconst ImageAiAdjustDialog: React.FC<IImageAiAdjustDialogProps> = ({\n  open,\n  imageUrl,\n  imageName,\n  productId,\n  adjustImage,\n  onClose,\n  onSave,\n}) => {\n  const { t } = useTranslation('ui');\n  const { isTabletDown } = useBreakpoint();\n  const { notify } = useNotification();\n\n  const [saving, setSaving] = useState(false);\n  const {\n    instructions,\n    setInstructions,\n    resultUrl,\n    isGenerating,\n    canGenerate,\n    generate,\n    cancel,\n    discardResult,\n    buildResultFile,\n  } = useImageAiAdjust({ imageUrl, imageName, productId, adjustImage });\n\n  const handleSave = async () => {\n    if (!resultUrl || saving) return;\n\n    setSaving(true);\n    try {\n      await onSave(await buildResultFile());\n      onClose();\n    } catch (error) {\n      uiLogger.error('Failed to save the AI adjusted image', error);\n      notify({ message: t('imageAiAdjust.errorSave'), type: 'error' });\n    } finally {\n      setSaving(false);\n    }\n  };\n\n  const previewClass = 'max-h-[38vh] w-auto max-w-full rounded-lg object-contain';\n\n  return (\n    <ControlledDialog\n      open={open}\n      size={isTabletDown ? 'xxl' : 'lg'}\n      title={t('imageAiAdjust.title')}\n      subtitle={t('imageAiAdjust.subtitle')}\n      onCancel={onClose}\n      useFooter={false}\n      fitBody\n    >\n      <div className=\"flex max-h-[76vh] flex-col gap-y-3 overflow-y-auto\">\n        <div className={classNames('flex gap-3', isTabletDown ? 'flex-col' : 'flex-row')}>\n          <div className=\"flex min-w-0 flex-1 flex-col gap-y-1.5\">\n            <span className=\"text-xxs font-semibold uppercase tracking-wide text-foreground-subtle\">\n              {t('imageAiAdjust.original')}\n            </span>\n            <div className=\"flex items-center justify-center rounded-xl bg-ink/95 p-2\">\n              <ControlledImage src={imageUrl} className={previewClass} />\n            </div>\n          </div>\n\n          <div className=\"flex min-w-0 flex-1 flex-col gap-y-1.5\">\n            <span className=\"text-xxs font-semibold uppercase tracking-wide text-foreground-subtle\">\n              {t('imageAiAdjust.result')}\n            </span>\n            <div className=\"flex min-h-40 items-center justify-center rounded-xl bg-ink/95 p-2\">\n              {isGenerating && (\n                <div className=\"flex flex-col items-center gap-y-2 p-4\">\n                  <LoadingSpinner size={8} color=\"white\" />\n                  <span className=\"text-center text-xs text-white\">{t('imageAiAdjust.generating')}</span>\n                </div>\n              )}\n\n              {!isGenerating && resultUrl && <ControlledImage src={resultUrl} className={previewClass} />}\n\n              {!isGenerating && !resultUrl && (\n                <span className=\"max-w-64 p-4 text-center text-xs text-white/70\">{t('imageAiAdjust.resultHint')}</span>\n              )}\n            </div>\n          </div>\n        </div>\n\n        <ControlledTextarea\n          resize=\"none\"\n          value={instructions}\n          rows={3}\n          disabled={isGenerating || saving}\n          aria-label={t('imageAiAdjust.promptLabel')}\n          placeholder={t('imageAiAdjust.promptPlaceholder')}\n          onChange={(event) => setInstructions(event.target.value)}\n          className=\"rounded-xl\"\n        />\n\n        <div className=\"flex flex-wrap items-center justify-end gap-2\">\n          {isGenerating ? (\n            <ControlledButton size=\"sm\" variant=\"outlined\" onClick={cancel} className=\"normal-case\">\n              {t('actions.cancel')}\n            </ControlledButton>\n          ) : (\n            <>\n              {resultUrl && (\n                <ControlledButton\n                  size=\"sm\"\n                  variant=\"outlined\"\n                  disabled={saving}\n                  onClick={discardResult}\n                  className=\"flex items-center gap-x-1.5 normal-case\"\n                >\n                  <MaterialSymbol icon=\"refresh\" size={14} />\n                  {t('imageAiAdjust.tryAgain')}\n                </ControlledButton>\n              )}\n\n              <ControlledButton\n                size=\"sm\"\n                variant={resultUrl ? 'outlined' : 'filled'}\n                disabled={!canGenerate || saving}\n                onClick={generate}\n                className=\"flex items-center gap-x-1.5 normal-case\"\n              >\n                <MaterialSymbol icon=\"auto_fix_high\" size={14} />\n                {t('imageAiAdjust.generate')}\n              </ControlledButton>\n\n              {resultUrl && (\n                <ControlledButton\n                  size=\"sm\"\n                  disabled={saving}\n                  onClick={handleSave}\n                  className=\"flex items-center gap-x-1.5 normal-case\"\n                >\n                  {saving ? (\n                    <LoadingSpinner size={4} color=\"white\" />\n                  ) : (\n                    <MaterialSymbol icon=\"check\" size={14} color=\"white\" />\n                  )}\n                  {t('imageAiAdjust.useResult')}\n                </ControlledButton>\n              )}\n            </>\n          )}\n        </div>\n      </div>\n    </ControlledDialog>\n  );\n};\n\nexport default ImageAiAdjustDialog;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ImageAiAdjustDialog.js","sources":["../../../../src/components/UI/ImageAiAdjust/ImageAiAdjustDialog.tsx"],"sourcesContent":["import { useState } from 'react';\nimport classNames from 'classnames';\nimport { useTranslation } from 'react-i18next';\n\nimport ControlledButton from '@/components/Form/ControlledButton';\nimport ControlledDialog from '@/components/Form/ControlledDialog';\nimport ControlledImage from '@/components/Form/ControlledImage';\nimport ControlledTextarea from '@/components/Form/ControlledTextarea';\nimport ImageMaskPainter from '@/components/UI/ImageMaskPainter';\nimport LoadingSpinner from '@/components/UI/LoadingSpinner';\nimport { MaterialSymbol } from '@/components/UI/MaterialSymbol';\nimport { uiLogger } from '@/helpers/uiLogger';\nimport { useBreakpoint } from '@/hooks/useBreakpoint';\nimport { useNotification } from '@/hooks/useNotification';\n\nimport ImageAiDiscardReasonDialog from './ImageAiDiscardReasonDialog';\nimport { IImageAiDiscardReason, submitImageAiReview, TImageAiReviewHandler } from './imageAiReview';\nimport ImageAiVerificationNotice from './ImageAiVerificationNotice';\nimport { IMAGE_AI_ADJUST_MAX_INSTRUCTIONS, TImageAiAdjuster, useImageAiAdjust } from './useImageAiAdjust';\n\ntype TPendingDiscard = 'tryAgain' | 'regenerate';\n\ninterface IImageAiAdjustDialogProps {\n  open: boolean;\n  imageUrl: string;\n  imageName?: string;\n  /** Opcional: quando existe, a geração fica associada ao produto no criAI. */\n  productId?: string;\n  /** Runs the generation; the host decides which AI backend serves it. */\n  adjustImage: TImageAiAdjuster;\n  onClose: () => void;\n  /** Recebe a imagem ajustada; resolver fecha o diálogo, lançar mantém aberto. */\n  onSave: (file: File) => Promise<void> | void;\n  /**\n   * Optional feedback sink. Only used when the adjuster resolved a `generationId`: using the\n   * result approves it, discarding asks for a reason first. Failures never block the flow.\n   */\n  onReviewResult?: TImageAiReviewHandler;\n}\n\nconst ImageAiAdjustDialog: React.FC<IImageAiAdjustDialogProps> = ({\n  open,\n  imageUrl,\n  imageName,\n  productId,\n  adjustImage,\n  onClose,\n  onSave,\n  onReviewResult,\n}) => {\n  const { t } = useTranslation('ui');\n  const { isTabletDown } = useBreakpoint();\n  const { notify } = useNotification();\n\n  const [saving, setSaving] = useState(false);\n  const [pendingDiscard, setPendingDiscard] = useState<TPendingDiscard | null>(null);\n  const [markingArea, setMarkingArea] = useState(false);\n  const [mask, setMask] = useState<File | null>(null);\n  const {\n    instructions,\n    setInstructions,\n    resultUrl,\n    resultGenerationId,\n    resultVerification,\n    isGenerating,\n    canGenerate,\n    generate,\n    cancel,\n    discardResult,\n    buildResultFile,\n  } = useImageAiAdjust({ imageUrl, imageName, productId, adjustImage, mask: markingArea ? mask : null });\n\n  const toggleMarkingArea = () => {\n    if (markingArea) setMask(null);\n    setMarkingArea(!markingArea);\n  };\n\n  const reviewEnabled = Boolean(onReviewResult && resultGenerationId);\n\n  const handleSave = async () => {\n    if (!resultUrl || saving) return;\n\n    setSaving(true);\n    try {\n      await onSave(await buildResultFile());\n      if (reviewEnabled && resultGenerationId) {\n        void submitImageAiReview(onReviewResult, { generationId: resultGenerationId, decision: 'approved' });\n      }\n      onClose();\n    } catch (error) {\n      uiLogger.error('Failed to save the AI adjusted image', error);\n      notify({ message: t('imageAiAdjust.errorSave'), type: 'error' });\n    } finally {\n      setSaving(false);\n    }\n  };\n\n  const handleTryAgain = () => {\n    if (reviewEnabled) {\n      setPendingDiscard('tryAgain');\n      return;\n    }\n    discardResult();\n  };\n\n  const handleGenerate = () => {\n    if (reviewEnabled && resultUrl) {\n      setPendingDiscard('regenerate');\n      return;\n    }\n    void generate();\n  };\n\n  const handleDiscardConfirmed = ({ reasonCode, reason }: IImageAiDiscardReason) => {\n    const action = pendingDiscard;\n    setPendingDiscard(null);\n    if (resultGenerationId) {\n      void submitImageAiReview(onReviewResult, {\n        generationId: resultGenerationId,\n        decision: 'discarded',\n        reasonCode,\n        reason,\n      });\n    }\n    if (action === 'regenerate') {\n      void generate();\n      return;\n    }\n    discardResult();\n  };\n\n  const previewClass = 'max-h-[38vh] w-auto max-w-full rounded-lg object-contain';\n\n  return (\n    <ControlledDialog\n      open={open}\n      size={isTabletDown ? 'xxl' : 'lg'}\n      title={t('imageAiAdjust.title')}\n      subtitle={t('imageAiAdjust.subtitle')}\n      onCancel={onClose}\n      useFooter={false}\n      fitBody\n    >\n      <div className=\"flex max-h-[76vh] flex-col gap-y-3 overflow-y-auto\">\n        <div className={classNames('flex gap-3', isTabletDown ? 'flex-col' : 'flex-row')}>\n          <div className=\"flex min-w-0 flex-1 flex-col gap-y-1.5\">\n            <div className=\"flex flex-wrap items-center justify-between gap-2\">\n              <span className=\"text-xxs font-semibold uppercase tracking-wide text-foreground-subtle\">\n                {t('imageAiAdjust.original')}\n              </span>\n              <ControlledButton\n                size=\"sm\"\n                variant=\"text\"\n                tone={markingArea ? 'brand' : 'neutral'}\n                aria-pressed={markingArea}\n                disabled={isGenerating || saving}\n                onClick={toggleMarkingArea}\n                className=\"flex items-center gap-x-1.5 px-2 py-1 normal-case\"\n              >\n                <MaterialSymbol aria-hidden icon={markingArea ? 'close' : 'brush'} size={14} />\n                {markingArea ? t('imageAiAdjust.mask.stop') : t('imageAiAdjust.mask.start')}\n              </ControlledButton>\n            </div>\n            {markingArea ? (\n              <>\n                <span className=\"text-xs text-foreground-muted\">{t('imageAiAdjust.mask.hint')}</span>\n                <ImageMaskPainter\n                  imageUrl={imageUrl}\n                  disabled={isGenerating || saving}\n                  onMaskChange={setMask}\n                  imageClassName={previewClass}\n                />\n              </>\n            ) : (\n              <div className=\"flex items-center justify-center rounded-xl bg-ink/95 p-2\">\n                <ControlledImage src={imageUrl} className={previewClass} />\n              </div>\n            )}\n          </div>\n\n          <div className=\"flex min-w-0 flex-1 flex-col gap-y-1.5\">\n            <span className=\"text-xxs font-semibold uppercase tracking-wide text-foreground-subtle\">\n              {t('imageAiAdjust.result')}\n            </span>\n            <div className=\"flex min-h-40 items-center justify-center rounded-xl bg-ink/95 p-2\">\n              {isGenerating && (\n                <div className=\"flex flex-col items-center gap-y-2 p-4\">\n                  <LoadingSpinner size={8} color=\"white\" />\n                  <span className=\"text-center text-xs text-white\">{t('imageAiAdjust.generating')}</span>\n                </div>\n              )}\n\n              {!isGenerating && resultUrl && <ControlledImage src={resultUrl} className={previewClass} />}\n\n              {!isGenerating && !resultUrl && (\n                <span className=\"max-w-64 p-4 text-center text-xs text-white/70\">{t('imageAiAdjust.resultHint')}</span>\n              )}\n            </div>\n            {!isGenerating && resultUrl && <ImageAiVerificationNotice verification={resultVerification} />}\n          </div>\n        </div>\n\n        <ControlledTextarea\n          resize=\"none\"\n          value={instructions}\n          rows={3}\n          maxLength={IMAGE_AI_ADJUST_MAX_INSTRUCTIONS}\n          disabled={isGenerating || saving}\n          aria-label={t('imageAiAdjust.promptLabel')}\n          placeholder={t('imageAiAdjust.promptPlaceholder')}\n          onChange={(event) => setInstructions(event.target.value)}\n          className=\"rounded-xl\"\n        />\n\n        <div className=\"flex flex-wrap items-center justify-end gap-2\">\n          {isGenerating ? (\n            <ControlledButton size=\"sm\" variant=\"outlined\" onClick={cancel} className=\"normal-case\">\n              {t('actions.cancel')}\n            </ControlledButton>\n          ) : (\n            <>\n              {resultUrl && (\n                <ControlledButton\n                  size=\"sm\"\n                  variant=\"outlined\"\n                  disabled={saving}\n                  onClick={handleTryAgain}\n                  className=\"flex items-center gap-x-1.5 normal-case\"\n                >\n                  <MaterialSymbol icon=\"refresh\" size={14} />\n                  {t('imageAiAdjust.tryAgain')}\n                </ControlledButton>\n              )}\n\n              <ControlledButton\n                size=\"sm\"\n                variant={resultUrl ? 'outlined' : 'filled'}\n                disabled={!canGenerate || saving}\n                onClick={handleGenerate}\n                className=\"flex items-center gap-x-1.5 normal-case\"\n              >\n                <MaterialSymbol icon=\"auto_fix_high\" size={14} />\n                {t('imageAiAdjust.generate')}\n              </ControlledButton>\n\n              {resultUrl && (\n                <ControlledButton\n                  size=\"sm\"\n                  disabled={saving}\n                  onClick={handleSave}\n                  className=\"flex items-center gap-x-1.5 normal-case\"\n                >\n                  {saving ? (\n                    <LoadingSpinner size={4} color=\"white\" />\n                  ) : (\n                    <MaterialSymbol icon=\"check\" size={14} color=\"white\" />\n                  )}\n                  {t('imageAiAdjust.useResult')}\n                </ControlledButton>\n              )}\n            </>\n          )}\n        </div>\n      </div>\n\n      <ImageAiDiscardReasonDialog\n        open={pendingDiscard !== null}\n        onCancel={() => setPendingDiscard(null)}\n        onConfirm={handleDiscardConfirmed}\n      />\n    </ControlledDialog>\n  );\n};\n\nexport default ImageAiAdjustDialog;\n"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,8 @@
+import { IImageAiDiscardReason } from './imageAiReview';
+interface IImageAiDiscardReasonDialogProps {
+    open: boolean;
+    onCancel: () => void;
+    onConfirm: (reason: IImageAiDiscardReason) => void;
+}
+declare const ImageAiDiscardReasonDialog: React.FC<IImageAiDiscardReasonDialogProps>;
+export default ImageAiDiscardReasonDialog;

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

@@ -0,0 +1,67 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import ControlledDialog from "../../Form/ControlledDialog.js";
+import ControlledRadio from "../../Form/ControlledRadio.js";
+import ControlledTextarea from "../../Form/ControlledTextarea.js";
+import { IMAGE_AI_REVIEW_REASON_CODES, IMAGE_AI_REVIEW_REASON_LABEL_KEYS, IMAGE_AI_REVIEW_REASON_MAX } from "./imageAiReview.js";
+const ImageAiDiscardReasonDialog = ({ open, onCancel, onConfirm }) => {
+  const { t } = useTranslation("ui");
+  const [reasonCode, setReasonCode] = useState(null);
+  const [reason, setReason] = useState("");
+  useEffect(() => {
+    if (!open) return;
+    setReasonCode(null);
+    setReason("");
+  }, [open]);
+  const handleConfirm = () => {
+    if (!reasonCode) return;
+    const trimmed = reason.trim().slice(0, IMAGE_AI_REVIEW_REASON_MAX);
+    onConfirm({ reasonCode, reason: trimmed || void 0 });
+  };
+  return /* @__PURE__ */ jsx(
+    ControlledDialog,
+    {
+      open,
+      size: "sm",
+      title: t("imageAiReview.discardTitle"),
+      subtitle: t("imageAiReview.discardSubtitle"),
+      onCancel,
+      onConfirm: handleConfirm,
+      cancelLabel: t("actions.cancel"),
+      confirmLabel: t("imageAiReview.discardConfirm"),
+      disableConfirm: !reasonCode,
+      children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-y-3", children: [
+        /* @__PURE__ */ jsx("div", { role: "radiogroup", "aria-label": t("imageAiReview.reasonLabel"), className: "flex flex-col gap-y-1.5", children: IMAGE_AI_REVIEW_REASON_CODES.map((code) => /* @__PURE__ */ jsx(
+          ControlledRadio,
+          {
+            id: `image-ai-discard-reason-${code}`,
+            name: "image-ai-discard-reason",
+            size: "sm",
+            checked: reasonCode === code,
+            onChange: () => setReasonCode(code),
+            label: t(IMAGE_AI_REVIEW_REASON_LABEL_KEYS[code])
+          },
+          code
+        )) }),
+        /* @__PURE__ */ jsx(
+          ControlledTextarea,
+          {
+            resize: "none",
+            rows: 3,
+            value: reason,
+            maxLength: IMAGE_AI_REVIEW_REASON_MAX,
+            "aria-label": t("imageAiReview.detailsLabel"),
+            placeholder: t("imageAiReview.detailsPlaceholder"),
+            onChange: (event) => setReason(event.target.value),
+            className: "rounded-xl"
+          }
+        )
+      ] })
+    }
+  );
+};
+export {
+  ImageAiDiscardReasonDialog as default
+};
+//# sourceMappingURL=ImageAiDiscardReasonDialog.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ImageAiDiscardReasonDialog.js","sources":["../../../../src/components/UI/ImageAiAdjust/ImageAiDiscardReasonDialog.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\n\nimport ControlledDialog from '@/components/Form/ControlledDialog';\nimport ControlledRadio from '@/components/Form/ControlledRadio';\nimport ControlledTextarea from '@/components/Form/ControlledTextarea';\n\nimport {\n  IImageAiDiscardReason,\n  IMAGE_AI_REVIEW_REASON_CODES,\n  IMAGE_AI_REVIEW_REASON_LABEL_KEYS,\n  IMAGE_AI_REVIEW_REASON_MAX,\n  TImageAiReviewReasonCode,\n} from './imageAiReview';\n\ninterface IImageAiDiscardReasonDialogProps {\n  open: boolean;\n  onCancel: () => void;\n  onConfirm: (reason: IImageAiDiscardReason) => void;\n}\n\nconst ImageAiDiscardReasonDialog: React.FC<IImageAiDiscardReasonDialogProps> = ({ open, onCancel, onConfirm }) => {\n  const { t } = useTranslation('ui');\n  const [reasonCode, setReasonCode] = useState<TImageAiReviewReasonCode | null>(null);\n  const [reason, setReason] = useState('');\n\n  useEffect(() => {\n    if (!open) return;\n    setReasonCode(null);\n    setReason('');\n  }, [open]);\n\n  const handleConfirm = () => {\n    if (!reasonCode) return;\n    const trimmed = reason.trim().slice(0, IMAGE_AI_REVIEW_REASON_MAX);\n    onConfirm({ reasonCode, reason: trimmed || undefined });\n  };\n\n  return (\n    <ControlledDialog\n      open={open}\n      size=\"sm\"\n      title={t('imageAiReview.discardTitle')}\n      subtitle={t('imageAiReview.discardSubtitle')}\n      onCancel={onCancel}\n      onConfirm={handleConfirm}\n      cancelLabel={t('actions.cancel')}\n      confirmLabel={t('imageAiReview.discardConfirm')}\n      disableConfirm={!reasonCode}\n    >\n      <div className=\"flex flex-col gap-y-3\">\n        <div role=\"radiogroup\" aria-label={t('imageAiReview.reasonLabel')} className=\"flex flex-col gap-y-1.5\">\n          {IMAGE_AI_REVIEW_REASON_CODES.map((code) => (\n            <ControlledRadio\n              key={code}\n              id={`image-ai-discard-reason-${code}`}\n              name=\"image-ai-discard-reason\"\n              size=\"sm\"\n              checked={reasonCode === code}\n              onChange={() => setReasonCode(code)}\n              label={t(IMAGE_AI_REVIEW_REASON_LABEL_KEYS[code])}\n            />\n          ))}\n        </div>\n\n        <ControlledTextarea\n          resize=\"none\"\n          rows={3}\n          value={reason}\n          maxLength={IMAGE_AI_REVIEW_REASON_MAX}\n          aria-label={t('imageAiReview.detailsLabel')}\n          placeholder={t('imageAiReview.detailsPlaceholder')}\n          onChange={(event) => setReason(event.target.value)}\n          className=\"rounded-xl\"\n        />\n      </div>\n    </ControlledDialog>\n  );\n};\n\nexport default ImageAiDiscardReasonDialog;\n"],"names":[],"mappings":";;;;;;;AAqBA,MAAM,6BAAyE,CAAC,EAAE,MAAM,UAAU,gBAAgB;AAChH,QAAM,EAAE,EAAA,IAAM,eAAe,IAAI;AACjC,QAAM,CAAC,YAAY,aAAa,IAAI,SAA0C,IAAI;AAClF,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,EAAE;AAEvC,YAAU,MAAM;AACd,QAAI,CAAC,KAAM;AACX,kBAAc,IAAI;AAClB,cAAU,EAAE;AAAA,EACd,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,gBAAgB,MAAM;AAC1B,QAAI,CAAC,WAAY;AACjB,UAAM,UAAU,OAAO,KAAA,EAAO,MAAM,GAAG,0BAA0B;AACjE,cAAU,EAAE,YAAY,QAAQ,WAAW,QAAW;AAAA,EACxD;AAEA,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,OAAO,EAAE,4BAA4B;AAAA,MACrC,UAAU,EAAE,+BAA+B;AAAA,MAC3C;AAAA,MACA,WAAW;AAAA,MACX,aAAa,EAAE,gBAAgB;AAAA,MAC/B,cAAc,EAAE,8BAA8B;AAAA,MAC9C,gBAAgB,CAAC;AAAA,MAEjB,UAAA,qBAAC,OAAA,EAAI,WAAU,yBACb,UAAA;AAAA,QAAA,oBAAC,OAAA,EAAI,MAAK,cAAa,cAAY,EAAE,2BAA2B,GAAG,WAAU,2BAC1E,UAAA,6BAA6B,IAAI,CAAC,SACjC;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,IAAI,2BAA2B,IAAI;AAAA,YACnC,MAAK;AAAA,YACL,MAAK;AAAA,YACL,SAAS,eAAe;AAAA,YACxB,UAAU,MAAM,cAAc,IAAI;AAAA,YAClC,OAAO,EAAE,kCAAkC,IAAI,CAAC;AAAA,UAAA;AAAA,UAN3C;AAAA,QAAA,CAQR,GACH;AAAA,QAEA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,QAAO;AAAA,YACP,MAAM;AAAA,YACN,OAAO;AAAA,YACP,WAAW;AAAA,YACX,cAAY,EAAE,4BAA4B;AAAA,YAC1C,aAAa,EAAE,kCAAkC;AAAA,YACjD,UAAU,CAAC,UAAU,UAAU,MAAM,OAAO,KAAK;AAAA,YACjD,WAAU;AAAA,UAAA;AAAA,QAAA;AAAA,MACZ,EAAA,CACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}

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

@@ -0,0 +1,8 @@
+import { IImageAiVerification } from './imageAiVerification';
+interface IImageAiVerificationNoticeProps {
+    verification: IImageAiVerification | null | undefined;
+    className?: string;
+}
+/** Renders nothing unless the backend flagged the result; the flags are advisory only. */
+declare const ImageAiVerificationNotice: React.FC<IImageAiVerificationNoticeProps>;
+export default ImageAiVerificationNotice;

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>;