/**
 * Shared (free-eligible) WAI-ARIA radio-group helpers for the swatch renderer.
 *
 * Lives OUTSIDE src/frontend/extension/ so BOTH the free SwatchGroup and the Pro
 * ExtensionSwatchGroup import the SAME logic and render an identical a11y tree.
 * Pure/DOM-reading functions only — no React, no extension imports.
 *
 * Implements the WAI-ARIA Radio Group pattern: one tab stop per group (roving
 * tabindex), Arrow keys move + select, Home/End jump, Space/Enter select.
 * Disabled swatches never enter the roving order. Out-of-stock swatches remain
 * arrow-reachable only while the current settings leave them interactive;
 * hidden or explicitly disabled OOS swatches are excluded as well.
 */

import {
  isRtlElement,
  resolveRovingIndex,
  rovingTabIndex,
} from "./rovingFocus";

export interface RovingContext {
  /** Values disabled by the native WooCommerce option state. */
  disabledValues?: Iterable<string>;
  /** Values considered out of stock for the current variation set. */
  outOfStockValues?: Iterable<string>;
  /** Single-product OOS behavior: "hide" removes options from the order. */
  outOfStockBehavior?: string;
  /** Whether visible out-of-stock options are disabled. */
  outOfStockDisable?: boolean;
}

export interface RadioKeyResult {
  /** The value whose radio should become focused/tabbable. */
  targetValue: string;
  /** Whether this key expresses an intent to select (caller still gates on disabled). */
  selectIntent: boolean;
}

function toSet(values: Iterable<string> | undefined): Set<string> {
  if (!values) return new Set();
  return values instanceof Set ? values : new Set(values);
}

/**
 * Turn an attribute slug into a human label as a last-resort accessible name.
 * "attribute_pa_color" -> "Color", "attribute_size" -> "Size".
 */
export function deriveAttributeLabel(name: string): string {
  let slug = String(name || "").trim();
  slug = slug.replace(/^attribute_/i, "").replace(/^pa_/i, "");
  slug = slug.replace(/[_-]+/g, " ").trim();
  if (!slug) return "";
  return slug.replace(/\b\w/g, (c) => c.toUpperCase());
}

function findLabelFor(doc: Document, id: string): Element | null {
  const view = doc.defaultView as (Window & typeof globalThis) | null;
  const escape = view?.CSS?.escape;
  if (typeof escape === "function") {
    return doc.querySelector(`label[for="${escape(id)}"]`);
  }
  const labels = doc.querySelectorAll("label[for]");
  for (const label of Array.from(labels)) {
    if (label.getAttribute("for") === id) {
      return label;
    }
  }
  return null;
}

/**
 * Resolve the radiogroup's accessible name from the native select WooCommerce
 * renders: its <label for>, else aria-label, else a slug-derived label, else a
 * generic fallback. Never returns empty (WCAG 4.1.2 — the group must be named).
 */
export function getAttributeAccessibleName(
  select: HTMLSelectElement | null | undefined,
  fallback = "Choose an option",
): string {
  if (!select) return fallback;

  const doc = select.ownerDocument;
  const id = select.id;
  if (doc && id) {
    const label = findLabelFor(doc, id);
    const text = label?.textContent?.trim();
    if (text) return text;
  }

  const aria = select.getAttribute("aria-label")?.trim();
  if (aria) return aria;

  const derived = deriveAttributeLabel(
    select.getAttribute("name") || select.name || "",
  );
  return derived || fallback;
}

/**
 * The ordered list of FOCUSABLE radio values. Empty placeholder values are
 * dropped; disabled values are never focusable; hidden or explicitly disabled
 * OOS values are dropped. Interactive blur/cross OOS values remain in order.
 */
export function buildRovingOrder(
  options: readonly string[],
  ctx: RovingContext = {},
): string[] {
  const disabled = toSet(ctx.disabledValues);
  const oos = toSet(ctx.outOfStockValues);
  const disableOutOfStock =
    ctx.outOfStockDisable === true || ctx.outOfStockBehavior === "hide";
  return options.filter(
    (value) =>
      value !== "" &&
      value != null &&
      !disabled.has(value) &&
      !(disableOutOfStock && oos.has(value)),
  );
}

/**
 * Which value should hold the single tab stop: the selected value when it is
 * still focusable, otherwise the first focusable value, otherwise "".
 */
export function getRovingTarget(
  focusableValues: readonly string[],
  selectedValue: string,
): string {
  const selectedIndex = focusableValues.indexOf(selectedValue);
  const rovingIndex = focusableValues.findIndex(
    (value, index) =>
      rovingTabIndex(value === selectedValue, index, selectedIndex) === 0,
  );

  return rovingIndex >= 0 ? focusableValues[rovingIndex] : "";
}

/**
 * Pure keyboard resolver for a radiogroup keydown. Returns the value to focus
 * and whether selection is intended, or null for keys we do not handle.
 * Horizontal arrows are RTL-aware; vertical arrows follow DOM order regardless.
 * Movement wraps at the ends (standard radio pattern).
 */
export function resolveRadioKey(
  key: string,
  currentValue: string,
  focusableValues: readonly string[],
  rtl = false,
): RadioKeyResult | null {
  const count = focusableValues.length;
  if (count === 0) return null;

  if (key === " " || key === "Spacebar" || key === "Enter") {
    return { targetValue: currentValue, selectIntent: true };
  }

  const targetIndex = resolveRovingIndex(
    key,
    focusableValues.indexOf(currentValue),
    count,
    "both",
    rtl,
  );

  return targetIndex === null
    ? null
    : { targetValue: focusableValues[targetIndex], selectIntent: true };
}

/**
 * Whether the current document/context is right-to-left.
 */
export function isRtlContext(
  el: Element | null | undefined,
  doc?: Document,
): boolean {
  const ownerDoc = doc || el?.ownerDocument;
  return isRtlElement(el ?? ownerDoc?.documentElement);
}