/* Modals: EventModal (create/edit), DayPeek (overflow list) */

const TIME_OPTS = (() => {
  const arr = [];
  for (let m = 0; m < 24 * 60; m += 30) arr.push({ v: m, label: fmtTime(m) });
  return arr;
})();

function EventModal({ draft, groups, onClose, onSave, onDelete, onDuplicate }) {
  const [d, setD] = React.useState(draft);
  const set = (patch) => setD(prev => ({ ...prev, ...patch }));
  const isEdit = !!draft.id;
  const titleRef = React.useRef(null);
  React.useEffect(() => { if (titleRef.current) titleRef.current.focus(); }, []);

  const save = () => {
    if (!d.title.trim()) { if (titleRef.current) titleRef.current.focus(); return; }
    onSave({ ...d, end: d.allDay ? d.start : Math.max(d.end, d.start + 30) });
  };

  return React.createElement('div', { className: 'scrim', onMouseDown: onClose },
    React.createElement('div', { className: 'modal', onMouseDown: (e) => e.stopPropagation() },
      React.createElement('div', { className: 'modal-head' },
        React.createElement('h3', null, isEdit ? 'Edit event' : 'New event'),
        React.createElement('button', { className: 'icon-btn', onClick: onClose }, React.createElement(Icons.x, { size: 18 }))),
      React.createElement('div', { className: 'modal-body' },
        React.createElement('div', { className: 'field' },
          React.createElement('input', {
            ref: titleRef, className: 'input title-input', placeholder: 'Add title',
            value: d.title, onChange: (e) => set({ title: e.target.value }),
            onKeyDown: (e) => { if (e.key === 'Enter') save(); },
          })),
        React.createElement('div', { className: 'field' },
          React.createElement('label', null, 'Group'),
          React.createElement('div', { className: 'group-picker' },
            groups.map(g => React.createElement('button', {
              key: g.id, className: 'gp' + (d.group === g.id ? ' on' : ''),
              style: { '--cc': g.color }, onClick: () => set({ group: g.id }),
            }, React.createElement('span', { className: 'gp-dot' }), g.name)))),
        React.createElement('div', { className: 'field' },
          React.createElement('label', null, 'Date'),
          React.createElement('input', {
            type: 'date', className: 'input', value: d.key,
            onChange: (e) => set({ key: e.target.value }),
          }),
          // Quick-move chips — pull a past event onto a day in one tap.
          React.createElement('div', { className: 'quick-days' },
            (() => {
              const T = new Date();
              const fromKey = (k, n) => { const [y, m, dd] = k.split('-').map(Number); return dateKey(addDays(new Date(y, m - 1, dd), n)); };
              const chip = (label, key) => React.createElement('button', {
                key: label, type: 'button',
                className: 'qd' + (d.key === key ? ' on' : ''),
                onClick: () => set({ key }),
              }, label);
              return [
                chip('Today', dateKey(T)),
                chip('Tomorrow', dateKey(addDays(T, 1))),
                React.createElement('button', { key: 'p1', type: 'button', className: 'qd', onClick: () => set({ key: fromKey(d.key, 1) }) }, '+1 day'),
                React.createElement('button', { key: 'p7', type: 'button', className: 'qd', onClick: () => set({ key: fromKey(d.key, 7) }) }, '+1 week'),
              ];
            })())),
        React.createElement('label', { className: 'switch' + (d.allDay ? '' : ' on'), onClick: () => set({ allDay: !d.allDay }) },
          React.createElement('span', { className: 'switch-track' }, React.createElement('span', { className: 'switch-knob' })),
          React.createElement('span', { className: 'switch-label' }, 'Add time'),
          d.allDay ? React.createElement('span', { className: 'switch-hint' }, 'all-day') : null),
        d.allDay ? null : React.createElement('div', { className: 'row2' },
          React.createElement('div', { className: 'field' },
            React.createElement('label', null, 'Starts'),
            React.createElement('select', {
              className: 'select', value: d.start,
              onChange: (e) => { const v = +e.target.value; set({ start: v, end: Math.max(d.end, v + 30) }); },
            }, TIME_OPTS.map(t => React.createElement('option', { key: t.v, value: t.v }, t.label)))),
          React.createElement('div', { className: 'field' },
            React.createElement('label', null, 'Ends'),
            React.createElement('select', {
              className: 'select', value: d.end,
              onChange: (e) => set({ end: +e.target.value }),
            }, TIME_OPTS.filter(t => t.v > d.start).map(t => React.createElement('option', { key: t.v, value: t.v }, t.label))))),
        React.createElement('div', { className: 'field' },
          React.createElement('label', null, 'Location'),
          React.createElement('input', {
            className: 'input', placeholder: 'Add location', value: d.location,
            onChange: (e) => set({ location: e.target.value }),
          })),
        React.createElement('div', { className: 'field' },
          React.createElement('label', null, 'Notes'),
          React.createElement('textarea', {
            className: 'input textarea', placeholder: 'Add notes', value: d.notes,
            onChange: (e) => set({ notes: e.target.value }),
          }))),
      React.createElement('div', { className: 'modal-foot' },
        isEdit
          ? React.createElement('div', { style: { display: 'flex', gap: 8 } },
              React.createElement('button', { className: 'btn-ghost danger', onClick: () => { if (confirm('Delete "' + (d.title || 'this event') + '"?')) onDelete(d.id); } },
                React.createElement(Icons.trash, { size: 15 }), 'Delete'),
              onDuplicate ? React.createElement('button', { className: 'btn-ghost', title: 'Make a copy on the chosen date (keeps the original)', onClick: () => onDuplicate({ ...d }) },
                React.createElement(Icons.plus, { size: 15 }), 'Duplicate') : null)
          : React.createElement('span', null),
        React.createElement('div', { style: { display: 'flex', gap: 8 } },
          React.createElement('button', { className: 'btn-ghost', onClick: onClose }, 'Cancel'),
          React.createElement('button', { className: 'btn-solid', onClick: save },
            React.createElement(Icons.check, { size: 15, sw: 2.5 }), isEdit ? 'Save' : 'Add event')))));
}

function DayPeek({ date, list, groupColor, onClose, onOpen, onNew }) {
  return React.createElement('div', { className: 'scrim', onMouseDown: onClose },
    React.createElement('div', { className: 'modal', style: { width: 380 }, onMouseDown: (e) => e.stopPropagation() },
      React.createElement('div', { className: 'modal-head' },
        React.createElement('h3', null, WEEKDAYS[mondayIndex(date)] + ', ' + MONTHS[date.getMonth()].slice(0, 3) + ' ' + date.getDate()),
        React.createElement('button', { className: 'icon-btn', onClick: onClose }, React.createElement(Icons.x, { size: 18 }))),
      React.createElement('div', { className: 'modal-body' },
        React.createElement('div', { className: 'daypeek-list' },
          list.map(e => React.createElement('div', {
            key: e.id, className: 'daypeek-row', style: { '--cc': groupColor(e.group) },
            onClick: () => onOpen(e),
          },
            React.createElement('span', { className: 'daypeek-time' }, e.allDay ? 'All day' : fmtTime(e.start)),
            React.createElement('span', { className: 'daypeek-title' }, e.title))))),
      React.createElement('div', { className: 'modal-foot', style: { justifyContent: 'flex-end' } },
        React.createElement('button', { className: 'btn-solid', onClick: () => onNew(date) },
          React.createElement(Icons.plus, { size: 15, sw: 2.5 }), 'Add event'))));
}

Object.assign(window, { EventModal, DayPeek });