{# Reusable export form partial.
   Expects:
     export_submit_label  – button text (e.g. "Export All as CSV")
     export_info_heading  – sidebar <h2> text
     export_info_extra    – optional extra HTML for sidebar (safe)
     preview_product_json_b64  – base64 product payload (from parent context)
#}
<section class="panel grid">
  <form class="import-form" method="post" action="/export-from-product.csv" data-export-form data-curl-form="export-from-product">
    <input type="hidden" name="product_json_b64" value="{{ preview_product_json_b64 }}" />
    <h2>Export Playground</h2>
    <p class="api-note">Test canonical payload export through web route <code>POST /export-from-product.csv</code>.</p>

    <label for="preview_target_platform">Target Platform</label>
    <div class="select-wrap">
      <select id="preview_target_platform" name="target_platform" required>
        <option value="shopify">Shopify</option>
        <option value="bigcommerce">BigCommerce</option>
        <option value="wix">Wix</option>
        <option value="squarespace">Squarespace</option>
        <option value="woocommerce">WooCommerce</option>
      </select>
    </div>

    <label for="preview_weight_unit">Weight Unit</label>
    <div class="select-wrap">
      <select id="preview_weight_unit" name="weight_unit" required></select>
    </div>

    <div id="preview-bigcommerce-fields" class="conditional-fields is-hidden" aria-hidden="true">
      <label for="preview_bigcommerce_csv_format">BigCommerce CSV Format</label>
      <div class="select-wrap">
        <select id="preview_bigcommerce_csv_format" name="bigcommerce_csv_format" disabled>
          <option value="modern">Modern</option>
          <option value="legacy">Legacy</option>
        </select>
      </div>
    </div>

    <div id="preview-squarespace-fields" class="conditional-fields is-hidden" aria-hidden="true">
      <label for="preview_squarespace_product_page">Squarespace Product Page</label>
      <input id="preview_squarespace_product_page" name="squarespace_product_page" type="text" placeholder="shop" disabled />
      <label for="preview_squarespace_product_url">Squarespace Product URL</label>
      <input id="preview_squarespace_product_url" name="squarespace_product_url" type="text" placeholder="lemons" disabled />
    </div>

    <button type="submit">{{ export_submit_label }}</button>
  </form>

  <aside class="info">
    <h2>{{ export_info_heading }}</h2>
    {% if export_info_extra %}{{ export_info_extra }}{% endif %}
    <p class="method-line"><span class="method-chip">POST</span> <code>/api/v1/export/from-product.csv</code></p>
    <p class="api-note">Generated API curl:</p>
    <pre class="command-preview"><code data-command-output="export-from-product"></code></pre>
    <button type="button" class="secondary-btn" data-action="copy-command" data-copy-source="export-from-product">Copy curl</button>
    <p class="copy-status" data-copy-status="export-from-product" aria-live="polite"></p>
  </aside>
</section>