'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useId } from 'react';
import { SettingsCard, SettingsToggleRow } from './components.js';
const INPUT_CLASS = 'w-full rounded-md border border-border bg-input-background px-3 py-2 text-base text-foreground focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-60';
const TEXTAREA_CLASS = `${INPUT_CLASS} min-h-[88px] resize-y`;
const LABEL_CLASS = 'mb-1 block text-sm font-medium text-foreground';
const TONE_MAX = 400;
const GUIDELINES_MAX = 2000;
const SAMPLE_MAX = 2000;
/**
 * Brand voice — a reusable description of how generated copy should sound. When
 * enabled, it is injected into the system prompt of content-generation features
 * (co-author, SEO titles/descriptions) so every AI surface writes on-brand.
 */
export function BrandVoiceCard({ value, canEdit, onChange, }) {
    const nameId = useId();
    const toneId = useId();
    const audienceId = useId();
    const guidelinesId = useId();
    const sampleId = useId();
    const disabled = !canEdit;
    return (_jsx(SettingsCard, { title: "Brand voice", description: "Teach the AI how your brand sounds. Applied to content writing and SEO copy.", children: _jsxs("div", { className: "space-y-4", children: [_jsx(SettingsToggleRow, { label: "Apply brand voice", description: "When on, generated copy follows the tone and guidelines below.", checked: value.enabled, disabled: disabled, onChange: (v) => onChange({ enabled: v }) }), _jsxs("div", { className: "border-border space-y-4 border-t pt-4", children: [_jsxs("div", { children: [_jsx("label", { htmlFor: nameId, className: LABEL_CLASS, children: "Name" }), _jsx("input", { id: nameId, type: "text", value: value.name, disabled: disabled, placeholder: "e.g. Acme Marketing", onChange: (e) => onChange({ name: e.target.value }), className: INPUT_CLASS })] }), _jsxs("div", { children: [_jsx("label", { htmlFor: toneId, className: LABEL_CLASS, children: "Tone" }), _jsx("input", { id: toneId, type: "text", value: value.tone, disabled: disabled, maxLength: TONE_MAX, placeholder: "e.g. confident, warm, plain-spoken", onChange: (e) => onChange({ tone: e.target.value }), className: INPUT_CLASS })] }), _jsxs("div", { children: [_jsxs("label", { htmlFor: audienceId, className: LABEL_CLASS, children: ["Audience ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optional)" })] }), _jsx("input", { id: audienceId, type: "text", value: value.audience, disabled: disabled, placeholder: "e.g. busy IT directors at mid-market SaaS companies", onChange: (e) => onChange({ audience: e.target.value }), className: INPUT_CLASS })] }), _jsxs("div", { children: [_jsxs("label", { htmlFor: guidelinesId, className: LABEL_CLASS, children: ["Guidelines ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optional)" })] }), _jsx("textarea", { id: guidelinesId, value: value.guidelines, disabled: disabled, maxLength: GUIDELINES_MAX, placeholder: 'Do: lead with the benefit, use active voice.\nDon\u2019t: use jargon, exclamation points, or hype.', onChange: (e) => onChange({ guidelines: e.target.value }), className: TEXTAREA_CLASS }), _jsxs("p", { className: "text-muted-foreground mt-1 text-sm", children: [value.guidelines.length, "/", GUIDELINES_MAX] })] }), _jsxs("div", { children: [_jsxs("label", { htmlFor: sampleId, className: LABEL_CLASS, children: ["Sample copy ", _jsx("span", { className: "text-muted-foreground font-normal", children: "(optional)" })] }), _jsx("textarea", { id: sampleId, value: value.sampleText, disabled: disabled, maxLength: SAMPLE_MAX, placeholder: "Paste a paragraph of on-brand copy the AI can pattern-match against.", onChange: (e) => onChange({ sampleText: e.target.value }), className: TEXTAREA_CLASS }), _jsxs("p", { className: "text-muted-foreground mt-1 text-sm", children: [value.sampleText.length, "/", SAMPLE_MAX] })] })] })] }) }));
}
//# sourceMappingURL=BrandVoiceCard.js.map