// Bundled (browser IIFE) by scripts/e2e-legacy-grid.mjs. Builds published documents from LEGACY stored HTML
// (pages saved before the data-wsb-grid hook existed) wrapped in the REAL Preview/publish head
// (exportComposedPreviewHtml: header + page + footer, as WHP handlePublish composes them; the head is byte-identical
// to WHP generateCompiledHTML, pinned on both sides by the head-parity tests).
import { exportBodyHtml, exportComposedPreviewHtml, RESPONSIVE_CSS_MINIFIED } from '../src/utils/html-export';
import { componentResolver } from '../src/components/resolver';
import olsHeader from '../tests/fixtures/legacy-grid/ols.header.html';
import olsIndex from '../tests/fixtures/legacy-grid/ols.index.html';
import olsFooter from '../tests/fixtures/legacy-grid/ols.footer.html';
import olsDesign from '../tests/fixtures/legacy-grid/ols.design.json';

type N = Record<string, any>;
const EMPTY = JSON.stringify({ ROOT: { type: { resolvedName: 'Container' }, isCanvas: true, props: { tag: 'div', style: {} }, displayName: 'Container', custom: {}, hidden: false, nodes: [], linkedNodes: {} } });
const defaults = (type: string): Record<string, unknown> => {
  const c = (componentResolver as any)[type];
  return c?.craft?.props ? JSON.parse(JSON.stringify(c.craft.props)) : {};
};
const node = (type: string, props: Record<string, unknown>, extra: N = {}) => ({
  type: { resolvedName: type }, isCanvas: type === 'Container', props: { ...defaults(type), ...props }, displayName: type,
  custom: {}, hidden: false, nodes: [], linkedNodes: {}, ...extra,
});
const stripHook = (html: string) => html.replace(/ data-wsb-grid(="")?/g, '');
const doc = (body: string, title: string) => exportComposedPreviewHtml(EMPTY, body, { title, design: olsDesign as any });

/** Every card-grid emitter in its stored (pre-hook) form, Galleries whose gap collides with a card-grid
 *  signature, and an unwrapped customer grid (legacy HtmlBlock content has no data-wsb-html wrapper). */
function synthetic(): string {
  const nodes: N = {};
  const kids: string[] = [];
  const add = (id: string, type: string, props: Record<string, unknown> = {}) => { nodes[id] = node(type, props, { parent: 'ROOT' }); kids.push(id); };
  add('features', 'FeaturesGrid');
  add('t2', 'Testimonials', { columns: 2 });
  add('t3', 'Testimonials');
  add('t4', 'Testimonials', { columns: 4 });
  add('counter', 'NumberCounter', { columns: 4 });
  add('gal', 'Gallery');
  add('gal32', 'Gallery', { columns: 3, gap: '32px', lightbox: true });
  add('gal24', 'Gallery', { columns: 4, gap: '24px' });
  nodes.ROOT = node('Container', { tag: 'div', style: {} }, { nodes: kids });
  const body = stripHook(exportBodyHtml(JSON.stringify(nodes)).html);
  const customer = '<div id="customer" style="padding:16px"><div style="display:grid;grid-template-columns:repeat(3,1fr);gap:32px"><div>One</div><div>Two</div><div>Three</div></div></div>';
  return olsHeader + '\n' + body + customer + '\n' + olsFooter;
}

(window as any).wsbLegacyGridDocs = (): Record<string, string> => ({
  ols: doc(olsHeader + '\n' + olsIndex + '\n' + olsFooter, 'Home'),
  // The same page as a re-save in 2026.11.5 would store it (hook added): phones must look identical.
  olsResaved: doc(olsHeader + '\n' + olsIndex.replace('<div style="max-width:1100px;margin:0 auto;display:grid;', '<div data-wsb-grid style="max-width:1100px;margin:0 auto;display:grid;') + '\n' + olsFooter, 'Home'),
  synthetic: doc(synthetic(), 'Legacy grids'),
});
(window as any).wsbResponsiveCss = RESPONSIVE_CSS_MINIFIED;