@purposeinplay/payload-ai-translate 0.1.0

package/dist/views/TranslationHub/PerCollectionConfig.js

@@ -0,0 +1,759 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
+const SECTION_STYLE = {
+    background: 'var(--theme-elevation-50)',
+    border: '1px solid var(--theme-elevation-150)',
+    borderRadius: '6px',
+    padding: '1rem 1.25rem'
+};
+const ROW_STYLE = {
+    border: '1px solid var(--theme-elevation-150)',
+    borderRadius: '6px',
+    background: 'var(--theme-elevation-0, #ffffff)'
+};
+const ROW_HEADER_STYLE = {
+    padding: '0.6rem 0.85rem',
+    display: 'flex',
+    alignItems: 'center',
+    gap: '0.75rem',
+    cursor: 'pointer',
+    userSelect: 'none'
+};
+const ROW_BODY_STYLE = {
+    padding: '0.75rem 1rem 1rem',
+    borderTop: '1px solid var(--theme-elevation-100)',
+    display: 'flex',
+    flexDirection: 'column',
+    gap: '0.75rem'
+};
+const LABEL_STYLE = {
+    display: 'block',
+    fontSize: '0.7rem',
+    fontWeight: 600,
+    textTransform: 'uppercase',
+    letterSpacing: '0.05em',
+    color: 'var(--theme-elevation-500)',
+    marginBottom: '0.3rem'
+};
+const TOGGLE_LABEL = {
+    display: 'flex',
+    alignItems: 'center',
+    gap: '0.5rem',
+    fontSize: '0.85rem',
+    cursor: 'pointer',
+    color: 'var(--theme-elevation-800)'
+};
+const SMALL_BUTTON = {
+    padding: '0.25rem 0.6rem',
+    fontSize: '0.7rem',
+    background: 'transparent',
+    border: '1px solid var(--theme-elevation-150)',
+    borderRadius: '4px',
+    color: 'var(--theme-elevation-700)',
+    cursor: 'pointer'
+};
+const DANGER_BUTTON = {
+    ...SMALL_BUTTON,
+    color: 'var(--theme-error-500, #b91c1c)',
+    borderColor: 'var(--theme-error-500, #b91c1c)'
+};
+const PRIMARY_BUTTON = {
+    padding: '0.4rem 0.85rem',
+    fontSize: '0.8rem',
+    background: 'var(--theme-success-500, #16a34a)',
+    border: 'none',
+    borderRadius: '4px',
+    color: '#fff',
+    cursor: 'pointer',
+    fontWeight: 500
+};
+function summarize(row, fieldCount) {
+    const bits = [];
+    if (row.enabled === false) {
+        bits.push('DISABLED');
+    }
+    if (row.autoOnPublish === false) {
+        bits.push('manual only');
+    }
+    if (row.targetLocalesOverride?.length) {
+        bits.push(`locales: ${row.targetLocalesOverride.join('/')}`);
+    }
+    if (row.translateSlug) {
+        bits.push('slug translated');
+    }
+    if (row.excludedFieldPaths?.length) {
+        bits.push(fieldCount == null ? `${row.excludedFieldPaths.length} fields excluded` : `${row.excludedFieldPaths.length}/${fieldCount} fields excluded`);
+    }
+    return bits.length === 0 ? 'inherits site-wide defaults' : bits.join(' · ');
+}
+export const PerCollectionConfig = ({ basePath, translationSettings, locales, onSettingsChange })=>{
+    const [translatableBySlug, setTranslatableBySlug] = useState(null);
+    const [expandedSlugs, setExpandedSlugs] = useState(new Set());
+    const [saving, setSaving] = useState(false);
+    const [saveError, setSaveError] = useState(null);
+    const [savedFlash, setSavedFlash] = useState(null);
+    const [showAddPicker, setShowAddPicker] = useState(false);
+    // Keep a snapshot ref so concurrent edits don't clobber each other —
+    // same pattern SettingsRail uses for the locale toggle race.
+    const settingsRef = useRef(translationSettings);
+    useEffect(()=>{
+        settingsRef.current = translationSettings;
+    }, [
+        translationSettings
+    ]);
+    // Fetch translatable field map.
+    useEffect(()=>{
+        let cancelled = false;
+        fetch(`${basePath}/api/ai-translate/client-config`, {
+            credentials: 'include'
+        }).then((r)=>r.ok ? r.json() : Promise.reject(new Error(`HTTP ${r.status}`))).then((d)=>{
+            if (cancelled) {
+                return;
+            }
+            setTranslatableBySlug(d.translatableFieldsBySlug ?? {});
+        }).catch(()=>{
+            if (cancelled) {
+                return;
+            }
+            // Without the field map the editor degrades — show counts only
+            // and no field checkboxes — but locale + toggle editing still
+            // works. Set to empty object to mark as "loaded, just empty".
+            setTranslatableBySlug({});
+        });
+        return ()=>{
+            cancelled = true;
+        };
+    }, [
+        basePath
+    ]);
+    // Auto-clear save flash.
+    useEffect(()=>{
+        if (!savedFlash) {
+            return;
+        }
+        const t = setTimeout(()=>setSavedFlash(null), 2000);
+        return ()=>clearTimeout(t);
+    }, [
+        savedFlash
+    ]);
+    const rows = translationSettings?.perCollection ?? [];
+    const configuredSlugs = useMemo(()=>new Set(rows.map((r)=>r.slug)), [
+        rows
+    ]);
+    const unconfiguredSlugs = useMemo(()=>Object.keys(translatableBySlug ?? {}).filter((s)=>!configuredSlugs.has(s)), [
+        translatableBySlug,
+        configuredSlugs
+    ]);
+    const targetLocales = locales.locales.filter((l)=>l.code !== locales.defaultLocale).map((l)=>l.code);
+    function toggleExpand(slug) {
+        setExpandedSlugs((prev)=>{
+            const next = new Set(prev);
+            if (next.has(slug)) {
+                next.delete(slug);
+            } else {
+                next.add(slug);
+            }
+            return next;
+        });
+    }
+    async function patchPerCollection(nextRows) {
+        setSaveError(null);
+        setSaving(true);
+        try {
+            const res = await fetch(`${basePath}/api/globals/translation-settings`, {
+                method: 'POST',
+                credentials: 'include',
+                headers: {
+                    'content-type': 'application/json'
+                },
+                body: JSON.stringify({
+                    perCollection: nextRows
+                })
+            });
+            if (!res.ok) {
+                const text = await res.text();
+                throw new Error(`HTTP ${res.status}: ${text.slice(0, 200)}`);
+            }
+            const json = await res.json();
+            const updated = json.result ?? json.doc ?? json;
+            onSettingsChange(updated);
+            setSavedFlash('Saved');
+        } catch (e) {
+            setSaveError(e instanceof Error ? e.message : String(e));
+        } finally{
+            setSaving(false);
+        }
+    }
+    function updateRow(slug, patch) {
+        const current = settingsRef.current?.perCollection ?? [];
+        const next = current.map((r)=>r.slug === slug ? {
+                ...r,
+                ...patch
+            } : r);
+        return patchPerCollection(next);
+    }
+    function addOverride(slug) {
+        const current = settingsRef.current?.perCollection ?? [];
+        if (current.some((r)=>r.slug === slug)) {
+            return Promise.resolve();
+        }
+        const next = [
+            ...current,
+            {
+                slug,
+                enabled: true,
+                autoOnPublish: true,
+                targetLocalesOverride: null,
+                excludedFieldPaths: null,
+                translateSlug: false
+            }
+        ];
+        setExpandedSlugs((prev)=>new Set(prev).add(slug));
+        setShowAddPicker(false);
+        return patchPerCollection(next);
+    }
+    function removeOverride(slug) {
+        const current = settingsRef.current?.perCollection ?? [];
+        const next = current.filter((r)=>r.slug !== slug);
+        setExpandedSlugs((prev)=>{
+            const n = new Set(prev);
+            n.delete(slug);
+            return n;
+        });
+        return patchPerCollection(next);
+    }
+    return /*#__PURE__*/ _jsx("div", {
+        style: {
+            display: 'flex',
+            flexDirection: 'column',
+            gap: '0.75rem'
+        },
+        children: /*#__PURE__*/ _jsxs("section", {
+            style: SECTION_STYLE,
+            children: [
+                /*#__PURE__*/ _jsxs("div", {
+                    style: {
+                        display: 'flex',
+                        justifyContent: 'space-between',
+                        alignItems: 'baseline',
+                        marginBottom: '0.4rem'
+                    },
+                    children: [
+                        /*#__PURE__*/ _jsx("h3", {
+                            style: {
+                                margin: 0,
+                                fontSize: '1rem',
+                                color: 'var(--theme-elevation-1000)'
+                            },
+                            children: "Per-collection configuration"
+                        }),
+                        /*#__PURE__*/ _jsxs("span", {
+                            style: {
+                                fontSize: '0.75rem',
+                                color: 'var(--theme-elevation-500)'
+                            },
+                            children: [
+                                rows.length,
+                                " override",
+                                rows.length === 1 ? '' : 's',
+                                ' · ',
+                                unconfiguredSlugs.length,
+                                " inherit defaults"
+                            ]
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ _jsx("p", {
+                    style: {
+                        margin: '0 0 0.75rem',
+                        fontSize: '0.8rem',
+                        color: 'var(--theme-elevation-700)',
+                        lineHeight: 1.5
+                    },
+                    children: "Surfaces without a row use the site-wide settings from the panel above. Add a row to opt a specific collection out, narrow its target locales, or exclude individual fields from translation."
+                }),
+                saveError && /*#__PURE__*/ _jsx("div", {
+                    style: {
+                        padding: '0.5rem 0.75rem',
+                        background: 'var(--theme-error-100, #fee2e2)',
+                        border: '1px solid var(--theme-error-500, #b91c1c)',
+                        borderRadius: '4px',
+                        color: 'var(--theme-error-500, #b91c1c)',
+                        fontSize: '0.8rem',
+                        marginBottom: '0.5rem'
+                    },
+                    children: saveError
+                }),
+                savedFlash && /*#__PURE__*/ _jsx("div", {
+                    style: {
+                        padding: '0.4rem 0.75rem',
+                        background: 'var(--theme-success-100, #d1fae5)',
+                        border: '1px solid var(--theme-success-500, #16a34a)',
+                        borderRadius: '4px',
+                        color: 'var(--theme-success-500, #16a34a)',
+                        fontSize: '0.8rem',
+                        marginBottom: '0.5rem'
+                    },
+                    children: savedFlash
+                }),
+                rows.length === 0 ? /*#__PURE__*/ _jsx("p", {
+                    style: {
+                        margin: 0,
+                        fontSize: '0.85rem',
+                        color: 'var(--theme-elevation-500)',
+                        padding: '0.75rem',
+                        background: 'var(--theme-elevation-50)',
+                        borderRadius: '4px',
+                        textAlign: 'center'
+                    },
+                    children: "No overrides yet. Every tracked surface uses site-wide defaults."
+                }) : /*#__PURE__*/ _jsx("div", {
+                    style: {
+                        display: 'flex',
+                        flexDirection: 'column',
+                        gap: '0.5rem'
+                    },
+                    children: rows.map((row)=>{
+                        const isExpanded = expandedSlugs.has(row.slug);
+                        const fields = translatableBySlug?.[row.slug] ?? null;
+                        const summary = summarize(row, fields?.length ?? null);
+                        return /*#__PURE__*/ _jsxs("div", {
+                            style: ROW_STYLE,
+                            children: [
+                                /*#__PURE__*/ _jsxs("button", {
+                                    "aria-expanded": isExpanded,
+                                    onClick: ()=>toggleExpand(row.slug),
+                                    style: {
+                                        ...ROW_HEADER_STYLE,
+                                        background: 'transparent',
+                                        border: 'none',
+                                        width: '100%',
+                                        textAlign: 'left',
+                                        font: 'inherit',
+                                        color: 'inherit'
+                                    },
+                                    type: "button",
+                                    children: [
+                                        /*#__PURE__*/ _jsx("span", {
+                                            "aria-hidden": "true",
+                                            style: {
+                                                display: 'inline-block',
+                                                width: '0.75rem',
+                                                fontSize: '0.65rem',
+                                                color: 'var(--theme-elevation-500)',
+                                                transform: isExpanded ? 'rotate(90deg)' : 'rotate(0deg)',
+                                                transition: 'transform 80ms ease'
+                                            },
+                                            children: "▶"
+                                        }),
+                                        /*#__PURE__*/ _jsx("code", {
+                                            style: {
+                                                fontSize: '0.85rem',
+                                                fontWeight: 600,
+                                                color: row.enabled === false ? 'var(--theme-error-500)' : 'var(--theme-elevation-1000)'
+                                            },
+                                            children: row.slug
+                                        }),
+                                        /*#__PURE__*/ _jsx("span", {
+                                            style: {
+                                                fontSize: '0.75rem',
+                                                color: 'var(--theme-elevation-500)',
+                                                flex: 1
+                                            },
+                                            children: summary
+                                        })
+                                    ]
+                                }),
+                                isExpanded && /*#__PURE__*/ _jsx(PerCollectionRowEditor, {
+                                    fields: fields,
+                                    onRemove: ()=>removeOverride(row.slug),
+                                    onUpdate: (patch)=>updateRow(row.slug, patch),
+                                    row: row,
+                                    saving: saving,
+                                    targetLocales: targetLocales
+                                })
+                            ]
+                        }, row.slug);
+                    })
+                }),
+                /*#__PURE__*/ _jsx("div", {
+                    style: {
+                        marginTop: '1rem'
+                    },
+                    children: showAddPicker ? /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            gap: '0.5rem',
+                            alignItems: 'center',
+                            flexWrap: 'wrap'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs("select", {
+                                defaultValue: "",
+                                disabled: saving || unconfiguredSlugs.length === 0,
+                                onChange: (e)=>{
+                                    if (e.target.value) {
+                                        addOverride(e.target.value);
+                                    }
+                                },
+                                style: {
+                                    padding: '0.4rem 0.6rem',
+                                    background: 'var(--theme-elevation-50)',
+                                    border: '1px solid var(--theme-elevation-150)',
+                                    borderRadius: '4px',
+                                    fontSize: '0.85rem',
+                                    color: 'var(--theme-elevation-1000)'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("option", {
+                                        value: "",
+                                        children: unconfiguredSlugs.length === 0 ? 'All surfaces already configured' : 'Pick a surface…'
+                                    }),
+                                    unconfiguredSlugs.map((s)=>/*#__PURE__*/ _jsx("option", {
+                                            value: s,
+                                            children: s
+                                        }, s))
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                onClick: ()=>setShowAddPicker(false),
+                                style: SMALL_BUTTON,
+                                type: "button",
+                                children: "Cancel"
+                            })
+                        ]
+                    }) : /*#__PURE__*/ _jsx("button", {
+                        disabled: unconfiguredSlugs.length === 0,
+                        onClick: ()=>setShowAddPicker(true),
+                        style: {
+                            ...PRIMARY_BUTTON,
+                            opacity: unconfiguredSlugs.length === 0 ? 0.5 : 1,
+                            cursor: unconfiguredSlugs.length === 0 ? 'not-allowed' : 'pointer'
+                        },
+                        type: "button",
+                        children: "+ Add override"
+                    })
+                })
+            ]
+        })
+    });
+};
+// ---------------------------------------------------------------------------
+// Per-row inline editor
+// ---------------------------------------------------------------------------
+const PerCollectionRowEditor = ({ row, fields, targetLocales, saving, onUpdate, onRemove })=>{
+    const excluded = new Set(row.excludedFieldPaths ?? []);
+    // Two-step remove confirmation. First click flips this flag and the
+    // button label changes to "Confirm remove"; a second click actually
+    // calls onRemove. Replaces `window.confirm()` which biome's `noAlert`
+    // rule rejects (and which most teams ban for UX reasons anyway).
+    const [confirmingRemove, setConfirmingRemove] = useState(false);
+    function toggleLocale(loc) {
+        const current = row.targetLocalesOverride ?? [];
+        const next = current.includes(loc) ? current.filter((l)=>l !== loc) : [
+            ...current,
+            loc
+        ];
+        onUpdate({
+            targetLocalesOverride: next.length === 0 ? null : next
+        });
+    }
+    function toggleField(path) {
+        const next = new Set(excluded);
+        if (next.has(path)) {
+            next.delete(path);
+        } else {
+            next.add(path);
+        }
+        onUpdate({
+            excludedFieldPaths: next.size === 0 ? null : Array.from(next)
+        });
+    }
+    function selectAllFields() {
+        if (!fields) {
+            return;
+        }
+        onUpdate({
+            excludedFieldPaths: [
+                ...fields
+            ]
+        });
+    }
+    function clearAllFields() {
+        onUpdate({
+            excludedFieldPaths: null
+        });
+    }
+    return /*#__PURE__*/ _jsxs("div", {
+        style: ROW_BODY_STYLE,
+        children: [
+            /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    display: 'flex',
+                    flexWrap: 'wrap',
+                    gap: '1.5rem'
+                },
+                children: [
+                    /*#__PURE__*/ _jsxs("label", {
+                        style: TOGGLE_LABEL,
+                        children: [
+                            /*#__PURE__*/ _jsx("input", {
+                                checked: row.enabled !== false,
+                                disabled: saving,
+                                onChange: (e)=>onUpdate({
+                                        enabled: e.target.checked
+                                    }),
+                                type: "checkbox"
+                            }),
+                            "Enabled (kill switch)"
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("label", {
+                        style: TOGGLE_LABEL,
+                        children: [
+                            /*#__PURE__*/ _jsx("input", {
+                                checked: row.autoOnPublish !== false,
+                                disabled: saving || row.enabled === false,
+                                onChange: (e)=>onUpdate({
+                                        autoOnPublish: e.target.checked
+                                    }),
+                                type: "checkbox"
+                            }),
+                            "Auto-translate on publish"
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsxs("label", {
+                        style: TOGGLE_LABEL,
+                        children: [
+                            /*#__PURE__*/ _jsx("input", {
+                                checked: !!row.translateSlug,
+                                disabled: saving || row.enabled === false,
+                                onChange: (e)=>onUpdate({
+                                        translateSlug: e.target.checked
+                                    }),
+                                type: "checkbox"
+                            }),
+                            "Translate slug field"
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                children: [
+                    /*#__PURE__*/ _jsx("span", {
+                        style: LABEL_STYLE,
+                        children: "Target locales (this surface only)"
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        style: {
+                            display: 'flex',
+                            flexWrap: 'wrap',
+                            gap: '0.5rem'
+                        },
+                        children: targetLocales.length === 0 ? /*#__PURE__*/ _jsx("span", {
+                            style: {
+                                fontSize: '0.8rem',
+                                color: 'var(--theme-elevation-500)'
+                            },
+                            children: "No target locales configured."
+                        }) : targetLocales.map((loc)=>{
+                            const isOn = (row.targetLocalesOverride ?? []).includes(loc);
+                            return /*#__PURE__*/ _jsxs("label", {
+                                style: {
+                                    ...TOGGLE_LABEL,
+                                    padding: '0.25rem 0.6rem',
+                                    border: `1px solid ${isOn ? 'var(--theme-success-500)' : 'var(--theme-elevation-150)'}`,
+                                    borderRadius: '4px',
+                                    background: isOn ? 'var(--theme-success-100, #d1fae5)' : 'transparent',
+                                    color: isOn ? 'var(--theme-success-500)' : 'var(--theme-elevation-700)'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("input", {
+                                        checked: isOn,
+                                        disabled: saving || row.enabled === false,
+                                        onChange: ()=>toggleLocale(loc),
+                                        type: "checkbox"
+                                    }),
+                                    loc.toUpperCase()
+                                ]
+                            }, loc);
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            margin: '0.3rem 0 0',
+                            fontSize: '0.7rem',
+                            color: 'var(--theme-elevation-500)'
+                        },
+                        children: "Empty selection = inherit site-wide locale list."
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                children: [
+                    /*#__PURE__*/ _jsxs("div", {
+                        style: {
+                            display: 'flex',
+                            justifyContent: 'space-between',
+                            alignItems: 'baseline',
+                            marginBottom: '0.3rem'
+                        },
+                        children: [
+                            /*#__PURE__*/ _jsxs("span", {
+                                style: LABEL_STYLE,
+                                children: [
+                                    "Field exclusions",
+                                    fields && /*#__PURE__*/ _jsxs("span", {
+                                        style: {
+                                            textTransform: 'none',
+                                            fontWeight: 400,
+                                            color: 'var(--theme-elevation-700)',
+                                            marginLeft: '0.4rem'
+                                        },
+                                        children: [
+                                            "(",
+                                            excluded.size,
+                                            " of ",
+                                            fields.length,
+                                            " excluded)"
+                                        ]
+                                    })
+                                ]
+                            }),
+                            fields && fields.length > 0 && /*#__PURE__*/ _jsxs("div", {
+                                style: {
+                                    display: 'flex',
+                                    gap: '0.3rem'
+                                },
+                                children: [
+                                    /*#__PURE__*/ _jsx("button", {
+                                        disabled: saving || excluded.size === 0,
+                                        onClick: clearAllFields,
+                                        style: SMALL_BUTTON,
+                                        type: "button",
+                                        children: "Translate all"
+                                    }),
+                                    /*#__PURE__*/ _jsx("button", {
+                                        disabled: saving || excluded.size === fields.length,
+                                        onClick: selectAllFields,
+                                        style: SMALL_BUTTON,
+                                        type: "button",
+                                        children: "Exclude all"
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    fields === null && /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            margin: 0,
+                            fontSize: '0.8rem',
+                            color: 'var(--theme-elevation-500)'
+                        },
+                        children: "Loading field paths…"
+                    }),
+                    fields !== null && fields.length === 0 && /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            margin: 0,
+                            fontSize: '0.8rem',
+                            color: 'var(--theme-elevation-500)'
+                        },
+                        children: "No translatable fields detected for this surface. Plugin client-config didn't return any paths — it may not be a registered surface or it has no localized fields."
+                    }),
+                    fields !== null && fields.length > 0 && /*#__PURE__*/ _jsx("div", {
+                        style: {
+                            display: 'grid',
+                            gridTemplateColumns: 'repeat(auto-fill, minmax(220px, 1fr))',
+                            gap: '0.3rem',
+                            maxHeight: '280px',
+                            overflowY: 'auto',
+                            padding: '0.5rem',
+                            background: 'var(--theme-elevation-50)',
+                            border: '1px solid var(--theme-elevation-100)',
+                            borderRadius: '4px'
+                        },
+                        children: fields.map((path)=>{
+                            const isExcluded = excluded.has(path);
+                            return /*#__PURE__*/ _jsxs("label", {
+                                style: {
+                                    ...TOGGLE_LABEL,
+                                    fontSize: '0.75rem',
+                                    fontFamily: 'monospace',
+                                    padding: '0.2rem 0.3rem',
+                                    color: isExcluded ? 'var(--theme-elevation-500)' : 'var(--theme-elevation-900)',
+                                    textDecoration: isExcluded ? 'line-through' : 'none'
+                                },
+                                title: isExcluded ? `${path} — excluded, will NOT be translated` : `${path} — included in translation`,
+                                children: [
+                                    /*#__PURE__*/ _jsx("input", {
+                                        checked: !isExcluded,
+                                        disabled: saving || row.enabled === false,
+                                        onChange: ()=>toggleField(path),
+                                        type: "checkbox"
+                                    }),
+                                    path
+                                ]
+                            }, path);
+                        })
+                    }),
+                    /*#__PURE__*/ _jsx("p", {
+                        style: {
+                            margin: '0.3rem 0 0',
+                            fontSize: '0.7rem',
+                            color: 'var(--theme-elevation-500)'
+                        },
+                        children: "Uncheck a field to exclude it from translation runs. Applies to both auto-translate and the manual Translate dialog."
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsxs("div", {
+                style: {
+                    display: 'flex',
+                    justifyContent: 'flex-end',
+                    gap: '0.5rem',
+                    alignItems: 'center'
+                },
+                children: [
+                    confirmingRemove && /*#__PURE__*/ _jsxs(_Fragment, {
+                        children: [
+                            /*#__PURE__*/ _jsxs("span", {
+                                style: {
+                                    fontSize: '0.75rem',
+                                    color: 'var(--theme-elevation-700)'
+                                },
+                                children: [
+                                    'Revert "',
+                                    row.slug,
+                                    '" to site-wide defaults?'
+                                ]
+                            }),
+                            /*#__PURE__*/ _jsx("button", {
+                                disabled: saving,
+                                onClick: ()=>setConfirmingRemove(false),
+                                style: SMALL_BUTTON,
+                                type: "button",
+                                children: "Cancel"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ _jsx("button", {
+                        disabled: saving,
+                        onClick: ()=>{
+                            if (confirmingRemove) {
+                                onRemove();
+                                setConfirmingRemove(false);
+                            } else {
+                                setConfirmingRemove(true);
+                            }
+                        },
+                        style: DANGER_BUTTON,
+                        type: "button",
+                        children: confirmingRemove ? 'Confirm remove' : 'Remove override'
+                    })
+                ]
+            })
+        ]
+    });
+};
+export default PerCollectionConfig;