(function (global) {
  'use strict';
  function FreeSeoSearchVisibilityView() {
    var api = global.JS_API && global.JS_API.freeSeo && global.JS_API.freeSeo.searchVisibility;
    var runsState = React.useState([]);
    var runs = runsState[0];
    var setRuns = runsState[1];
    var currentState = React.useState(null);
    var current = currentState[0];
    var setCurrent = currentState[1];
    var selectedState = React.useState(null);
    var selected = selectedState[0];
    var setSelected = selectedState[1];
    var providersState = React.useState([]);
    var providers = providersState[0];
    var setProviders = providersState[1];
    var busyState = React.useState(false);
    var busy = busyState[0];
    var setBusy = busyState[1];
    var errorState = React.useState(null);
    var error = errorState[0];
    var setError = errorState[1];

    function refresh() {
      if (!api) return;
      api.providers().then(function (res) { setProviders(res.providers || []); }).catch(function () {});
      api.listRuns({ limit: 20 }).then(function (res) { setRuns(res.runs || []); }).catch(function (err) { setError(err.message); });
    }

    React.useEffect(refresh, []);

    function createRun(payload) {
      setBusy(true);
      setError(null);
      api.createRun(payload).then(function (res) {
        setCurrent(res.run);
        setSelected((res.run.queryResults || [])[0] || null);
        refresh();
      }).catch(function (err) {
        setError(err.message || 'Unable to create run.');
      }).finally(function () { setBusy(false); });
    }

    function openRun(run) {
      api.getRun(run.id).then(function (res) {
        setCurrent(res.run);
        setSelected((res.run.queryResults || [])[0] || null);
      }).catch(function (err) { setError(err.message); });
    }

    if (!api) return React.createElement('p', null, 'Search Visibility client is not loaded.');

    return React.createElement('main', { className: 'free-seo-lab-view search-visibility-view' },
      React.createElement('header', { className: 'free-seo-hero' },
        React.createElement('p', { className: 'eyebrow' }, 'Free SEO Lab'),
        React.createElement('h1', null, 'Search Visibility Sampler'),
        React.createElement('p', null, 'Sample key-free manual, offline, or configured SearXNG results to see where the target domain appears for AI-search and local SEO questions.')
      ),
      error ? React.createElement('div', { className: 'alert alert-error' }, error) : null,
      React.createElement(global.SearchVisibilityConfigPanel, { providers: providers }),
      React.createElement(global.SearchVisibilityRunForm, { onSubmit: createRun, busy: busy }),
      current ? React.createElement('section', { className: 'free-seo-card' },
        React.createElement('h2', null, 'Latest sample: ', current.targetDomain),
        React.createElement(global.SearchVisibilityScoreCards, { summary: current.summary }),
        React.createElement(global.SearchVisibilityQueryTable, { rows: current.queryResults || [], onSelect: setSelected }),
        React.createElement(global.SearchVisibilityResultList, { result: selected }),
        React.createElement(global.SearchVisibilityOpportunityPanel, { recommendations: current.recommendations || [] })
      ) : null,
      React.createElement('section', { className: 'free-seo-card' },
        React.createElement('h3', null, 'Recent runs'),
        React.createElement('ul', { className: 'free-seo-run-list' }, runs.map(function (run) {
          return React.createElement('li', { key: run.id },
            React.createElement('button', { type: 'button', onClick: function () { openRun(run); } },
              run.targetDomain, ' - ', run.provider, ' - ', run.summary ? run.summary.overallScore + '/100' : run.status
            )
          );
        }))
      )
    );
  }
  global.FreeSeoSearchVisibilityView = FreeSeoSearchVisibilityView;
}(window));