// Shared sample data + small primitive components.
// v3 — refreshed palette names matching styles.css

const KID_COLORS_V3 = {
  mango:      { hex: '#FF6B2C', soft: '#FFE3D3' },
  mint:       { hex: '#00C896', soft: '#C2F0E3' },
  periwinkle: { hex: '#6979F8', soft: '#DAE0FE' },
  blush:      { hex: '#FFB7C8', soft: '#FFE0E8' },
  butter:     { hex: '#FFD23F', soft: '#FFF1B8' },
  berry:      { hex: '#C73E8B', soft: '#F8D2E7' },
};
// alias for older callers
const KID_COLORS = Object.fromEntries(
  Object.entries(KID_COLORS_V3).map(([k, v]) => [k, { bg: v.hex, soft: v.soft, hex: v.hex }])
);

const SAMPLE_FAMILY = {
  name: 'The Iyer Family',
  parents: [
    { id: 'p1', name: 'Anita Iyer',  role: 'Parent',    email: 'anita@example.com',  initials: 'AI', color: 'periwinkle' },
    { id: 'p2', name: 'Rohan Iyer',  role: 'Co-parent', email: 'rohan@example.com',  initials: 'RI', color: 'mint',       pending: true },
  ],
  kids: [
    { id: 'k1', name: 'Maya',  age: 8,  initials: 'M', color: 'mango',      points: 142, streak: 5,  goalLabel: 'New art set',  goalAt: 200 },
    { id: 'k2', name: 'Arjun', age: 5,  initials: 'A', color: 'mint',       points: 78,  streak: 2,  goalLabel: 'Zoo trip',      goalAt: 120 },
    { id: 'k3', name: 'Ishaan',age: 11, initials: 'I', color: 'periwinkle', points: 215, streak: 12, goalLabel: 'New game',      goalAt: 250 },
  ],
};

// The 4 good + 4 bad behaviors every new kid gets seeded with on creation.
// Parents can edit / delete / add more from the Tasks screen after onboarding.
const DEFAULT_STARTER_TASKS = [
  { emoji: '🦷', label: 'Brushed teeth',           points:  2, kind: 'good' },
  { emoji: '📚', label: 'Read a book',             points:  5, kind: 'good' },
  { emoji: '🧹', label: 'Tidied up',               points:  3, kind: 'good' },
  { emoji: '🤝', label: 'Was kind / helpful',      points:  5, kind: 'good' },
  { emoji: '📱', label: 'Refused screen-off',      points: -2, kind: 'bad'  },
  { emoji: '😡', label: 'Yelled / lost temper',    points: -3, kind: 'bad'  },
  { emoji: '🥱', label: 'Skipped chore',           points: -2, kind: 'bad'  },
  { emoji: '🤜', label: 'Unkind to sibling',       points: -3, kind: 'bad'  },
];

const SAMPLE_TASKS = [
  { id: 't1',  emoji: '🦷', label: 'Brush teeth (morning + night)', points:  3, kind: 'good', cadence: 'Daily',  assignedTo: ['k1','k2','k3'] },
  { id: 't2',  emoji: '📚', label: 'Read for 20 minutes',           points:  5, kind: 'good', cadence: 'Daily',  assignedTo: ['k1','k3'] },
  { id: 't3',  emoji: '🧺', label: 'Tidy up toys after playing',    points:  4, kind: 'good', cadence: 'Daily',  assignedTo: ['k1','k2'] },
  { id: 't4',  emoji: '🍽️', label: 'Help set the table',            points:  3, kind: 'good', cadence: 'Daily',  assignedTo: ['k1','k2','k3'] },
  { id: 't5',  emoji: '🏃', label: 'Outdoor play (no screens)',     points:  6, kind: 'good', cadence: 'Daily',  assignedTo: ['k1','k2','k3'] },
  { id: 't6',  emoji: '🤝', label: 'Share with sibling',            points:  4, kind: 'good', cadence: 'As it happens', assignedTo: ['k1','k2','k3'] },
  { id: 't7',  emoji: '🛏️', label: 'Make bed without reminder',     points:  2, kind: 'good', cadence: 'Daily',  assignedTo: ['k1','k3'] },
  { id: 't8',  emoji: '😤', label: 'Tantrum or yelling',            points: -3, kind: 'bad',  cadence: 'As it happens', assignedTo: ['k1','k2','k3'] },
  { id: 't9',  emoji: '📵', label: 'Sneak screen time',             points: -5, kind: 'bad',  cadence: 'As it happens', assignedTo: ['k1','k3'] },
  { id: 't10', emoji: '🙊', label: 'Talk back rudely',              points: -4, kind: 'bad',  cadence: 'As it happens', assignedTo: ['k1','k2','k3'] },
  { id: 't11', emoji: '🤥', label: 'Lie to a parent',               points: -6, kind: 'bad',  cadence: 'As it happens', assignedTo: ['k1','k2','k3'] },
];

const SAMPLE_BUCKETS = [
  { id: 'b1', emoji: '📺', label: 'Screen time', unit: 'min', rate: 1,  color: 'periwinkle', note: '1 star buys 1 minute',         character: 'guitar'   },
  { id: 'b2', emoji: '🍭', label: 'Treats',      unit: 'pts', rate: 20, color: 'blush',      note: 'A toy, a snack, a surprise',   character: 'yummy'    },
  { id: 'b3', emoji: '✈️', label: 'Travel',      unit: 'pts', rate: 50, color: 'butter',     note: 'For our next family trip',     character: 'traveler' },
  { id: 'b4', emoji: '🐷', label: 'Savings',     unit: '₹',   rate: 2,  color: 'mint',       note: '1 star = ₹2 in the piggy',     character: 'money'    },
  { id: 'b5', emoji: '💝', label: 'Kind heart',  unit: 'pts', rate: 30, color: 'berry',      note: 'For someone who needs it more', character: 'peace'   },
];

const SAMPLE_HISTORY = [
  { day: 'Today',     when: '8:12 AM',  who: 'k1', task: 'Brush teeth (morning + night)', emoji: '🦷', delta:  3 },
  { day: 'Today',     when: '7:50 AM',  who: 'k1', task: 'Make bed without reminder',     emoji: '🛏️', delta:  2 },
  { day: 'Today',     when: '7:10 AM',  who: 'k1', task: 'Tantrum or yelling',            emoji: '😤', delta: -3 },
  { day: 'Yesterday', when: '8:40 PM',  who: 'k1', task: 'Read for 20 minutes',           emoji: '📚', delta:  5 },
  { day: 'Yesterday', when: '6:30 PM',  who: 'k1', task: 'Help set the table',            emoji: '🍽️', delta:  3 },
  { day: 'Yesterday', when: '4:15 PM',  who: 'k1', task: 'Outdoor play (no screens)',     emoji: '🏃', delta:  6 },
  { day: 'Mon',       when: '6:00 PM',  who: 'k1', task: 'Share with sibling',            emoji: '🤝', delta:  4 },
  { day: 'Mon',       when: '3:20 PM',  who: 'k1', task: 'Talk back rudely',              emoji: '🙊', delta: -4 },
];

// ── Components ───────────────────────────────────────────────────────────
function StarIc({ size = 14, color = 'currentColor' }) {
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" fill={color} aria-hidden="true">
      <path d="M12 2.2l2.7 6.1 6.6.6-5 4.5 1.5 6.5L12 16.6 6.2 19.9l1.5-6.5-5-4.5 6.6-.6L12 2.2z"/>
    </svg>
  );
}

function KidAvatar({ kid, size = 'md', photo }) {
  const c = KID_COLORS_V3[kid.color] || KID_COLORS_V3.mango;
  const cls = `kid-avatar ${size === 'lg' ? 'lg' : ''} ${size === 'xl' ? 'xl' : ''}`;
  const style = {
    background: photo ? `url(${photo})` : c.hex,
    color: '#FFFFFF',
  };
  return (
    <div className={cls} style={style} title={kid.name}>
      {!photo && (kid.initials || kid.name?.[0])}
    </div>
  );
}

function PointsPill({ value, size = 'md' }) {
  const fs = size === 'lg' ? 26 : size === 'sm' ? 14 : 18;
  return (
    <span style={{
      display: 'inline-flex', alignItems: 'center', gap: 8,
      padding: '8px 16px',
      borderRadius: 999,
      background: 'var(--butter)',
      color: 'var(--ink)',
      fontFamily: 'var(--font-chunky)',
      fontSize: fs,
      letterSpacing: '-0.01em',
    }}>
      <StarIc size={fs - 2} color="var(--ink)" />
      {value.toLocaleString()}
    </span>
  );
}

function Eyebrow({ children, color }) {
  return <div className="eyebrow" style={{ color: color || 'var(--ink-faint)' }}>{children}</div>;
}

function ProgressBar({ value, max, color = 'var(--ink)' }) {
  const pct = Math.min(100, Math.round((value / max) * 100));
  return (
    <div className="prog">
      <div className="prog-fill" style={{ width: `${pct}%`, background: color }} />
    </div>
  );
}

function Stat({ label, value, color }) {
  return (
    <div>
      <div className="eyebrow" style={{ marginBottom: 8 }}>{label}</div>
      <div className="h-chunky" style={{ fontSize: 44, color: color || 'var(--ink)' }}>
        {value}
      </div>
    </div>
  );
}

Object.assign(window, {
  KID_COLORS, KID_COLORS_V3, SAMPLE_FAMILY, SAMPLE_TASKS, SAMPLE_BUCKETS, SAMPLE_HISTORY,
  DEFAULT_STARTER_TASKS,
  StarIc, KidAvatar, PointsPill, Eyebrow, ProgressBar, Stat,
});