@sutrata/editor 0.1.0 → 0.1.2

package/src/titlepage/TitlePageDialog.tsx

@@ -1,312 +0,0 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react'
-import type { ReactNode } from 'react'
-import { useDocument } from '../context/DocumentContext'
-import { useTranslation } from '../i18n/useTranslation'
-import { allStyles, resolveStyle } from '../styles/registry'
-import { getEditorView } from '../editor/editor-bus'
-import { applyTitlePageText } from '../editor/frontmatter-field'
-import { readTitlePage, writeTitlePage, MANAGED_KEYS } from './frontmatter-form'
-import type { TitlePageForm, PageSize } from './frontmatter-form'
-import { languageOptions } from './languages'
-
-export { OPEN_TITLE_PAGE_EVENT, openTitlePageForm } from '../editor/editor-bus'
-
-const ISO_DATE = /^\d{4}-\d{2}-\d{2}$/
-
-const TABS = ['story', 'credits', 'draft', 'contact', 'document', 'other'] as const
-type Tab = typeof TABS[number]
-
-function wordCount(s: string): number {
-  return s.split(/\s+/).filter(Boolean).length
-}
-
-interface Props {
-  onClose: () => void
-}
-
-export function TitlePageDialog({ onClose }: Props) {
-  const { ast, text, setText, mode, customStyles, showToast } = useDocument()
-  const { t } = useTranslation()
-  const data = ast.frontmatter?.data as Record<string, unknown> | undefined
-  const initial = useMemo(() => readTitlePage(data), []) // eslint-disable-line react-hooks/exhaustive-deps
-  const [form, setForm] = useState<TitlePageForm>(initial)
-  const firstFieldRef = useRef<HTMLInputElement>(null)
-  const [tab, setTab] = useState<Tab>('story')
-  const tabRefs = useRef<Partial<Record<Tab, HTMLButtonElement | null>>>({})
-
-  /** Arrow keys move between tabs (vertical tab list; left/right also work). */
-  function onTabKey(e: React.KeyboardEvent, current: Tab) {
-    const i = TABS.indexOf(current)
-    let next: Tab | undefined
-    if (e.key === 'ArrowDown' || e.key === 'ArrowRight') next = TABS[(i + 1) % TABS.length]
-    else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') next = TABS[(i - 1 + TABS.length) % TABS.length]
-    else if (e.key === 'Home') next = TABS[0]
-    else if (e.key === 'End') next = TABS[TABS.length - 1]
-    if (!next) return
-    e.preventDefault()
-    setTab(next)
-    tabRefs.current[next]?.focus()
-  }
-
-  const set = <K extends keyof TitlePageForm>(key: K, value: TitlePageForm[K]) =>
-    setForm(f => ({ ...f, [key]: value }))
-
-  useEffect(() => {
-    firstFieldRef.current?.focus()
-    const onKey = (e: KeyboardEvent) => { if (e.key === 'Escape') onClose() }
-    document.addEventListener('keydown', onKey)
-    return () => document.removeEventListener('keydown', onKey)
-  }, [onClose])
-
-  const langs = languageOptions([
-    form.lang, ...form.langSecondary, ...form.altTitles.map(a => a.lang),
-  ])
-  const langLabel = (code: string) => langs.find(l => l.code === code)?.label ?? code
-  const styles = allStyles(customStyles)
-  const defaultStyleName = resolveStyle(undefined, customStyles).name
-  const logWords = wordCount(form.logline)
-
-  // Frontmatter keys the form neither manages nor shows as a custom row: kept as is.
-  const preservedCount = data
-    ? Object.keys(data).filter(k =>
-        !(MANAGED_KEYS as readonly string[]).includes(k) &&
-        !initial.custom.some(c => c.key === k)).length
-    : 0
-
-  function save() {
-    const current = readTitlePage(ast.frontmatter?.data as Record<string, unknown> | undefined)
-    const next = writeTitlePage(text, current, form)
-    if (next !== text) {
-      applyTitlePageText(mode === 'formatted' ? getEditorView() : null, next, setText)
-      showToast(t('titlePage.saved'), 'success')
-    }
-    onClose()
-  }
-
-  return (
-    <div
-      className="cs-export-overlay"
-      role="presentation"
-      onClick={e => { if (e.target === e.currentTarget) onClose() }}
-    >
-      <div className="cs-export-dialog cs-tp-dialog" role="dialog" aria-modal="true" aria-labelledby="cs-tp-title">
-        <div className="cs-panel-header">
-          <span id="cs-tp-title" className="cs-panel-title">{t('titlePage.title')}</span>
-          <button className="cs-panel-close" onClick={onClose} aria-label={t('titlePage.cancel')}>×</button>
-        </div>
-
-        <div className="cs-tp-body">
-        <div className="cs-tp-tabs" role="tablist" aria-orientation="vertical" aria-label={t('titlePage.title')}>
-          {TABS.map(id => (
-            <button
-              key={id}
-              ref={el => { tabRefs.current[id] = el }}
-              type="button"
-              role="tab"
-              id={`cs-tp-tab-${id}`}
-              aria-selected={tab === id}
-              aria-controls={`cs-tp-panel-${id}`}
-              tabIndex={tab === id ? 0 : -1}
-              className={`cs-tp-tab${tab === id ? ' cs-tp-tab-active' : ''}`}
-              onClick={() => setTab(id)}
-              onKeyDown={e => onTabKey(e, id)}
-            >
-              {t(`titlePage.section.${id}`)}
-            </button>
-          ))}
-        </div>
-        <form
-          className="cs-tp-form"
-          onSubmit={e => { e.preventDefault(); save() }}
-        >
-          <Panel id="story" active={tab}>
-            <Field label={t('titlePage.field.title')} htmlFor="cs-tp-f-title">
-              <input id="cs-tp-f-title" ref={firstFieldRef} className="cs-tp-input" value={form.title}
-                onChange={e => set('title', e.target.value)} />
-            </Field>
-            {form.altTitles.map((alt, i) => (
-              <div className="cs-tp-row" key={i}>
-                <select aria-label={t('titlePage.field.titleLanguage')} className="cs-settings-select cs-tp-lang-select"
-                  value={alt.lang}
-                  onChange={e => set('altTitles', form.altTitles.map((a, j) => j === i ? { ...a, lang: e.target.value } : a))}>
-                  <option value="">{t('titlePage.chooseLanguage')}</option>
-                  {langs.map(l => <option key={l.code} value={l.code}>{l.label}</option>)}
-                </select>
-                <input aria-label={t('titlePage.field.titleIn')} className="cs-tp-input" value={alt.text}
-                  onChange={e => set('altTitles', form.altTitles.map((a, j) => j === i ? { ...a, text: e.target.value } : a))} />
-                <button type="button" className="cs-tp-remove" aria-label={t('titlePage.remove')}
-                  onClick={() => set('altTitles', form.altTitles.filter((_, j) => j !== i))}>×</button>
-              </div>
-            ))}
-            <button type="button" className="cs-tp-add"
-              onClick={() => set('altTitles', [...form.altTitles, { lang: '', text: '' }])}>
-              + {t('titlePage.addTitle')}
-            </button>
-            <Field label={t('titlePage.field.logline')} htmlFor="cs-tp-f-logline"
-              hint={<span className={logWords > 50 ? 'cs-tp-count-bad' : logWords > 30 ? 'cs-tp-count-warn' : 'cs-tp-count'}>
-                {t('titlePage.words').replace('{n}', String(logWords))}
-              </span>}>
-              <textarea id="cs-tp-f-logline" className="cs-tp-input" rows={2} value={form.logline}
-                onChange={e => set('logline', e.target.value)} />
-            </Field>
-          </Panel>
-
-          <Panel id="credits" active={tab}>
-            <TextField id="author" label={t('titlePage.field.author')} value={form.author} onChange={v => set('author', v)} />
-            <TextField id="credit" label={t('titlePage.field.credit')} placeholder="Written by" value={form.credit} onChange={v => set('credit', v)} />
-            <TextField id="source" label={t('titlePage.field.source')} value={form.source} onChange={v => set('source', v)} />
-            <TextField id="story" label={t('titlePage.field.story')} value={form.story} onChange={v => set('story', v)} />
-            <TextField id="screenplay" label={t('titlePage.field.screenplay')} value={form.screenplay} onChange={v => set('screenplay', v)} />
-            <TextField id="dialogue" label={t('titlePage.field.dialogue')} value={form.dialogue} onChange={v => set('dialogue', v)} />
-          </Panel>
-
-          <Panel id="draft" active={tab}>
-            <TextField id="draft" label={t('titlePage.field.draft')} placeholder="First Draft" value={form.draft} onChange={v => set('draft', v)} />
-            <TextField id="revision" label={t('titlePage.field.revision')} value={form.revision} onChange={v => set('revision', v)} />
-            <Field label={t('titlePage.field.date')} htmlFor="cs-tp-f-date">
-              <DateInput id="cs-tp-f-date" value={form.date} onChange={v => set('date', v)}
-                usePickerLabel={t('titlePage.usePicker')} useTextLabel={t('titlePage.useText')} />
-            </Field>
-          </Panel>
-
-          <Panel id="contact" active={tab}>
-            <Field label={t('titlePage.field.contact')} htmlFor="cs-tp-f-contact">
-              <textarea id="cs-tp-f-contact" className="cs-tp-input" rows={3} value={form.contact}
-                onChange={e => set('contact', e.target.value)} />
-            </Field>
-            <TextField id="copyright" label={t('titlePage.field.copyright')} placeholder="© 2026 …" value={form.copyright} onChange={v => set('copyright', v)} />
-          </Panel>
-
-          <Panel id="document" active={tab}>
-            <Field label={t('titlePage.field.lang')} htmlFor="cs-tp-f-lang">
-              <select id="cs-tp-f-lang" className="cs-settings-select" value={form.lang}
-                onChange={e => set('lang', e.target.value)}>
-                <option value="">{t('titlePage.notSet')}</option>
-                {langs.map(l => <option key={l.code} value={l.code}>{l.label}</option>)}
-              </select>
-            </Field>
-            <Field label={t('titlePage.field.langSecondary')} htmlFor="cs-tp-f-lang2">
-              <div className="cs-tp-chips">
-                {form.langSecondary.map(code => (
-                  <span className="cs-tp-chip" key={code}>
-                    {langLabel(code)}
-                    <button type="button" aria-label={`${t('titlePage.remove')} ${langLabel(code)}`}
-                      onClick={() => set('langSecondary', form.langSecondary.filter(c => c !== code))}>×</button>
-                  </span>
-                ))}
-                <select id="cs-tp-f-lang2" className="cs-settings-select" value=""
-                  onChange={e => {
-                    const code = e.target.value
-                    if (code && !form.langSecondary.includes(code)) set('langSecondary', [...form.langSecondary, code])
-                  }}>
-                  <option value="">{t('titlePage.addLanguage')}</option>
-                  {langs.filter(l => l.code !== form.lang && !form.langSecondary.includes(l.code))
-                    .map(l => <option key={l.code} value={l.code}>{l.label}</option>)}
-                </select>
-              </div>
-            </Field>
-            <Field label={t('titlePage.field.page')} htmlFor="cs-tp-f-page">
-              <select id="cs-tp-f-page" className="cs-settings-select" value={form.page}
-                onChange={e => set('page', e.target.value as PageSize)}>
-                <option value="">{t('titlePage.pageDefault')}</option>
-                <option value="A4">A4</option>
-                <option value="Letter">US Letter</option>
-              </select>
-            </Field>
-            <Field label={t('titlePage.field.style')} htmlFor="cs-tp-f-style">
-              <select id="cs-tp-f-style" className="cs-settings-select" value={form.style}
-                onChange={e => set('style', e.target.value)}>
-                <option value="">{t('titlePage.styleDefault').replace('{name}', defaultStyleName)}</option>
-                {styles.map(s => <option key={s.id} value={s.id}>{s.name}</option>)}
-                {form.style && !styles.some(s => s.id === form.style) && (
-                  <option value={form.style}>{form.style}</option>
-                )}
-              </select>
-            </Field>
-            <TextField id="watermark" label={t('titlePage.field.watermark')} placeholder="CONFIDENTIAL" value={form.watermark} onChange={v => set('watermark', v)} />
-          </Panel>
-
-          <Panel id="other" active={tab}>
-            {form.custom.map((c, i) => (
-              <div className="cs-tp-row" key={i}>
-                <input aria-label={t('titlePage.field.key')} className="cs-tp-input cs-tp-key" value={c.key}
-                  placeholder="key"
-                  onChange={e => set('custom', form.custom.map((x, j) => j === i ? { ...x, key: e.target.value } : x))} />
-                <input aria-label={t('titlePage.field.value')} className="cs-tp-input" value={c.value}
-                  onChange={e => set('custom', form.custom.map((x, j) => j === i ? { ...x, value: e.target.value } : x))} />
-                <button type="button" className="cs-tp-remove" aria-label={t('titlePage.remove')}
-                  onClick={() => set('custom', form.custom.filter((_, j) => j !== i))}>×</button>
-              </div>
-            ))}
-            <button type="button" className="cs-tp-add"
-              onClick={() => set('custom', [...form.custom, { key: '', value: '' }])}>
-              + {t('titlePage.addField')}
-            </button>
-            {preservedCount > 0 && (
-              <p className="cs-tp-note">{t('titlePage.preserved').replace('{n}', String(preservedCount))}</p>
-            )}
-          </Panel>
-        </form>
-        </div>
-
-        <div className="cs-export-actions cs-tp-actions">
-          <button type="button" className="cs-confirm-btn-cancel" onClick={onClose}>{t('titlePage.cancel')}</button>
-          <button type="button" className="cs-confirm-btn-primary" onClick={save}>{t('titlePage.save')}</button>
-        </div>
-      </div>
-    </div>
-  )
-}
-
-function Panel({ id, active, children }: { id: Tab; active: Tab; children: ReactNode }) {
-  return (
-    <div
-      role="tabpanel"
-      id={`cs-tp-panel-${id}`}
-      aria-labelledby={`cs-tp-tab-${id}`}
-      className="cs-tp-panel"
-      hidden={active !== id}
-    >
-      {children}
-    </div>
-  )
-}
-
-function Field({ label, htmlFor, hint, children }: { label: string; htmlFor: string; hint?: ReactNode; children: ReactNode }) {
-  return (
-    <div className="cs-tp-field">
-      <label className="cs-tp-label" htmlFor={htmlFor}>{label}{hint ? <> {hint}</> : null}</label>
-      {children}
-    </div>
-  )
-}
-
-function TextField({ id, label, value, placeholder, onChange }: {
-  id: string; label: string; value: string; placeholder?: string; onChange: (v: string) => void
-}) {
-  return (
-    <Field label={label} htmlFor={`cs-tp-f-${id}`}>
-      <input id={`cs-tp-f-${id}`} className="cs-tp-input" value={value} placeholder={placeholder}
-        onChange={e => onChange(e.target.value)} />
-    </Field>
-  )
-}
-
-/** Date picker for ISO dates (YYYY-MM-DD). A date already written as free text (e.g.
- *  "June 2026") stays editable as text, with a switch to the picker. */
-function DateInput({ id, value, onChange, usePickerLabel, useTextLabel }: {
-  id: string; value: string; onChange: (v: string) => void; usePickerLabel: string; useTextLabel: string
-}) {
-  const [asText, setAsText] = useState(value !== '' && !ISO_DATE.test(value))
-  return (
-    <div className="cs-tp-date">
-      {asText
-        ? <input id={id} className="cs-tp-input" value={value} onChange={e => onChange(e.target.value)} />
-        : <input id={id} type="date" className="cs-tp-input" value={ISO_DATE.test(value) ? value : ''}
-            onChange={e => onChange(e.target.value)} />}
-      <button type="button" className="cs-tp-link" onClick={() => setAsText(!asText)}>
-        {asText ? usePickerLabel : useTextLabel}
-      </button>
-    </div>
-  )
-}

package/src/titlepage/frontmatter-form.ts

@@ -1,280 +0,0 @@
-/**
- * Title page form ⇄ Sutra frontmatter.
- *
- * `readTitlePage` turns the parsed frontmatter into form state. `writeTitlePage` writes the
- * form back into the Sutra text by editing only the frontmatter lines of keys whose
- * value actually changed. Every other line (unknown keys, nested maps the form does not
- * manage, comments, ordering, formatting) is kept byte for byte, so opening the form and
- * saving without edits leaves the file unchanged.
- *
- * Values are written in the subset the parser's minimal YAML reader understands: plain
- * scalars, `key: |` block scalars, one level of nested map (multilingual `title:`), and
- * `[a, b]` flow lists (kept as strings by the parser and split by readers).
- */
-
-export type PageSize = '' | 'A4' | 'Letter'
-
-export interface AltTitle { lang: string; text: string }
-export interface CustomField { key: string; value: string }
-
-export interface TitlePageForm {
-  // Title & story
-  title: string
-  altTitles: AltTitle[]
-  logline: string
-  // Credits
-  author: string
-  credit: string
-  source: string
-  story: string
-  screenplay: string
-  dialogue: string
-  // Draft
-  draft: string
-  revision: string
-  date: string
-  // Contact & rights
-  contact: string
-  copyright: string
-  // Document settings
-  lang: string
-  langSecondary: string[]
-  page: PageSize
-  style: string
-  watermark: string
-  // Simple custom keys, editable as rows
-  custom: CustomField[]
-}
-
-/** Keys the form edits directly (in the order new keys are appended). */
-export const MANAGED_KEYS = [
-  'title', 'logline', 'author', 'credit', 'source', 'story', 'screenplay', 'dialogue',
-  'draft', 'revision', 'date', 'contact', 'copyright',
-  'lang', 'lang-secondary', 'page', 'style', 'watermark',
-] as const
-
-type ManagedKey = typeof MANAGED_KEYS[number]
-
-/** Keys kept but never shown as editable custom rows. */
-const HIDDEN_KEYS = new Set(['format'])
-
-const KEY_RE = /^([A-Za-z0-9_-]+):(.*)$/
-
-export function emptyForm(): TitlePageForm {
-  return {
-    title: '', altTitles: [], logline: '',
-    author: '', credit: '', source: '', story: '', screenplay: '', dialogue: '',
-    draft: '', revision: '', date: '',
-    contact: '', copyright: '',
-    lang: '', langSecondary: [], page: '', style: '', watermark: '',
-    custom: [],
-  }
-}
-
-function str(v: unknown): string {
-  return typeof v === 'string' ? v : v === undefined || v === null ? '' : String(v)
-}
-
-/** Split a list value: `[a, b]`, `a, b`, or an array. */
-export function splitList(v: unknown): string[] {
-  if (Array.isArray(v)) return v.map(x => str(x).trim()).filter(Boolean)
-  return str(v).replace(/^\s*\[|\]\s*$/g, '').split(',')
-    .map(x => x.trim().replace(/^['"]|['"]$/g, '')).filter(Boolean)
-}
-
-function normalizePage(v: string): PageSize {
-  const p = v.trim().toLowerCase()
-  if (p === 'a4') return 'A4'
-  if (p === 'letter' || p === 'us-letter' || p === 'usletter') return 'Letter'
-  return ''
-}
-
-/** Build form state from parsed frontmatter data. */
-export function readTitlePage(data: Record<string, unknown> | undefined): TitlePageForm {
-  const f = emptyForm()
-  if (!data) return f
-  f.lang = str(data['lang']).trim()
-
-  const title = data['title']
-  if (title && typeof title === 'object' && !Array.isArray(title)) {
-    const map = title as Record<string, unknown>
-    const keys = Object.keys(map)
-    const primary = keys.includes(f.lang) ? f.lang : keys[0]
-    if (primary !== undefined) f.title = str(map[primary])
-    f.altTitles = keys.filter(k => k !== primary).map(k => ({ lang: k, text: str(map[k]) }))
-    // Remember which language key held the main title.
-    if (primary !== undefined && !f.lang) f.lang = primary
-  } else {
-    f.title = str(title)
-  }
-
-  f.logline = str(data['logline'])
-  f.author = str(data['author'])
-  f.credit = str(data['credit'])
-  f.source = str(data['source'])
-  f.story = str(data['story'])
-  f.screenplay = str(data['screenplay'])
-  f.dialogue = str(data['dialogue'])
-  f.draft = str(data['draft'])
-  f.revision = str(data['revision'])
-  f.date = str(data['date'])
-  f.contact = str(data['contact'])
-  f.copyright = str(data['copyright'])
-  f.langSecondary = splitList(data['lang-secondary'])
-  f.page = normalizePage(str(data['page']))
-  f.style = str(data['style'])
-  f.watermark = str(data['watermark'])
-
-  const managed = new Set<string>(MANAGED_KEYS)
-  for (const [key, value] of Object.entries(data)) {
-    if (managed.has(key) || HIDDEN_KEYS.has(key)) continue
-    if (typeof value === 'string' && !value.includes('\n')) f.custom.push({ key, value })
-  }
-  return f
-}
-
-// ── Writing ─────────────────────────────────────────────────────────────────────────
-
-function scalarLines(key: string, value: string): string[] | null {
-  const v = value.replace(/\s+$/g, '')
-  if (v.trim() === '') return null
-  if (v.includes('\n')) {
-    return [`${key}: |`, ...v.split('\n').map(l => (l ? `  ${l}` : ''))]
-  }
-  return [`${key}: ${v.trim()}`]
-}
-
-function oneLine(v: string): string {
-  return v.replace(/\s*\n\s*/g, ' ').trim()
-}
-
-/** Lines for a managed key, or null to remove it. */
-function managedLines(key: ManagedKey, f: TitlePageForm): string[] | null {
-  switch (key) {
-    case 'title': {
-      const alts = f.altTitles.filter(a => a.lang.trim() && a.text.trim())
-      if (alts.length === 0) return scalarLines('title', oneLine(f.title))
-      const primaryKey = f.lang.trim() || 'und'
-      const lines = ['title:']
-      if (f.title.trim()) lines.push(`  ${primaryKey}: ${oneLine(f.title)}`)
-      for (const a of alts) if (a.lang.trim() !== primaryKey) lines.push(`  ${a.lang.trim()}: ${oneLine(a.text)}`)
-      return lines
-    }
-    case 'lang-secondary': {
-      const list = f.langSecondary.map(l => l.trim()).filter(Boolean)
-      return list.length ? [`lang-secondary: [${list.join(', ')}]`] : null
-    }
-    case 'page': return f.page ? [`page: ${f.page}`] : null
-    case 'logline': return scalarLines('logline', oneLine(f.logline))
-    case 'contact': return scalarLines('contact', f.contact)
-    default: {
-      const field = ({
-        author: f.author, credit: f.credit, source: f.source, story: f.story,
-        screenplay: f.screenplay, dialogue: f.dialogue, draft: f.draft, revision: f.revision,
-        date: f.date, copyright: f.copyright, lang: f.lang, style: f.style, watermark: f.watermark,
-      } as Record<string, string>)[key] ?? ''
-      return scalarLines(key, oneLine(field))
-    }
-  }
-}
-
-/** Semantic value of a managed key, for change detection. */
-function managedValue(key: ManagedKey, f: TitlePageForm): string {
-  return JSON.stringify(managedLines(key, f))
-}
-
-interface Entry { key: string | null; lines: string[] }
-
-function splitEntries(yamlLines: string[]): Entry[] {
-  const entries: Entry[] = []
-  for (const line of yamlLines) {
-    const m = KEY_RE.exec(line)
-    if (m) entries.push({ key: m[1]!, lines: [line] })
-    else if (entries.length > 0) entries[entries.length - 1]!.lines.push(line)
-    else entries.push({ key: null, lines: [line] })
-  }
-  return entries
-}
-
-/**
- * Write `next` into `text`'s frontmatter. `original` is the form as read from the same
- * text; only keys whose value differs between the two are rewritten.
- */
-export function writeTitlePage(text: string, original: TitlePageForm, next: TitlePageForm): string {
-  const eol = text.includes('\r\n') ? '\r\n' : '\n'
-  const lines = text.split(/\r?\n/)
-
-  let yamlLines: string[] = []
-  let bodyLines = lines
-  let hadFrontmatter = false
-  if (lines[0] === '---') {
-    const close = lines.indexOf('---', 1)
-    if (close > 0) {
-      hadFrontmatter = true
-      yamlLines = lines.slice(1, close)
-      bodyLines = lines.slice(close + 1)
-    }
-  }
-
-  const entries = splitEntries(yamlLines)
-  const present = new Set(entries.map(e => e.key).filter((k): k is string => k !== null))
-
-  // Managed keys that changed → their new lines (null = remove).
-  const changes = new Map<string, string[] | null>()
-  for (const key of MANAGED_KEYS) {
-    if (managedValue(key, original) !== managedValue(key, next)) changes.set(key, managedLines(key, next))
-  }
-  // Primary language key of a multilingual title follows `lang`.
-  if (next.altTitles.some(a => a.text.trim()) && original.lang !== next.lang) {
-    changes.set('title', managedLines('title', next))
-  }
-
-  // Custom rows: edited, removed, or added.
-  const origCustom = new Map(original.custom.map(c => [c.key, c.value]))
-  const nextCustom = new Map<string, string>()
-  for (const c of next.custom) {
-    const k = c.key.trim()
-    if (!/^[A-Za-z0-9_-]+$/.test(k) || (MANAGED_KEYS as readonly string[]).includes(k)) continue
-    nextCustom.set(k, c.value)
-  }
-  for (const [k, v] of origCustom) {
-    if (!nextCustom.has(k)) changes.set(k, null)
-    else if (nextCustom.get(k) !== v) changes.set(k, scalarLines(k, oneLine(nextCustom.get(k)!)))
-  }
-  for (const [k, v] of nextCustom) {
-    if (!origCustom.has(k)) changes.set(k, scalarLines(k, oneLine(v)))
-  }
-
-  if (changes.size === 0) return text
-
-  const out: string[] = []
-  for (const e of entries) {
-    if (e.key !== null && changes.has(e.key)) {
-      const replacement = changes.get(e.key)
-      if (replacement) out.push(...replacement)
-      changes.delete(e.key)
-    } else {
-      out.push(...e.lines)
-    }
-  }
-  // Keys not present before: managed keys in canonical order, then custom keys.
-  for (const key of MANAGED_KEYS) {
-    if (!present.has(key) && changes.has(key)) {
-      const add = changes.get(key)
-      if (add) out.push(...add)
-      changes.delete(key)
-    }
-  }
-  for (const [, add] of changes) if (add) out.push(...add)
-
-  const hasContent = out.some(l => l.trim() !== '')
-  if (!hasContent) {
-    // Everything removed: drop the frontmatter block and the blank line after it.
-    const rest = hadFrontmatter && bodyLines[0] === '' ? bodyLines.slice(1) : bodyLines
-    return rest.join(eol)
-  }
-  if (!hadFrontmatter) {
-    return ['---', ...out, '---', '', ...lines].join(eol)
-  }
-  return ['---', ...out, '---', ...bodyLines].join(eol)
-}

package/src/titlepage/languages.ts

@@ -1,37 +0,0 @@
-/** Languages offered for a document's `lang` / `lang-secondary` (BCP-47 primary tags).
- *  Indian languages first, then others commonly mixed into Indian scripts. A code found in
- *  a file but missing here is still shown (see `languageOptions`). */
-export interface LanguageOption { code: string; label: string }
-
-export const DOCUMENT_LANGUAGES: LanguageOption[] = [
-  { code: 'hi', label: 'Hindi — हिन्दी' },
-  { code: 'ta', label: 'Tamil — தமிழ்' },
-  { code: 'te', label: 'Telugu — తెలుగు' },
-  { code: 'ml', label: 'Malayalam — മലയാളം' },
-  { code: 'kn', label: 'Kannada — ಕನ್ನಡ' },
-  { code: 'bn', label: 'Bengali — বাংলা' },
-  { code: 'mr', label: 'Marathi — मराठी' },
-  { code: 'gu', label: 'Gujarati — ગુજરાતી' },
-  { code: 'pa', label: 'Punjabi — ਪੰਜਾਬੀ' },
-  { code: 'or', label: 'Odia — ଓଡ଼ିଆ' },
-  { code: 'as', label: 'Assamese — অসমীয়া' },
-  { code: 'ur', label: 'Urdu — اردو' },
-  { code: 'si', label: 'Sinhala — සිංහල' },
-  { code: 'sa', label: 'Sanskrit — संस्कृतम्' },
-  { code: 'ne', label: 'Nepali — नेपाली' },
-  { code: 'kok', label: 'Konkani — कोंकणी' },
-  { code: 'mai', label: 'Maithili — मैथिली' },
-  { code: 'bho', label: 'Bhojpuri — भोजपुरी' },
-  { code: 'tcy', label: 'Tulu — ತುಳು' },
-  { code: 'en', label: 'English' },
-  { code: 'ar', label: 'Arabic — العربية' },
-  { code: 'fr', label: 'French — Français' },
-  { code: 'es', label: 'Spanish — Español' },
-]
-
-/** The list plus any codes already in the document that it does not contain. */
-export function languageOptions(inUse: string[]): LanguageOption[] {
-  const known = new Set(DOCUMENT_LANGUAGES.map(l => l.code))
-  const extra = inUse.filter(c => c && !known.has(c)).map(c => ({ code: c, label: c }))
-  return [...DOCUMENT_LANGUAGES, ...extra]
-}

package/src/types.ts

@@ -1,7 +0,0 @@
-export type EditorMode = 'formatted' | 'source'
-
-export interface VersionEntry {
-  id: string
-  timestamp: number
-  content: string
-}

package/tests/AppBar.test.tsx

@@ -1,35 +0,0 @@
-import { describe, it, expect } from 'vitest'
-import { render, screen, fireEvent } from '@testing-library/react'
-import { DocumentProvider } from '../src/context/DocumentContext'
-import { TranslationProvider } from '../src/i18n/useTranslation'
-import { AppBar } from '../src/shell/AppBar'
-
-function renderAppBar() {
-  return render(
-    <TranslationProvider>
-      <DocumentProvider>
-        <AppBar />
-      </DocumentProvider>
-    </TranslationProvider>
-  )
-}
-
-describe('AppBar', () => {
-  it('shows the mode toggle pointing to the NEXT state (Source while formatted)', () => {
-    renderAppBar()
-    expect(screen.getByRole('button', { name: /switch to source/i })).toBeInTheDocument()
-  })
-
-  it('flips the mode toggle label on click', () => {
-    renderAppBar()
-    fireEvent.click(screen.getByRole('button', { name: /switch to source/i }))
-    expect(screen.getByRole('button', { name: /switch to formatted/i })).toBeInTheDocument()
-  })
-
-  it('toggles ribbon visibility', () => {
-    renderAppBar()
-    const btn = screen.getByRole('button', { name: /toolbar/i })
-    fireEvent.click(btn)
-    expect(btn).toBeInTheDocument()
-  })
-})