@aglyn/plugins-ai 1.0.0-beta.228 → 1.0.0-beta.230

package/src/lib/components/ai-media-create.component.js

@@ -0,0 +1,433 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import { lockdownRefusalText, parseLockdownRefusal } from "@aglyn/aglyn";
+import { mdiCreation } from "@aglyn/shared-data-mdi";
+import { MdiIcon } from "@aglyn/shared-ui-jsx";
+import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
+import { useUser } from "@aglyn/tenant-feature-instance";
+import { Alert, Button, Dialog, DialogActions, DialogContent, DialogTitle, FormControlLabel, IconButton, LinearProgress, MenuItem, Radio, RadioGroup, Stack, TextField, ToggleButton, ToggleButtonGroup, Typography } from "@mui/material";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { aiMediaCreditsPerPicture } from "../model/ai-media-credits.js";
+import { AI_IMAGE_ASPECT_RATIOS, AI_IMAGE_MAX_COUNT, AI_IMAGE_PROMPT_MAX_CHARS, AI_SVG_MAX_COLORS, AI_SVG_STYLES, aiImagePhotosOffered } from "../providers/image-contract.js";
+/** The words each shape is offered in. */ const ASPECT_LABELS = {
+    '1:1': 'Square',
+    '4:3': 'Landscape',
+    '3:4': 'Portrait',
+    '16:9': 'Wide',
+    '9:16': 'Tall'
+};
+/** The words each kind of illustration is offered in. */ export const AI_SVG_STYLE_LABELS = {
+    illustration: 'Illustration',
+    icon: 'Icon',
+    pattern: 'Pattern',
+    logo: 'Logo mark'
+};
+/** The sentence the estimate reads as, before anything is spent. */ export function aiMediaCreditEstimate(mode, count) {
+    const each = aiMediaCreditsPerPicture(mode);
+    const pictures = count === 1 ? '1 picture' : `${count} pictures`;
+    return `${pictures} uses about ${(count * each).toLocaleString()} AI credits ` + `(about ${each.toLocaleString()} each). A picture that is held back or does not come out is not charged.`;
+}
+export function AiMediaCreateButton(props) {
+    const { orgId, entitled, upgrade } = props;
+    const [open, setOpen] = useState(false);
+    if (!orgId) return null;
+    const button = /*#__PURE__*/ _jsx(Button, {
+        size: "small",
+        variant: "outlined",
+        startIcon: /*#__PURE__*/ _jsx(MdiIcon, {
+            path: mdiCreation.path
+        }),
+        onClick: ()=>setOpen(true),
+        children: 'Create with AI'
+    });
+    if (entitled === false) {
+        if (!upgrade) return null;
+        return /*#__PURE__*/ _jsxs(_Fragment, {
+            children: [
+                button,
+                /*#__PURE__*/ _jsxs(Dialog, {
+                    open: open,
+                    onClose: ()=>setOpen(false),
+                    fullWidth: true,
+                    maxWidth: "xs",
+                    children: [
+                        /*#__PURE__*/ _jsx(DialogTitle, {
+                            children: 'Create images with AI'
+                        }),
+                        /*#__PURE__*/ _jsx(DialogContent, {
+                            children: /*#__PURE__*/ _jsx(Typography, {
+                                children: upgrade.canManageBilling ? 'Creating pictures and illustrations comes with the AI add-on.' : 'Creating pictures and illustrations comes with the AI add-on. Ask an owner or admin of this workspace to add it.'
+                            })
+                        }),
+                        /*#__PURE__*/ _jsxs(DialogActions, {
+                            children: [
+                                /*#__PURE__*/ _jsx(Button, {
+                                    onClick: ()=>setOpen(false),
+                                    children: 'Close'
+                                }),
+                                upgrade.canManageBilling ? /*#__PURE__*/ _jsx(Button, {
+                                    variant: "contained",
+                                    href: upgrade.billingHref,
+                                    children: 'See the AI add-on'
+                                }) : null
+                            ]
+                        })
+                    ]
+                })
+            ]
+        });
+    }
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            button,
+            /*#__PURE__*/ _jsx(AiMediaCreateDialog, _extends({}, props, {
+                orgId: orgId,
+                open: open,
+                onClose: ()=>setOpen(false)
+            }))
+        ]
+    });
+}
+export function AiMediaCreateDialog({ open, onClose, orgId, hostId, library, folderId, onCreated }) {
+    const { data: user } = useUser();
+    const userRef = useRef(user);
+    userRef.current = user;
+    const photos = aiImagePhotosOffered();
+    const [mode, setMode] = useState(photos ? 'photo' : 'illustration');
+    const [style, setStyle] = useState('illustration');
+    // The site theme's colors need a site; the organization's library names none.
+    const [paletteSource, setPaletteSource] = useState(hostId ? 'theme' : 'custom');
+    const [colors, setColors] = useState([
+        '#1a73e8',
+        '#fbbc04'
+    ]);
+    const [prompt, setPrompt] = useState('');
+    const [aspectRatio, setAspectRatio] = useState('1:1');
+    const [count, setCount] = useState(1);
+    const [busy, setBusy] = useState(false);
+    const [notice, setNotice] = useState(null);
+    useEffect(()=>{
+        if (open) setNotice(null);
+    }, [
+        open
+    ]);
+    const create = useCallback(async ()=>{
+        const description = prompt.trim();
+        if (!description) return;
+        setBusy(true);
+        setNotice(null);
+        try {
+            var _ref, _ref1;
+            const response = await authorizedFetch(userRef.current, '/api/ai/media/images', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                },
+                body: JSON.stringify(_extends({
+                    orgId,
+                    library,
+                    hostId,
+                    folderId,
+                    mode,
+                    prompt: description,
+                    aspectRatio,
+                    count
+                }, mode === 'illustration' ? {
+                    style,
+                    palette: paletteSource === 'theme' ? {
+                        source: 'theme'
+                    } : {
+                        source: 'custom',
+                        colors
+                    }
+                } : {}))
+            });
+            const payload = await response.json().catch(()=>null);
+            if (!response.ok) {
+                var _ref2;
+                const locked = parseLockdownRefusal(response.status, payload);
+                setNotice({
+                    severity: 'error',
+                    text: locked ? lockdownRefusalText(locked) : String((_ref2 = payload == null ? void 0 : payload.error) != null ? _ref2 : 'The pictures could not be made — try again.')
+                });
+                return;
+            }
+            const ids = Array.isArray(payload == null ? void 0 : payload.mediaIds) ? payload.mediaIds : [];
+            onCreated(ids);
+            const missing = Number((_ref = payload == null ? void 0 : payload.filtered) != null ? _ref : 0) + Number((_ref1 = payload == null ? void 0 : payload.failed) != null ? _ref1 : 0);
+            if (missing > 0) {
+                setNotice({
+                    severity: 'warning',
+                    text: `Added ${ids.length} of ${count} to the library. ` + ((payload == null ? void 0 : payload.warning) ? String(payload.warning) : 'The rest were held back and were not charged.')
+                });
+                return;
+            }
+            setPrompt('');
+            onClose();
+        } catch (unused) {
+            setNotice({
+                severity: 'error',
+                text: 'The pictures could not be made — try again.'
+            });
+        } finally{
+            setBusy(false);
+        }
+    }, [
+        prompt,
+        orgId,
+        library,
+        hostId,
+        folderId,
+        mode,
+        aspectRatio,
+        count,
+        style,
+        paletteSource,
+        colors,
+        onCreated,
+        onClose
+    ]);
+    return /*#__PURE__*/ _jsxs(Dialog, {
+        open: open,
+        onClose: busy ? undefined : onClose,
+        fullWidth: true,
+        maxWidth: "sm",
+        children: [
+            /*#__PURE__*/ _jsx(DialogTitle, {
+                children: 'Create images with AI'
+            }),
+            /*#__PURE__*/ _jsx(DialogContent, {
+                children: /*#__PURE__*/ _jsxs(Stack, {
+                    spacing: 2,
+                    sx: {
+                        pt: 1
+                    },
+                    children: [
+                        photos ? /*#__PURE__*/ _jsxs(ToggleButtonGroup, {
+                            size: "small",
+                            exclusive: true,
+                            value: mode,
+                            onChange: (_event, next)=>{
+                                if (next) setMode(next);
+                            },
+                            "aria-label": "What to make",
+                            disabled: busy,
+                            children: [
+                                /*#__PURE__*/ _jsx(ToggleButton, {
+                                    value: "photo",
+                                    children: 'Photo'
+                                }),
+                                /*#__PURE__*/ _jsx(ToggleButton, {
+                                    value: "illustration",
+                                    children: 'Illustration or icon'
+                                })
+                            ]
+                        }) : null,
+                        mode === 'illustration' ? /*#__PURE__*/ _jsx(TextField, {
+                            select: true,
+                            size: "small",
+                            label: "Kind",
+                            value: style,
+                            onChange: (event)=>setStyle(event.target.value),
+                            disabled: busy,
+                            sx: {
+                                maxWidth: 240
+                            },
+                            helperText: style === 'logo' ? 'A simple symbol, without lettering. Not a real brand’s logo.' : style === 'pattern' ? 'A seamless background that tiles.' : 'Drawn as an SVG, sharp at any size.',
+                            children: AI_SVG_STYLES.map((value)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                    value: value,
+                                    children: AI_SVG_STYLE_LABELS[value]
+                                }, value))
+                        }) : null,
+                        /*#__PURE__*/ _jsx(TextField, {
+                            label: mode === 'photo' ? 'Describe the picture' : 'Describe what to draw',
+                            placeholder: mode === 'photo' ? 'A sunlit bakery counter with fresh sourdough loaves, warm morning light' : 'A friendly delivery van with a parcel, simple and flat',
+                            value: prompt,
+                            onChange: (event)=>setPrompt(event.target.value.slice(0, AI_IMAGE_PROMPT_MAX_CHARS)),
+                            multiline: true,
+                            minRows: 3,
+                            autoFocus: true,
+                            disabled: busy,
+                            helperText: "The description becomes each picture's alt text, which you can edit."
+                        }),
+                        /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 0.5,
+                            children: [
+                                /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "body2",
+                                    color: "text.secondary",
+                                    children: 'Shape'
+                                }),
+                                /*#__PURE__*/ _jsx(ToggleButtonGroup, {
+                                    size: "small",
+                                    exclusive: true,
+                                    value: aspectRatio,
+                                    onChange: (_event, next)=>{
+                                        if (next) setAspectRatio(next);
+                                    },
+                                    "aria-label": "Shape",
+                                    disabled: busy,
+                                    sx: {
+                                        flexWrap: 'wrap'
+                                    },
+                                    children: AI_IMAGE_ASPECT_RATIOS.map((ratio)=>/*#__PURE__*/ _jsx(ToggleButton, {
+                                            value: ratio,
+                                            "aria-label": `${ASPECT_LABELS[ratio]} ${ratio}`,
+                                            children: `${ASPECT_LABELS[ratio]} ${ratio}`
+                                        }, ratio))
+                                })
+                            ]
+                        }),
+                        mode === 'illustration' ? /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 1,
+                            children: [
+                                /*#__PURE__*/ _jsxs(RadioGroup, {
+                                    value: paletteSource,
+                                    onChange: (event)=>setPaletteSource(event.target.value),
+                                    "aria-label": "Colors",
+                                    children: [
+                                        /*#__PURE__*/ _jsx(FormControlLabel, {
+                                            value: "theme",
+                                            control: /*#__PURE__*/ _jsx(Radio, {
+                                                size: "small"
+                                            }),
+                                            label: "Use my site's theme colors",
+                                            disabled: busy || !hostId
+                                        }),
+                                        /*#__PURE__*/ _jsx(FormControlLabel, {
+                                            value: "custom",
+                                            control: /*#__PURE__*/ _jsx(Radio, {
+                                                size: "small"
+                                            }),
+                                            label: "Choose colors",
+                                            disabled: busy
+                                        })
+                                    ]
+                                }),
+                                paletteSource === 'custom' ? /*#__PURE__*/ _jsxs(Stack, {
+                                    direction: "row",
+                                    spacing: 1,
+                                    sx: {
+                                        alignItems: 'center',
+                                        flexWrap: 'wrap'
+                                    },
+                                    children: [
+                                        colors.map((color, index)=>/*#__PURE__*/ _jsxs(Stack, {
+                                                direction: "row",
+                                                sx: {
+                                                    alignItems: 'center'
+                                                },
+                                                children: [
+                                                    /*#__PURE__*/ _jsx(TextField, {
+                                                        type: "color",
+                                                        size: "small",
+                                                        value: color,
+                                                        onChange: (event)=>setColors((current)=>current.map((value, at)=>at === index ? event.target.value : value)),
+                                                        disabled: busy,
+                                                        slotProps: {
+                                                            htmlInput: {
+                                                                'aria-label': `Color ${index + 1}`
+                                                            }
+                                                        },
+                                                        sx: {
+                                                            width: 64
+                                                        }
+                                                    }),
+                                                    colors.length > 1 ? /*#__PURE__*/ _jsx(IconButton, {
+                                                        size: "small",
+                                                        "aria-label": `Remove color ${index + 1}`,
+                                                        onClick: ()=>setColors((current)=>current.filter((_value, at)=>at !== index)),
+                                                        disabled: busy,
+                                                        children: '×'
+                                                    }) : null
+                                                ]
+                                            }, index)),
+                                        colors.length < AI_SVG_MAX_COLORS ? /*#__PURE__*/ _jsx(Button, {
+                                            size: "small",
+                                            onClick: ()=>setColors((current)=>[
+                                                        ...current,
+                                                        '#333333'
+                                                    ]),
+                                            disabled: busy,
+                                            children: 'Add a color'
+                                        }) : null
+                                    ]
+                                }) : null
+                            ]
+                        }) : null,
+                        /*#__PURE__*/ _jsx(TextField, {
+                            select: true,
+                            size: "small",
+                            label: "How many",
+                            value: count,
+                            onChange: (event)=>setCount(Number(event.target.value)),
+                            disabled: busy,
+                            sx: {
+                                maxWidth: 160
+                            },
+                            children: Array.from({
+                                length: AI_IMAGE_MAX_COUNT
+                            }, (_unused, index)=>index + 1).map((value)=>/*#__PURE__*/ _jsx(MenuItem, {
+                                    value: value,
+                                    children: value
+                                }, value))
+                        }),
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "body2",
+                            color: "text.secondary",
+                            children: aiMediaCreditEstimate(mode, count)
+                        }),
+                        busy ? /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 1,
+                            children: [
+                                /*#__PURE__*/ _jsx(LinearProgress, {}),
+                                /*#__PURE__*/ _jsx(Typography, {
+                                    variant: "body2",
+                                    color: "text.secondary",
+                                    children: 'Making your pictures and adding them to the library…'
+                                })
+                            ]
+                        }) : null,
+                        notice ? /*#__PURE__*/ _jsx(Alert, {
+                            severity: notice.severity,
+                            children: notice.text
+                        }) : null
+                    ]
+                })
+            }),
+            /*#__PURE__*/ _jsxs(DialogActions, {
+                children: [
+                    /*#__PURE__*/ _jsx(Button, {
+                        onClick: onClose,
+                        disabled: busy,
+                        children: 'Close'
+                    }),
+                    /*#__PURE__*/ _jsx(Button, {
+                        variant: "contained",
+                        onClick: ()=>void create(),
+                        disabled: busy || !prompt.trim(),
+                        children: busy ? 'Creating…' : 'Create'
+                    })
+                ]
+            })
+        ]
+    });
+}
+export default AiMediaCreateButton;
+
+//# sourceMappingURL=ai-media-create.component.js.map

package/src/lib/components/ai-media-create.component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../libs/plugins/ai/src/lib/components/ai-media-create.component.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { lockdownRefusalText, parseLockdownRefusal } from '@aglyn/aglyn'\nimport type { ConsoleMediaLibraryZoneProps } from '@aglyn/aglyn/plugin-manager/feature-plugins'\nimport { mdiCreation } from '@aglyn/shared-data-mdi'\nimport { MdiIcon } from '@aglyn/shared-ui-jsx'\nimport { authorizedFetch } from '@aglyn/shared-util-http/authorized-token'\nimport { useUser } from '@aglyn/tenant-feature-instance'\nimport {\n  Alert,\n  Button,\n  Dialog,\n  DialogActions,\n  DialogContent,\n  DialogTitle,\n  FormControlLabel,\n  IconButton,\n  LinearProgress,\n  MenuItem,\n  Radio,\n  RadioGroup,\n  Stack,\n  TextField,\n  ToggleButton,\n  ToggleButtonGroup,\n  Typography,\n} from '@mui/material'\nimport { useCallback, useEffect, useRef, useState } from 'react'\nimport { aiMediaCreditsPerPicture } from '../model/ai-media-credits'\nimport {\n  AI_IMAGE_ASPECT_RATIOS,\n  AI_IMAGE_MAX_COUNT,\n  AI_IMAGE_PROMPT_MAX_CHARS,\n  AI_SVG_MAX_COLORS,\n  AI_SVG_STYLES,\n  aiImagePhotosOffered,\n  type AiImageAspectRatio,\n  type AiImageMode,\n  type AiSvgStyle,\n} from '../providers/image-contract'\n\n/**\n * \"Create with AI\" in Media (AGL-3602): pictures from a description, added to\n * the library that is open, through the `mediaLibrary` zone beside Upload\n * media and in the library's empty state.\n *\n * It draws from the shell's gates alone — the plan, the member's\n * `ai.generate`, the plugin being on for the workspace and the site — and asks\n * no server anything until someone creates a picture: the door decides then,\n * and the dialog says what it decided. Two modes: an Illustration (an SVG the\n * text AI draws, wherever text AI runs) and, where the deployment makes them,\n * a Photo.\n */\n\n/** Where the shell sends a reader to buy what the plan lacks (AGL-3601). */\nexport interface AiMediaUpgrade {\n  billingHref: string\n  canManageBilling: boolean\n}\n\nexport interface AiMediaCreateButtonProps extends ConsoleMediaLibraryZoneProps {\n  /**\n   * `false` when the shell mounted this as its own upsell: the plan lacks AI\n   * generation and an add-on would grant it. Absent means entitled.\n   */\n  entitled?: boolean\n  upgrade?: AiMediaUpgrade\n}\n\n/** The words each shape is offered in. */\nconst ASPECT_LABELS: Record<AiImageAspectRatio, string> = {\n  '1:1': 'Square',\n  '4:3': 'Landscape',\n  '3:4': 'Portrait',\n  '16:9': 'Wide',\n  '9:16': 'Tall',\n}\n\n/** The words each kind of illustration is offered in. */\nexport const AI_SVG_STYLE_LABELS: Record<AiSvgStyle, string> = {\n  illustration: 'Illustration',\n  icon: 'Icon',\n  pattern: 'Pattern',\n  logo: 'Logo mark',\n}\n\n/** The sentence the estimate reads as, before anything is spent. */\nexport function aiMediaCreditEstimate(mode: AiImageMode, count: number): string {\n  const each = aiMediaCreditsPerPicture(mode)\n  const pictures = count === 1 ? '1 picture' : `${count} pictures`\n  return (\n    `${pictures} uses about ${(count * each).toLocaleString()} AI credits ` +\n    `(about ${each.toLocaleString()} each). A picture that is held back or does not come out is not charged.`\n  )\n}\n\nexport function AiMediaCreateButton(props: AiMediaCreateButtonProps) {\n  const { orgId, entitled, upgrade } = props\n  const [open, setOpen] = useState(false)\n  if (!orgId) return null\n  const button = (\n    <Button\n      size=\"small\"\n      variant=\"outlined\"\n      startIcon={<MdiIcon path={mdiCreation.path} />}\n      onClick={() => setOpen(true)}\n    >\n      {'Create with AI'}\n    </Button>\n  )\n  if (entitled === false) {\n    if (!upgrade) return null\n    return (\n      <>\n        {button}\n        <Dialog open={open} onClose={() => setOpen(false)} fullWidth maxWidth=\"xs\">\n          <DialogTitle>{'Create images with AI'}</DialogTitle>\n          <DialogContent>\n            <Typography>\n              {upgrade.canManageBilling\n                ? 'Creating pictures and illustrations comes with the AI add-on.'\n                : 'Creating pictures and illustrations comes with the AI add-on. Ask an owner or admin of this workspace to add it.'}\n            </Typography>\n          </DialogContent>\n          <DialogActions>\n            <Button onClick={() => setOpen(false)}>{'Close'}</Button>\n            {upgrade.canManageBilling ? (\n              <Button variant=\"contained\" href={upgrade.billingHref}>\n                {'See the AI add-on'}\n              </Button>\n            ) : null}\n          </DialogActions>\n        </Dialog>\n      </>\n    )\n  }\n  return (\n    <>\n      {button}\n      <AiMediaCreateDialog {...props} orgId={orgId} open={open} onClose={() => setOpen(false)} />\n    </>\n  )\n}\n\nexport interface AiMediaCreateDialogProps\n  extends Pick<ConsoleMediaLibraryZoneProps, 'hostId' | 'library' | 'folderId' | 'onCreated'> {\n  open: boolean\n  onClose: () => void\n  orgId: string\n}\n\nexport function AiMediaCreateDialog({\n  open,\n  onClose,\n  orgId,\n  hostId,\n  library,\n  folderId,\n  onCreated,\n}: AiMediaCreateDialogProps) {\n  const { data: user } = useUser()\n  const userRef = useRef(user)\n  userRef.current = user\n  const photos = aiImagePhotosOffered()\n  const [mode, setMode] = useState<AiImageMode>(photos ? 'photo' : 'illustration')\n  const [style, setStyle] = useState<AiSvgStyle>('illustration')\n  // The site theme's colors need a site; the organization's library names none.\n  const [paletteSource, setPaletteSource] = useState<'theme' | 'custom'>(hostId ? 'theme' : 'custom')\n  const [colors, setColors] = useState<string[]>(['#1a73e8', '#fbbc04'])\n  const [prompt, setPrompt] = useState('')\n  const [aspectRatio, setAspectRatio] = useState<AiImageAspectRatio>('1:1')\n  const [count, setCount] = useState(1)\n  const [busy, setBusy] = useState(false)\n  const [notice, setNotice] = useState<{ severity: 'error' | 'warning'; text: string } | null>(null)\n\n  useEffect(() => {\n    if (open) setNotice(null)\n  }, [open])\n\n  const create = useCallback(async () => {\n    const description = prompt.trim()\n    if (!description) return\n    setBusy(true)\n    setNotice(null)\n    try {\n      const response = await authorizedFetch(userRef.current, '/api/ai/media/images', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({\n          orgId,\n          library,\n          hostId,\n          folderId,\n          mode,\n          prompt: description,\n          aspectRatio,\n          count,\n          ...(mode === 'illustration'\n            ? {\n                style,\n                palette:\n                  paletteSource === 'theme' ? { source: 'theme' } : { source: 'custom', colors },\n              }\n            : {}),\n        }),\n      })\n      const payload = await response.json().catch(() => null)\n      if (!response.ok) {\n        const locked = parseLockdownRefusal(response.status, payload)\n        setNotice({\n          severity: 'error',\n          text: locked\n            ? lockdownRefusalText(locked)\n            : String(payload?.error ?? 'The pictures could not be made — try again.'),\n        })\n        return\n      }\n      const ids: string[] = Array.isArray(payload?.mediaIds) ? payload.mediaIds : []\n      onCreated(ids)\n      const missing = Number(payload?.filtered ?? 0) + Number(payload?.failed ?? 0)\n      if (missing > 0) {\n        setNotice({\n          severity: 'warning',\n          text:\n            `Added ${ids.length} of ${count} to the library. ` +\n            (payload?.warning\n              ? String(payload.warning)\n              : 'The rest were held back and were not charged.'),\n        })\n        return\n      }\n      setPrompt('')\n      onClose()\n    } catch {\n      setNotice({ severity: 'error', text: 'The pictures could not be made — try again.' })\n    } finally {\n      setBusy(false)\n    }\n  }, [prompt, orgId, library, hostId, folderId, mode, aspectRatio, count, style, paletteSource, colors, onCreated, onClose])\n\n  return (\n    <Dialog open={open} onClose={busy ? undefined : onClose} fullWidth maxWidth=\"sm\">\n      <DialogTitle>{'Create images with AI'}</DialogTitle>\n      <DialogContent>\n        <Stack spacing={2} sx={{ pt: 1 }}>\n          {photos ? (\n            <ToggleButtonGroup\n              size=\"small\"\n              exclusive\n              value={mode}\n              onChange={(_event, next) => {\n                if (next) setMode(next)\n              }}\n              aria-label=\"What to make\"\n              disabled={busy}\n            >\n              <ToggleButton value=\"photo\">{'Photo'}</ToggleButton>\n              <ToggleButton value=\"illustration\">{'Illustration or icon'}</ToggleButton>\n            </ToggleButtonGroup>\n          ) : null}\n          {mode === 'illustration' ? (\n            <TextField\n              select\n              size=\"small\"\n              label=\"Kind\"\n              value={style}\n              onChange={(event) => setStyle(event.target.value as AiSvgStyle)}\n              disabled={busy}\n              sx={{ maxWidth: 240 }}\n              helperText={\n                style === 'logo'\n                  ? 'A simple symbol, without lettering. Not a real brand’s logo.'\n                  : style === 'pattern'\n                    ? 'A seamless background that tiles.'\n                    : 'Drawn as an SVG, sharp at any size.'\n              }\n            >\n              {AI_SVG_STYLES.map((value) => (\n                <MenuItem key={value} value={value}>\n                  {AI_SVG_STYLE_LABELS[value]}\n                </MenuItem>\n              ))}\n            </TextField>\n          ) : null}\n          <TextField\n            label={mode === 'photo' ? 'Describe the picture' : 'Describe what to draw'}\n            placeholder={\n              mode === 'photo'\n                ? 'A sunlit bakery counter with fresh sourdough loaves, warm morning light'\n                : 'A friendly delivery van with a parcel, simple and flat'\n            }\n            value={prompt}\n            onChange={(event) => setPrompt(event.target.value.slice(0, AI_IMAGE_PROMPT_MAX_CHARS))}\n            multiline\n            minRows={3}\n            autoFocus\n            disabled={busy}\n            helperText=\"The description becomes each picture's alt text, which you can edit.\"\n          />\n          <Stack spacing={0.5}>\n            <Typography variant=\"body2\" color=\"text.secondary\">\n              {'Shape'}\n            </Typography>\n            <ToggleButtonGroup\n              size=\"small\"\n              exclusive\n              value={aspectRatio}\n              onChange={(_event, next) => {\n                if (next) setAspectRatio(next)\n              }}\n              aria-label=\"Shape\"\n              disabled={busy}\n              sx={{ flexWrap: 'wrap' }}\n            >\n              {AI_IMAGE_ASPECT_RATIOS.map((ratio) => (\n                <ToggleButton key={ratio} value={ratio} aria-label={`${ASPECT_LABELS[ratio]} ${ratio}`}>\n                  {`${ASPECT_LABELS[ratio]} ${ratio}`}\n                </ToggleButton>\n              ))}\n            </ToggleButtonGroup>\n          </Stack>\n          {mode === 'illustration' ? (\n            <Stack spacing={1}>\n              <RadioGroup\n                value={paletteSource}\n                onChange={(event) => setPaletteSource(event.target.value as 'theme' | 'custom')}\n                aria-label=\"Colors\"\n              >\n                <FormControlLabel\n                  value=\"theme\"\n                  control={<Radio size=\"small\" />}\n                  label=\"Use my site's theme colors\"\n                  disabled={busy || !hostId}\n                />\n                <FormControlLabel\n                  value=\"custom\"\n                  control={<Radio size=\"small\" />}\n                  label=\"Choose colors\"\n                  disabled={busy}\n                />\n              </RadioGroup>\n              {paletteSource === 'custom' ? (\n                <Stack direction=\"row\" spacing={1} sx={{ alignItems: 'center', flexWrap: 'wrap' }}>\n                  {colors.map((color, index) => (\n                    <Stack key={index} direction=\"row\" sx={{ alignItems: 'center' }}>\n                      <TextField\n                        type=\"color\"\n                        size=\"small\"\n                        value={color}\n                        onChange={(event) =>\n                          setColors((current) =>\n                            current.map((value, at) => (at === index ? event.target.value : value)),\n                          )\n                        }\n                        disabled={busy}\n                        slotProps={{ htmlInput: { 'aria-label': `Color ${index + 1}` } }}\n                        sx={{ width: 64 }}\n                      />\n                      {colors.length > 1 ? (\n                        <IconButton\n                          size=\"small\"\n                          aria-label={`Remove color ${index + 1}`}\n                          onClick={() => setColors((current) => current.filter((_value, at) => at !== index))}\n                          disabled={busy}\n                        >\n                          {'×'}\n                        </IconButton>\n                      ) : null}\n                    </Stack>\n                  ))}\n                  {colors.length < AI_SVG_MAX_COLORS ? (\n                    <Button size=\"small\" onClick={() => setColors((current) => [...current, '#333333'])} disabled={busy}>\n                      {'Add a color'}\n                    </Button>\n                  ) : null}\n                </Stack>\n              ) : null}\n            </Stack>\n          ) : null}\n          <TextField\n            select\n            size=\"small\"\n            label=\"How many\"\n            value={count}\n            onChange={(event) => setCount(Number(event.target.value))}\n            disabled={busy}\n            sx={{ maxWidth: 160 }}\n          >\n            {Array.from({ length: AI_IMAGE_MAX_COUNT }, (_unused, index) => index + 1).map((value) => (\n              <MenuItem key={value} value={value}>\n                {value}\n              </MenuItem>\n            ))}\n          </TextField>\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            {aiMediaCreditEstimate(mode, count)}\n          </Typography>\n          {busy ? (\n            <Stack spacing={1}>\n              <LinearProgress />\n              <Typography variant=\"body2\" color=\"text.secondary\">\n                {'Making your pictures and adding them to the library…'}\n              </Typography>\n            </Stack>\n          ) : null}\n          {notice ? <Alert severity={notice.severity}>{notice.text}</Alert> : null}\n        </Stack>\n      </DialogContent>\n      <DialogActions>\n        <Button onClick={onClose} disabled={busy}>\n          {'Close'}\n        </Button>\n        <Button variant=\"contained\" onClick={() => void create()} disabled={busy || !prompt.trim()}>\n          {busy ? 'Creating…' : 'Create'}\n        </Button>\n      </DialogActions>\n    </Dialog>\n  )\n}\n\nexport default AiMediaCreateButton\n"],"names":["lockdownRefusalText","parseLockdownRefusal","mdiCreation","MdiIcon","authorizedFetch","useUser","Alert","Button","Dialog","DialogActions","DialogContent","DialogTitle","FormControlLabel","IconButton","LinearProgress","MenuItem","Radio","RadioGroup","Stack","TextField","ToggleButton","ToggleButtonGroup","Typography","useCallback","useEffect","useRef","useState","aiMediaCreditsPerPicture","AI_IMAGE_ASPECT_RATIOS","AI_IMAGE_MAX_COUNT","AI_IMAGE_PROMPT_MAX_CHARS","AI_SVG_MAX_COLORS","AI_SVG_STYLES","aiImagePhotosOffered","ASPECT_LABELS","AI_SVG_STYLE_LABELS","illustration","icon","pattern","logo","aiMediaCreditEstimate","mode","count","each","pictures","toLocaleString","AiMediaCreateButton","props","orgId","entitled","upgrade","open","setOpen","button","size","variant","startIcon","path","onClick","onClose","fullWidth","maxWidth","canManageBilling","href","billingHref","AiMediaCreateDialog","hostId","library","folderId","onCreated","data","user","userRef","current","photos","setMode","style","setStyle","paletteSource","setPaletteSource","colors","setColors","prompt","setPrompt","aspectRatio","setAspectRatio","setCount","busy","setBusy","notice","setNotice","create","description","trim","response","method","headers","body","JSON","stringify","palette","source","payload","json","catch","ok","locked","status","severity","text","String","error","ids","Array","isArray","mediaIds","missing","Number","filtered","failed","length","warning","undefined","spacing","sx","pt","exclusive","value","onChange","_event","next","aria-label","disabled","select","label","event","target","helperText","map","placeholder","slice","multiline","minRows","autoFocus","color","flexWrap","ratio","control","direction","alignItems","index","type","at","slotProps","htmlInput","width","filter","_value","from","_unused"],"mappings":"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"}

package/src/lib/components/ai-overlay-cards.component.d.ts

@@ -0,0 +1,83 @@
+import type { ConsoleWidgetEntitlementProps } from '@aglyn/aglyn/plugin-manager/feature-plugins';
+import type { AiJobSummary } from '../model/ai-jobs.types';
+import { type AiOverlayCopyField, type AiOverlayCopyProposal, type AiOverlayKind, type AiOverlayTriggerRule } from '../model/ai-overlay-copy';
+/** The zone's rules, as the list hands them over. */
+interface OverlayRules {
+    limits: Readonly<Partial<Record<AiOverlayCopyField, number>>>;
+    triggers: readonly AiOverlayTriggerRule[];
+}
+/** What one proposal sets, as the zones' `proposeValues` and `createOverlayDraft` read it. */
+export interface AiOverlayProposalValues {
+    name?: string;
+    text?: string;
+    headline?: string;
+    body?: string;
+    ctaLabel?: string;
+    trigger?: string;
+    triggerValue?: number;
+}
+/** The overlay editor's copy, as the `overlayEditor` zone hands it over. */
+export interface AiOverlayEditorCopy {
+    name: string;
+    text: string;
+    headline: string;
+    body: string;
+    ctaLabel: string;
+    ctaHref: string;
+    trigger: string;
+    triggerValue: number | null;
+}
+/** What the `overlayEditor` zone hands this widget. */
+export interface AiOverlayEditorCardProps extends OverlayRules {
+    hostId: string;
+    overlayId: string;
+    kind: AiOverlayKind;
+    copy: AiOverlayEditorCopy;
+    proposeValues: (proposal: AiOverlayProposalValues, key: string) => void;
+}
+/** What the `hostOverlays` zone hands this widget. */
+export interface AiCreateOverlayButtonProps extends OverlayRules, ConsoleWidgetEntitlementProps {
+    hostId: string;
+    createOverlayDraft: (kind: AiOverlayKind, proposal: AiOverlayProposalValues) => Promise<{
+        ok: true;
+        id: string;
+    } | {
+        ok: false;
+        error: string;
+    }>;
+}
+/** The proposal a finished overlay job carries. */
+export declare function aiOverlayProposalOf(job: AiJobSummary | null): AiOverlayCopyProposal | null;
+/** A checked proposal as the values a zone's callback reads: only the fields it filled. */
+export declare function aiOverlayProposalValues(proposal: AiOverlayCopyProposal): AiOverlayProposalValues;
+/** The editor's copy, as the job's `current` input reads it. */
+export declare function aiOverlayCurrentCopy(kind: AiOverlayKind, copy: AiOverlayEditorCopy): string;
+/** The job's inputs for one overlay. */
+export declare function aiOverlayJobInputs(kind: AiOverlayKind, rules: OverlayRules, current: string): Record<string, string>;
+/** One proposal, drawn the same way in both widgets. */
+export declare function AiOverlayProposal({ proposal, triggers, }: {
+    proposal: AiOverlayCopyProposal;
+    triggers: readonly AiOverlayTriggerRule[];
+}): import("react").JSX.Element;
+export declare namespace AiOverlayProposal {
+    var displayName: string;
+}
+/**
+ * "Write with AI", among the overlay editor's fields. It proposes the copy and,
+ * for a popup, when it opens; it never proposes the link, the schedule, the
+ * pages or the on-switch.
+ */
+export declare function AiOverlayEditorCard(props: AiOverlayEditorCardProps): import("react").JSX.Element;
+export declare namespace AiOverlayEditorCard {
+    var displayName: string;
+}
+/**
+ * "Create with AI", beside New bar and New popup and in the list's empty
+ * state: a brief becomes a new overlay, written switched off and opened in the
+ * editor.
+ */
+export declare function AiCreateOverlayButton(props: AiCreateOverlayButtonProps): import("react").JSX.Element;
+export declare namespace AiCreateOverlayButton {
+    var displayName: string;
+}
+export {};