@syntrologie/adapt-search 2.8.0-canary.568

package/dist/chunk-3KPQ5AOG.js

@@ -0,0 +1,1389 @@
+import {
+  external_exports,
+  skeletonRegions
+} from "./chunk-NKOTQPVZ.js";
+
+// ../../../node_modules/@lit/context/lib/create-context.js
+function n(n2) {
+  return n2;
+}
+
+// ../../sdk-contracts/dist/canvas-context.js
+var canvasRuntimeContext = n("syntrologie:canvas-runtime");
+
+// ../../sdk-contracts/dist/detector-events.js
+var DETECTOR_EVENT_NAMES = [
+  "ui.hover",
+  "ui.idle",
+  "ui.hesitate",
+  "ui.rage_click",
+  "ui.scroll_thrash",
+  "ui.focus_bounce"
+];
+var CANONICAL_BUS_EVENT_NAMES = [
+  ...DETECTOR_EVENT_NAMES,
+  "nav.section_viewed",
+  "nav.scroll_depth"
+];
+
+// ../../sdk-contracts/dist/mount-plumbing.js
+var MOUNT_PLUMBING_KEYS = ["instanceId", "runtime", "tileId"];
+function stripMountPlumbing(config) {
+  if (!config || typeof config !== "object") {
+    return {};
+  }
+  const out = { ...config };
+  for (const key of MOUNT_PLUMBING_KEYS) {
+    delete out[key];
+  }
+  return out;
+}
+
+// ../../sdk-contracts/dist/routes.js
+var RESERVED_BYTES = /* @__PURE__ */ new Set([
+  33,
+  // !
+  35,
+  // #
+  36,
+  // $
+  38,
+  // &
+  39,
+  // '
+  40,
+  // (
+  41,
+  // )
+  42,
+  // *
+  43,
+  // +
+  44,
+  // ,
+  47,
+  // /
+  58,
+  // :
+  59,
+  // ;
+  61,
+  // =
+  63,
+  // ?
+  64,
+  // @
+  91,
+  // [
+  93
+  // ]
+]);
+var utf8Decoder = new TextDecoder("utf-8", { fatal: false });
+function decodeUnreservedOnly(input) {
+  let out = "";
+  let pending = [];
+  const flushPending = () => {
+    if (pending.length === 0)
+      return;
+    const bytes = new Uint8Array(pending);
+    out += utf8Decoder.decode(bytes);
+    pending = [];
+  };
+  let i2 = 0;
+  while (i2 < input.length) {
+    const ch = input[i2];
+    if (ch === "%" && i2 + 2 < input.length && isHex(input[i2 + 1]) && isHex(input[i2 + 2])) {
+      const byte = parseInt(input.slice(i2 + 1, i2 + 3), 16);
+      if (RESERVED_BYTES.has(byte)) {
+        flushPending();
+        out += `%${input.slice(i2 + 1, i2 + 3).toUpperCase()}`;
+        i2 += 3;
+      } else {
+        pending.push(byte);
+        i2 += 3;
+      }
+    } else {
+      flushPending();
+      out += ch;
+      i2 += 1;
+    }
+  }
+  flushPending();
+  return out;
+}
+function isHex(c2) {
+  return c2 >= "0" && c2 <= "9" || c2 >= "a" && c2 <= "f" || c2 >= "A" && c2 <= "F";
+}
+function stripQueryAndHash(s4) {
+  const q = s4.indexOf("?");
+  if (q !== -1)
+    s4 = s4.slice(0, q);
+  const h = s4.indexOf("#");
+  if (h !== -1)
+    s4 = s4.slice(0, h);
+  return s4;
+}
+function normalizeRoute(path) {
+  if (typeof path !== "string" || path.length === 0) {
+    throw new TypeError("normalizeRoute: input must be a non-empty string");
+  }
+  if (!path.startsWith("/")) {
+    throw new TypeError(`normalizeRoute: input must be absolute (start with '/'); got ${JSON.stringify(path)}`);
+  }
+  let s4 = stripQueryAndHash(path);
+  s4 = decodeUnreservedOnly(s4);
+  s4 = s4.replace(/\/+/g, "/");
+  if (s4.length > 1 && s4.endsWith("/"))
+    s4 = s4.slice(0, -1);
+  return s4;
+}
+
+// ../../sdk-contracts/dist/schemas.js
+var NO_CSS_BREAKOUT_PATTERN = /^[^{}]*$/;
+var AnchorIdZ = external_exports.object({
+  selector: external_exports.string().regex(NO_CSS_BREAKOUT_PATTERN, {
+    message: 'selector must not contain "{" or "}" \u2014 not valid CSS selector syntax, and content:hideBySelector injects this value directly into a <style> element where these characters would break out of the generated rule.'
+  }).describe("CSS selector for the target element"),
+  route: external_exports.union([external_exports.string(), external_exports.array(external_exports.string())]).superRefine((value, ctx) => {
+    for (const route of Array.isArray(value) ? value : [value]) {
+      let canonical;
+      try {
+        canonical = normalizeRoute(route);
+      } catch (err) {
+        ctx.addIssue({
+          code: external_exports.ZodIssueCode.custom,
+          message: `route must be an absolute path starting with "/" (got ${JSON.stringify(route)}): ${err instanceof Error ? err.message : String(err)}`
+        });
+        continue;
+      }
+      if (canonical !== route) {
+        ctx.addIssue({
+          code: external_exports.ZodIssueCode.custom,
+          message: `route ${JSON.stringify(route)} is not canonical \u2014 use ${JSON.stringify(canonical)} (this must match what the backend's RouteCanonicalityCheck accepts)`
+        });
+      }
+    }
+  }).describe("URL path(s) where this element exists")
+}).strict().describe("DOM element target. selector = CSS selector, route = URL path(s) where the element exists.");
+var AuthoringFieldsZ = {
+  id: external_exports.string().optional().describe('Stable action identifier (e.g. "act_3db6a14d2ab0").'),
+  title: external_exports.string().max(200).optional().describe("Authoring-only: short label shown on the action plan dashboard. Stripped before serving to the runtime SDK."),
+  description: external_exports.string().max(1e3).optional().describe("Authoring-only: one-sentence explanation of what this action does and why. Stripped before serving to the runtime SDK."),
+  validation: external_exports.array(external_exports.string().max(500)).max(10).optional().describe("Authoring-only: ordered steps a reviewer can follow to trigger this action and visually confirm it works. Each entry is one step. Stripped before serving to the runtime SDK.")
+};
+var COUNTABLE_EVENTS = [
+  // User interactions (from PostHog autocapture normalization)
+  "ui.click",
+  "ui.scroll",
+  "ui.input",
+  "ui.change",
+  "ui.submit",
+  // Behavioral detectors (from event-processor)
+  "ui.hover",
+  "ui.idle",
+  "ui.scroll_thrash",
+  "ui.focus_bounce",
+  "ui.hesitate",
+  "ui.rage_click",
+  // Navigation
+  "nav.page_view",
+  "nav.page_leave"
+];
+var CountableEventZ = external_exports.enum(COUNTABLE_EVENTS).describe("Event name to count. ui.* = user interactions and behavioral detectors (hesitate, rage_click, scroll_thrash, focus_bounce, idle, hover); nav.* = page navigation.");
+var SESSION_METRIC_KEYS = ["time_on_page", "page_views", "scroll_depth"];
+var SessionMetricKeyZ = external_exports.enum(SESSION_METRIC_KEYS).describe("Session metric key. time_on_page = seconds on current page, page_views = pages visited this session, scroll_depth = 0-100 percentage.");
+var PageUrlConditionZ = external_exports.object({
+  type: external_exports.literal("page_url"),
+  url: external_exports.string().describe('URL path to match (e.g. "/pricing", "/dashboard")')
+}).describe('Fires when the current page URL matches. Use for page-specific actions. Example: {"type": "page_url", "url": "/pricing"}');
+var RouteConditionZ = external_exports.object({
+  type: external_exports.literal("route"),
+  routeId: external_exports.string().describe("Named route ID from the route filter")
+}).describe("Fires when the current route matches a named route ID.");
+var AnchorVisibleConditionZ = external_exports.object({
+  type: external_exports.literal("anchor_visible"),
+  anchorId: external_exports.string().describe("CSS selector of the anchor element"),
+  state: external_exports.enum(["visible", "present", "absent"]).describe('"visible" = in viewport, "present" = in DOM, "absent" = not in DOM')
+}).describe(`Fires based on a DOM element's visibility state. Example: {"type": "anchor_visible", "anchorId": "#cta-button", "state": "visible"}`);
+var EventOccurredConditionZ = external_exports.object({
+  type: external_exports.literal("event_occurred"),
+  eventName: external_exports.string().describe('Event name (e.g. "ui.click", "$pageview")'),
+  withinMs: external_exports.number().optional().describe("Time window in ms. Omit = any time this session.")
+}).describe('Fires when a specific event has occurred during this session. Example: {"type": "event_occurred", "eventName": "ui.click", "withinMs": 5000}');
+var StateEqualsConditionZ = external_exports.object({
+  type: external_exports.literal("state_equals"),
+  key: external_exports.string().describe("Key in the SDK persistent state store (localStorage). Only valid for keys the host app explicitly sets via syntro.state.set()."),
+  value: external_exports.unknown().describe("Expected value to match against")
+}).describe("Checks the SDK persistent state store (localStorage). ONLY for host-app state set via syntro.state.set() \u2014 NOT for user attributes like region, device, or UTM params (those are handled by segment targeting). Do NOT use this for targeting. If you do not know the valid state keys, do not use this condition type.");
+var ViewportConditionZ = external_exports.object({
+  type: external_exports.literal("viewport"),
+  minWidth: external_exports.number().optional().describe("Minimum viewport width in pixels"),
+  maxWidth: external_exports.number().optional().describe("Maximum viewport width in pixels"),
+  minHeight: external_exports.number().optional().describe("Minimum viewport height in pixels"),
+  maxHeight: external_exports.number().optional().describe("Maximum viewport height in pixels")
+}).describe('Fires based on viewport (screen) size. Use for responsive behavior. Example: {"type": "viewport", "minWidth": 768} \u2014 fires on tablet and larger.');
+var SessionMetricConditionZ = external_exports.object({
+  type: external_exports.literal("session_metric"),
+  key: SessionMetricKeyZ,
+  operator: external_exports.enum(["gte", "lte", "eq", "gt", "lt"]),
+  threshold: external_exports.number().describe("Numeric threshold to compare against")
+}).describe('Fires when a session metric crosses a threshold. Valid keys: "time_on_page" (seconds), "page_views" (count), "scroll_depth" (0-100). Example: {"type": "session_metric", "key": "time_on_page", "operator": "gte", "threshold": 30}');
+var DismissedConditionZ = external_exports.object({
+  type: external_exports.literal("dismissed"),
+  key: external_exports.string().describe("Dismissal key (usually a tile or action ID)"),
+  inverted: external_exports.boolean().optional().describe("When true, fires if NOT dismissed (default behavior)")
+}).describe("Checks if an item has been dismissed by the user. Use with inverted: true to show only if not dismissed.");
+var CooldownActiveConditionZ = external_exports.object({
+  type: external_exports.literal("cooldown_active"),
+  key: external_exports.string().describe("Cooldown key"),
+  inverted: external_exports.boolean().optional().describe("When true, fires if cooldown is NOT active")
+}).describe("Checks if a cooldown timer is currently active. Use to prevent showing the same intervention too frequently.");
+var FrequencyLimitConditionZ = external_exports.object({
+  type: external_exports.literal("frequency_limit"),
+  key: external_exports.string().describe("Frequency counter key"),
+  limit: external_exports.number().describe("Maximum allowed count"),
+  inverted: external_exports.boolean().optional().describe("When true, fires if limit NOT reached")
+}).describe("Checks if a frequency limit has been reached. Use to cap how many times an action fires per session.");
+var MatchOpZ = external_exports.object({
+  equals: external_exports.union([external_exports.string(), external_exports.number(), external_exports.boolean()]).optional(),
+  contains: external_exports.string().optional()
+}).refine((operator) => Number(operator.equals !== void 0) + Number(operator.contains !== void 0) === 1, {
+  message: "Exactly one of equals or contains must be specified."
+}).describe("Match operator for counter filters. Exactly one of equals or contains must be specified.");
+var CounterDefZ = external_exports.object({
+  events: external_exports.array(CountableEventZ).min(1).describe("Event names to count. Use values from the countable events enum."),
+  match: external_exports.record(external_exports.string(), MatchOpZ).optional().describe("Property filters. Keys are event prop names or element-chain fields (tag_name, $el_text, attr__*). All entries AND together.")
+}).describe("Defines what events to count. Registered as an accumulator predicate at config-load time.");
+var EventCountConditionZ = external_exports.object({
+  type: external_exports.literal("event_count"),
+  key: external_exports.string().describe("Unique key for this counter (used for accumulator registration)"),
+  operator: external_exports.enum(["gte", "lte", "eq", "gt", "lt"]),
+  count: external_exports.number().int().min(0).describe("Target count threshold"),
+  withinMs: external_exports.number().positive().optional().describe("Time window in ms. Omit = count across entire session."),
+  counter: CounterDefZ.optional().describe("Inline counter definition. Defines what events to count.")
+}).describe('Fires when accumulated event count crosses a threshold. Most powerful trigger type. Example: {"type": "event_count", "key": "pricing-clicks", "operator": "gte", "count": 3, "counter": {"events": ["ui.click"], "match": {"attr__data-cta": {"contains": "pricing"}}}}');
+var ConditionZ = external_exports.discriminatedUnion("type", [
+  PageUrlConditionZ,
+  RouteConditionZ,
+  AnchorVisibleConditionZ,
+  EventOccurredConditionZ,
+  StateEqualsConditionZ,
+  ViewportConditionZ,
+  SessionMetricConditionZ,
+  DismissedConditionZ,
+  CooldownActiveConditionZ,
+  FrequencyLimitConditionZ,
+  EventCountConditionZ
+]);
+var RuleZ = external_exports.object({
+  conditions: external_exports.array(ConditionZ).describe("Array of conditions \u2014 ALL must match (AND logic) for this rule to fire."),
+  value: external_exports.unknown().describe("Value returned when all conditions match. For triggerWhen: true = fire the action.")
+}).describe("A single rule. ALL conditions must match (AND logic). Rules in a strategy are evaluated top-to-bottom \u2014 first rule where all conditions match wins and returns its value.");
+var RuleStrategyZ = external_exports.object({
+  type: external_exports.literal("rules"),
+  rules: external_exports.array(RuleZ).describe("Ordered list of rules. Evaluated top-to-bottom \u2014 first match wins."),
+  default: external_exports.unknown().describe("Fallback value when no rule matches. For triggerWhen: false = do not fire by default.")
+}).describe("Rule-based strategy. Evaluates rules top-to-bottom. First rule where ALL conditions match returns its value. If no rule matches, returns default. For triggerWhen: set value=true on matching rules, default=false.");
+var ScoreStrategyZ = external_exports.object({
+  type: external_exports.literal("score"),
+  field: external_exports.string(),
+  threshold: external_exports.number(),
+  above: external_exports.unknown(),
+  below: external_exports.unknown()
+}).describe("Score-based strategy. Compares a field value against a threshold.");
+var ModelStrategyZ = external_exports.object({
+  type: external_exports.literal("model"),
+  modelId: external_exports.string(),
+  inputs: external_exports.array(external_exports.string()),
+  outputMapping: external_exports.record(external_exports.string(), external_exports.unknown()),
+  default: external_exports.unknown()
+}).describe("ML model strategy. Sends inputs to a model and maps outputs.");
+var ExternalStrategyZ = external_exports.object({
+  type: external_exports.literal("external"),
+  endpoint: external_exports.string(),
+  method: external_exports.enum(["GET", "POST"]).optional(),
+  default: external_exports.unknown(),
+  timeoutMs: external_exports.number().optional()
+}).describe("External API strategy. Calls an endpoint to determine the value.");
+var DecisionStrategyZ = external_exports.discriminatedUnion("type", [
+  RuleStrategyZ,
+  ScoreStrategyZ,
+  ModelStrategyZ,
+  ExternalStrategyZ
+]);
+var TriggerWhenZ = DecisionStrategyZ.nullable().optional();
+var EventScopeZ = external_exports.object({
+  events: external_exports.array(external_exports.string()),
+  urlContains: external_exports.string().optional(),
+  props: external_exports.record(external_exports.union([external_exports.string(), external_exports.number(), external_exports.boolean()])).optional()
+});
+var NotifyZ = external_exports.object({
+  title: external_exports.string().optional().describe("Notification title"),
+  body: external_exports.string().optional().describe("Notification body text"),
+  icon: external_exports.string().optional().describe("Notification icon (emoji or URL)")
+}).describe("Optional toast notification shown when this action triggers.").nullable().optional();
+
+// ../../sdk-contracts/dist/telemetry-events.js
+var entry = (e2) => e2;
+var TELEMETRY_EVENTS = {
+  // --- intervention metrics (April 2026) — wire names unchanged, all plan-scope
+  syntro_config_served: entry({
+    subject: "config",
+    verb: "served",
+    scope: "plan",
+    props: ["tiles", "actions"]
+  }),
+  syntro_intervention_seen: entry({
+    subject: "intervention",
+    verb: "seen",
+    scope: "plan",
+    props: ["intervention_id", "intervention_kind"]
+  }),
+  syntro_intervention_triggered: entry({
+    subject: "intervention",
+    verb: "triggered",
+    scope: "plan",
+    props: ["intervention_id", "intervention_kind"]
+  }),
+  syntro_intervention_interacted: entry({
+    subject: "intervention",
+    verb: "interacted",
+    scope: "plan",
+    props: ["intervention_id", "intervention_kind", "interaction_type"]
+  }),
+  // --- concierge (FEAT-1789150184) ---------------------------------------
+  syntro_concierge_opened: entry({
+    subject: "concierge",
+    verb: "opened",
+    scope: "open",
+    props: ["trigger", "page_path"]
+    // trigger: ConciergeOpenTrigger
+  }),
+  syntro_concierge_closed: entry({
+    subject: "concierge",
+    verb: "closed",
+    scope: "open",
+    props: ["duration_ms", "reason", "messages_sent", "tiles_dismissed", "pages_viewed"]
+    // reason: ConciergeCloseReason
+  }),
+  syntro_deck_paged: entry({
+    subject: "deck",
+    verb: "paged",
+    scope: "open",
+    props: ["from_index", "to_index", "method"]
+    // method: DeckPageMethod
+  }),
+  syntro_tile_dismissed: entry({
+    subject: "tile",
+    verb: "dismissed",
+    scope: "open",
+    props: ["tile_id", "tile_kind", "visible_ms"]
+  }),
+  // The three chat atoms are OPEN-scope: they carry `surface` / `open_id` and
+  // only make sense inside a concierge open. An INLINE chat bar (no concierge)
+  // still dispatches them on every turn, and the core drops each one and
+  // increments the `telemetry_dropped` health counter. That is EXPECTED on an
+  // inline-chat host page, not a bug — `telemetry_dropped` there mixes "real
+  // defect" with "inline chat has no open scope", so do not alert on it alone.
+  syntro_chat_message_sent: entry({
+    subject: "chat_message",
+    verb: "sent",
+    scope: "open",
+    props: ["turn", "chars", "via"]
+    // via: ChatSendVia
+  }),
+  syntro_chat_reply_received: entry({
+    subject: "chat_reply",
+    verb: "received",
+    scope: "open",
+    props: ["turn", "ttft_ms", "total_ms", "mounts", "cards"]
+  }),
+  syntro_chat_interrupted: entry({
+    subject: "chat",
+    verb: "interrupted",
+    scope: "open",
+    props: ["turn", "after_ms"]
+  }),
+  syntro_chat_maximize_toggled: entry({
+    subject: "chat_maximize",
+    verb: "toggled",
+    scope: "open",
+    props: ["maximized"]
+  }),
+  syntro_chat_takeover_triggered: entry({
+    subject: "chat_takeover",
+    verb: "triggered",
+    scope: "open",
+    props: ["turn"]
+  }),
+  // --- search takeover (2026-09-17) ---------------------------------------
+  // All plan-scope: the search interceptor fires before any concierge open
+  // exists. No prop here ever carries query text (SEE the contract test's
+  // no-text-prop rule) — classification/signal_hits are the interceptor's
+  // own derived signals, never the string itself.
+  syntro_search_sent: entry({
+    subject: "search",
+    verb: "sent",
+    scope: "plan",
+    props: ["classification", "word_count", "signal_hits", "entry_point", "platform"]
+    // classification: SearchClassification, entry_point: SearchEntryPoint
+  }),
+  // `ms_to_skeleton` is intentionally the only timing prop: it is always
+  // knowable the instant the surface mounts. `ms_to_first_content` is NOT
+  // declared here (revision 1 defect) because a surface that never painted
+  // content still fires this event, and a required prop it cannot supply
+  // would make TelemetryCore.emit drop exactly the row worth measuring.
+  syntro_search_surface_seen: entry({
+    subject: "search_surface",
+    verb: "seen",
+    scope: "plan",
+    props: ["variant", "classification", "result_count", "ms_to_skeleton"]
+    // variant: SearchVariant, classification: SearchClassification
+  }),
+  syntro_search_result_tapped: entry({
+    subject: "search_result",
+    verb: "tapped",
+    scope: "plan",
+    props: ["variant", "region_id", "module", "position"]
+    // variant: SearchVariant
+  }),
+  syntro_search_followup_sent: entry({
+    subject: "search_followup",
+    verb: "sent",
+    scope: "plan",
+    props: ["delta_kind", "variant"]
+    // delta_kind: SearchDeltaKind, variant: SearchVariant
+  }),
+  // Declares `ms_since_boot` (not a "since surface mounted" timing prop) so a
+  // not-ready fallback the takeover never rendered is still measurable —
+  // revision 1 emitted nothing on this path.
+  syntro_search_native_served: entry({
+    subject: "search_native",
+    verb: "served",
+    scope: "plan",
+    props: ["reason", "platform", "ms_since_boot"]
+    // reason: SearchFallbackReason
+  }),
+  syntro_search_takeover_dismissed: entry({
+    subject: "search_takeover",
+    verb: "dismissed",
+    scope: "plan",
+    props: ["variant", "reason"]
+    // variant: SearchVariant, reason: SearchDismissReason
+  })
+};
+var TELEMETRY_EVENT_NAMES = Object.keys(TELEMETRY_EVENTS);
+
+// src/SearchSurfaceElement.ts
+import { css, html as html2, LitElement, nothing as nothing2 } from "lit";
+import { repeat } from "lit/directives/repeat.js";
+
+// src/regions.ts
+import { html, nothing } from "lit";
+
+// src/hrefSafety.ts
+var ALLOWED_PROTOCOLS = /* @__PURE__ */ new Set(["http:", "https:", "mailto:", "tel:"]);
+var UNSAFE_HREF_FALLBACK = "#";
+function isSafeProductHref(href) {
+  if (typeof href !== "string" || href.trim().length === 0) return false;
+  let parsed;
+  try {
+    parsed = new URL(href, "https://syntro.local/");
+  } catch {
+    return false;
+  }
+  return ALLOWED_PROTOCOLS.has(parsed.protocol);
+}
+function safeProductHref(href) {
+  return isSafeProductHref(href) ? href : UNSAFE_HREF_FALLBACK;
+}
+
+// src/regions.ts
+var RESULT_TAP_EVENT = "syntro:search:result-tap";
+var FOLLOWUP_EVENT = "syntro:search:followup";
+var SEE_STORE_RESULTS_EVENT = "syntro:search:see-store-results";
+function dispatchFrom(node, name, detail) {
+  node.dispatchEvent(new CustomEvent(name, { detail, bubbles: true, composed: false }));
+}
+function asRecord(value) {
+  return value !== null && typeof value === "object" ? value : {};
+}
+function asString(value) {
+  return typeof value === "string" && value.length > 0 ? value : void 0;
+}
+function readProduct(value) {
+  const raw = asRecord(value);
+  const handle = asString(raw.handle);
+  const title = asString(raw.title);
+  const url = asString(raw.url);
+  if (!handle || !title || !url) return null;
+  return { handle, title, url, price: asString(raw.price), imageUrl: asString(raw.imageUrl) };
+}
+function readProducts(value) {
+  if (!Array.isArray(value)) return [];
+  return value.map(readProduct).filter((product) => product !== null);
+}
+function readStrings(value) {
+  if (!Array.isArray(value)) return [];
+  return value.filter((entry2) => typeof entry2 === "string" && entry2.length > 0);
+}
+function readChips(value) {
+  if (!Array.isArray(value)) return [];
+  return value.map((entry2) => {
+    const raw = asRecord(entry2);
+    const key = asString(raw.key);
+    const label = asString(raw.label) ?? key;
+    return key && label ? { key, label } : null;
+  }).filter((chip) => chip !== null);
+}
+function readSuggestions(value) {
+  if (!Array.isArray(value)) return [];
+  return value.map((entry2) => {
+    const raw = asRecord(entry2);
+    const suggestion = asString(raw.value);
+    const label = asString(raw.label) ?? suggestion;
+    return suggestion && label ? { value: suggestion, label } : null;
+  }).filter((entry2) => entry2 !== null);
+}
+function readFollowupBarPayload(payload) {
+  const raw = asRecord(payload);
+  return {
+    query: asString(raw.query) ?? "",
+    chips: readChips(raw.chips),
+    suggestions: readSuggestions(raw.suggestions),
+    notice: asString(raw.notice) ?? ""
+  };
+}
+var NONE_DISMISSED = /* @__PURE__ */ new Set();
+function visible(products, dismissed) {
+  return dismissed.size === 0 ? products : products.filter((product) => !dismissed.has(product.handle));
+}
+function visibleOne(product, dismissed) {
+  return product !== null && dismissed.has(product.handle) ? null : product;
+}
+function countRegionProducts(region, dismissed = NONE_DISMISSED) {
+  const raw = asRecord(region.payload);
+  switch (region.module) {
+    case "search:product-grid":
+    case "search:shortlist":
+    case "search:strip":
+      return visible(readProducts(raw.products), dismissed).length;
+    case "search:group":
+      return Array.isArray(raw.groups) ? raw.groups.reduce(
+        (total, group) => total + visible(readProducts(asRecord(group).products), dismissed).length,
+        0
+      ) : 0;
+    case "search:hero":
+    case "search:compare":
+      return visibleOne(readProduct(raw.product), dismissed) === null ? 0 : 1;
+    default:
+      return 0;
+  }
+}
+function regionHasAnswer(region, dismissed = NONE_DISMISSED) {
+  if (countRegionProducts(region, dismissed) > 0) return true;
+  if (region.module !== "search:content") return false;
+  const raw = asRecord(region.payload);
+  return readStrings(raw.blocks).length > 0 || asString(raw.body) !== void 0;
+}
+function productTile(product, region, position) {
+  const href = safeProductHref(product.url);
+  const imageHref = product.imageUrl ? safeProductHref(product.imageUrl) : void 0;
+  const detail = {
+    handle: product.handle,
+    regionId: region.id,
+    module: region.module,
+    position
+  };
+  return html`
+    <div class="tile">
+      <a
+        class="tile-link"
+        href=${href}
+        data-handle=${product.handle}
+        data-region-id=${region.id}
+        data-position=${position}
+        data-unsafe-url=${href === UNSAFE_HREF_FALLBACK ? "true" : nothing}
+        @click=${(event) => {
+    dispatchFrom(event.currentTarget, RESULT_TAP_EVENT, detail);
+  }}
+      >
+        ${imageHref && imageHref !== UNSAFE_HREF_FALLBACK ? html`<img class="tile-image" src=${imageHref} alt="" loading="lazy" />` : nothing}
+        <span class="tile-title">${product.title}</span>
+        ${product.price ? html`<span class="tile-price">${product.price}</span>` : nothing}
+      </a>
+      <button
+        class="tile-dismiss"
+        type="button"
+        data-dismiss=${product.handle}
+        aria-label=${`Hide ${product.title}`}
+        @click=${(event) => {
+    const detail2 = { kind: "item_dismissed", value: product.handle };
+    dispatchFrom(event.currentTarget, FOLLOWUP_EVENT, detail2);
+  }}
+      >
+        <span aria-hidden="true">✕</span>
+      </button>
+    </div>
+  `;
+}
+function productList(products, region, className, positionOffset = 0) {
+  return html`
+    <div class=${className}>
+      ${products.map((product, index) => productTile(product, region, positionOffset + index))}
+    </div>
+  `;
+}
+function followupBar(region) {
+  const { query, chips, suggestions, notice } = readFollowupBarPayload(region.payload);
+  return html`
+    <div class="followup">
+      <input
+        class="followup-input"
+        type="search"
+        aria-label="Refine your search"
+        .value=${query}
+        @keydown=${(event) => {
+    if (event.key !== "Enter") return;
+    const input = event.currentTarget;
+    const detail = { kind: "refine", value: input.value };
+    dispatchFrom(input, FOLLOWUP_EVENT, detail);
+  }}
+      />
+      <div class="chips" role="group" aria-label="What we understood">
+        ${chips.map(
+    (chip) => html`
+            <button
+              class="chip"
+              type="button"
+              data-chip=${chip.key}
+              aria-label=${`Remove ${chip.label}`}
+              @click=${(event) => {
+      const detail = { kind: "chip_removed", value: chip.key };
+      dispatchFrom(event.currentTarget, FOLLOWUP_EVENT, detail);
+    }}
+            >
+              <span>${chip.label}</span><span aria-hidden="true">✕</span>
+            </button>
+          `
+  )}
+      </div>
+      ${// Server prose, under the chips it explains: "Nothing under $5. Here
+  // are the closest matches." No node at all when the plan sent none,
+  // so an empty line never pushes the results down.
+  notice ? html`<p class="followup-notice">${notice}</p>` : nothing}
+      <div class="suggestions" role="group" aria-label="Suggested follow-ups">
+        ${suggestions.map(
+    (suggestion) => html`
+            <button
+              class="suggestion"
+              type="button"
+              data-suggestion=${suggestion.value}
+              @click=${(event) => {
+      const detail = { kind: "refine", value: suggestion.value };
+      dispatchFrom(event.currentTarget, FOLLOWUP_EVENT, detail);
+    }}
+            >
+              ${suggestion.label}
+            </button>
+          `
+  )}
+      </div>
+    </div>
+  `;
+}
+function groupedPicks(region, dismissed) {
+  const raw = asRecord(region.payload);
+  const groups = Array.isArray(raw.groups) ? raw.groups : [];
+  let position = 0;
+  return html`
+    ${groups.map((group) => {
+    const entry2 = asRecord(group);
+    const title = asString(entry2.title);
+    const products = visible(readProducts(entry2.products), dismissed);
+    const offset = position;
+    position += products.length;
+    return html`
+        <section class="group">
+          ${title ? html`<h3 class="group-title">${title}</h3>` : nothing}
+          ${productList(products, region, "tiles", offset)}
+        </section>
+      `;
+  })}
+  `;
+}
+function heroProduct(region, dismissed) {
+  const raw = asRecord(region.payload);
+  const product = visibleOne(readProduct(raw.product), dismissed);
+  if (!product) return nothing;
+  const reason = asString(raw.reason);
+  return html`
+    <div class="hero">
+      ${productTile(product, region, 0)}
+      ${reason ? html`<p class="hero-reason">${reason}</p>` : nothing}
+    </div>
+  `;
+}
+function compareColumn(region, dismissed) {
+  const raw = asRecord(region.payload);
+  const product = visibleOne(readProduct(raw.product), dismissed);
+  if (!product) return nothing;
+  const attributes = readStrings(raw.attributes);
+  return html`
+    <div class="compare">
+      ${productTile(product, region, 0)}
+      <ul class="compare-attributes">
+        ${attributes.map((attribute) => html`<li>${attribute}</li>`)}
+      </ul>
+    </div>
+  `;
+}
+function compactList(region, dismissed) {
+  const raw = asRecord(region.payload);
+  const title = asString(raw.title);
+  return html`
+    ${title ? html`<h3 class="group-title">${title}</h3>` : nothing}
+    ${productList(visible(readProducts(raw.products), dismissed), region, "tiles tiles-compact")}
+  `;
+}
+function contentBlocks(region) {
+  const raw = asRecord(region.payload);
+  const title = asString(raw.title);
+  const blocks = readStrings(raw.blocks);
+  const body = asString(raw.body);
+  return html`
+    ${title ? html`<h3 class="group-title">${title}</h3>` : nothing}
+    ${blocks.map((block) => html`<p class="content-block">${block}</p>`)}
+    ${body ? html`<p class="content-block">${body}</p>` : nothing}
+  `;
+}
+function chatContainer() {
+  return html`<div class="chat" data-mount data-module="search:chat"></div>`;
+}
+function renderRegionModule(region, dismissed = NONE_DISMISSED) {
+  switch (region.module) {
+    case "search:followup-bar":
+      return followupBar(region);
+    case "search:product-grid":
+      return productList(
+        visible(readProducts(asRecord(region.payload).products), dismissed),
+        region,
+        "tiles"
+      );
+    case "search:group":
+      return groupedPicks(region, dismissed);
+    case "search:hero":
+      return heroProduct(region, dismissed);
+    case "search:compare":
+      return compareColumn(region, dismissed);
+    case "search:shortlist":
+    case "search:strip":
+      return compactList(region, dismissed);
+    case "search:content":
+      return contentBlocks(region);
+    case "search:chat":
+      return chatContainer();
+    default:
+      return nothing;
+  }
+}
+
+// src/SearchSurfaceElement.ts
+var SEARCH_SURFACE_TAG = "syntro-search-surface";
+var SEE_STORE_RESULTS_LABEL = "See store results";
+var SKELETON_BLOCKS = {
+  query: 0,
+  primary: 6,
+  secondary: 3,
+  support: 2,
+  converse: 1
+};
+var SearchSurfaceElement = class extends LitElement {
+  constructor() {
+    super();
+    this._onSeeStoreResults = () => {
+      this.renderRoot.dispatchEvent(new CustomEvent(SEE_STORE_RESULTS_EVENT));
+    };
+    this._variant = null;
+    this._query = "";
+    this._filled = {};
+    this._suppressed = [];
+    this._dismissed = /* @__PURE__ */ new Set();
+    this._frozen = false;
+    this._announcement = "";
+  }
+  /**
+   * Paint the variant's skeleton. Ignored once the surface is frozen, because
+   * a server plan that lands after the first content has painted would
+   * otherwise throw away what the shopper is already reading.
+   */
+  showSkeleton(variant, query) {
+    if (this._frozen) return;
+    this._variant = variant;
+    this._query = query;
+    this._filled = {};
+    this._suppressed = [];
+    this._announcement = "";
+  }
+  /**
+   * Fill one region in place. The region keeps its position, so the page does
+   * not reflow around the shopper. A region id this variant does not own, or
+   * one already retired by `suppressRegion`, has nowhere to paint.
+   *
+   * Returns whether the region actually painted. The runtime needs that answer
+   * to tell "the plan filled a region" from "the plan addressed a variant this
+   * surface is not showing": a dropped fill counted as content would leave the
+   * shopper on a skeleton the SDK had already scored as a success.
+   */
+  fillRegion(region) {
+    if (!this._variant) return false;
+    if (this._suppressed.includes(region.id)) return false;
+    if (!skeletonRegions(this._variant).some((slot) => slot.id === region.id)) return false;
+    this.freeze();
+    this._filled = { ...this._filled, [region.id]: region };
+    this._announce();
+    return true;
+  }
+  /** Content this renderer can display, including payload validation and dismissals. */
+  getRegionContent(id) {
+    const region = this._filled[id];
+    return region ? {
+      productCount: countRegionProducts(region, this._dismissed),
+      hasAnswer: regionHasAnswer(region, this._dismissed)
+    } : { productCount: 0, hasAnswer: false };
+  }
+  /**
+   * Retire a slot the plan decided not to fill. The slot leaves the grid
+   * entirely — no skeleton, no `aria-busy`, nothing for the live region to
+   * count — and every other slot keeps its order. Left in place, a region that
+   * is never going to fill pulses beside real results for as long as the
+   * shopper reads them.
+   *
+   * Idempotent, ignored for an id this variant does not own, and allowed after
+   * the surface has frozen: suppression is not a repaint, it only removes a
+   * slot that was never going to say anything.
+   */
+  suppressRegion(id) {
+    if (this._suppressed.includes(id)) return;
+    this._suppressed = [...this._suppressed, id];
+    if (this._filled[id]) {
+      const { [id]: _removed, ...rest } = this._filled;
+      this._filled = rest;
+    }
+    if (this._frozen) this._announce();
+  }
+  /**
+   * Hide one product, everywhere, for the rest of this surface.
+   *
+   * Optimistic on purpose: the shopper tapped the tile's own dismiss button,
+   * so the tile goes now rather than after a round trip that may legitimately
+   * come back with nothing to patch. And it OUTLIVES the payload it was tapped
+   * in — a later repaint of the same region, or a whole new plan on a surface
+   * with no server session, must not hand back the product just rejected.
+   */
+  dismissProduct(handle) {
+    if (!handle || this._dismissed.has(handle)) return;
+    this._dismissed = /* @__PURE__ */ new Set([...this._dismissed, handle]);
+    if (this._frozen) this._announce();
+  }
+  /**
+   * Drop one chip from the follow-up bar without waiting for a server repaint.
+   *
+   * Only reachable when the bar is showing server chips and the surface has no
+   * live session to patch — an expired one, in practice. With a session the
+   * server repaints the bar and this is never called.
+   */
+  removeChip(key) {
+    const filled = this._filledQueryRegion();
+    if (!filled) return;
+    const bar = readFollowupBarPayload(filled.payload);
+    const chips = bar.chips.filter((chip) => chip.key !== key);
+    if (chips.length === bar.chips.length) return;
+    this._filled = { ...this._filled, [filled.id]: { ...filled, payload: { ...bar, chips } } };
+  }
+  /**
+   * The container a widget mounts into for this region, or `null` when the
+   * region paints no mountable module.
+   *
+   * The surface renders `search:chat` as an empty box and nothing else: the
+   * conversation here is the SDK's own chat widget, mounted by the runtime
+   * through its widget registry, never a second chat implementation living in
+   * this package. This is the whole affordance that makes that possible.
+   */
+  mountTarget(regionId) {
+    const section = Array.from(this.shadowRoot?.querySelectorAll("[data-region-role]") ?? []).find(
+      (node) => node.getAttribute("data-region-id") === regionId
+    );
+    return section?.querySelector("[data-mount]") ?? null;
+  }
+  /** The query region as the plan filled it, if the plan filled it at all. */
+  _filledQueryRegion() {
+    if (!this._variant) return null;
+    for (const slot of skeletonRegions(this._variant)) {
+      if (slot.role !== "query") continue;
+      const filled = this._filled[slot.id];
+      if (filled) return filled;
+    }
+    return null;
+  }
+  /** Hold the current variant for the rest of this turn. */
+  freeze() {
+    this._frozen = true;
+  }
+  /**
+   * Only ever called after a region has filled, so "nothing here" is a
+   * finished answer, not a loading state. The skeleton is what says "still
+   * loading", and it says it visually while the live region stays silent.
+   */
+  _announce() {
+    const total = Object.values(this._filled).reduce(
+      (sum, region) => sum + countRegionProducts(region, this._dismissed),
+      0
+    );
+    const count = total === 0 ? "No results found." : total === 1 ? "1 result" : `${total} results`;
+    const query = this._filledQueryRegion();
+    const notice = query ? readFollowupBarPayload(query.payload).notice : "";
+    this._announcement = notice ? `${notice} ${count}` : count;
+  }
+  _renderQueryRegion(slot) {
+    const filled = this._filled[slot.id];
+    const module = filled?.module ?? "search:followup-bar";
+    const payload = module === "search:followup-bar" ? (() => {
+      const bar = readFollowupBarPayload(filled?.payload);
+      return { ...bar, query: bar.query || this._query };
+    })() : filled?.payload;
+    const region = { id: slot.id, role: slot.role, module, payload };
+    return html2`
+      <section class="region region-query" data-region-id=${slot.id} data-region-role="query">
+        <div class="query-bar">
+          ${renderRegionModule(region, this._dismissed)}
+          <button
+            class="store-results"
+            type="button"
+            data-action="see-store-results"
+            @click=${this._onSeeStoreResults}
+          >
+            ${SEE_STORE_RESULTS_LABEL}
+          </button>
+        </div>
+      </section>
+    `;
+  }
+  _renderRegion(slot) {
+    if (slot.role === "query") return this._renderQueryRegion(slot);
+    const filled = this._filled[slot.id];
+    return html2`
+      <section
+        class="region"
+        data-region-id=${slot.id}
+        data-region-role=${slot.role}
+        data-skeleton=${filled ? nothing2 : "true"}
+        aria-busy=${filled ? nothing2 : "true"}
+      >
+        ${filled ? renderRegionModule(filled, this._dismissed) : this._renderSkeleton(slot.role)}
+      </section>
+    `;
+  }
+  _renderSkeleton(role) {
+    const blocks = Array.from({ length: SKELETON_BLOCKS[role] });
+    return html2`
+      <div class="skeleton" aria-hidden="true">
+        ${blocks.map(() => html2`<div class="skeleton-block"></div>`)}
+      </div>
+    `;
+  }
+  render() {
+    if (!this._variant) return nothing2;
+    const slots = skeletonRegions(this._variant).filter(
+      (slot) => !this._suppressed.includes(slot.id)
+    );
+    return html2`
+      <div class="surface" data-variant=${this._variant}>
+        <h2 class="sr-only">Search results</h2>
+        <p class="sr-only" role="status" aria-live="polite">${this._announcement}</p>
+        ${repeat(
+      slots,
+      (slot) => slot.id,
+      (slot) => this._renderRegion(slot)
+    )}
+      </div>
+    `;
+  }
+};
+SearchSurfaceElement.properties = {
+  _variant: { state: true },
+  _query: { state: true },
+  _filled: { state: true },
+  _suppressed: { state: true },
+  _dismissed: { state: true },
+  _frozen: { state: true },
+  _announcement: { state: true }
+};
+SearchSurfaceElement.styles = css`
+    :host {
+      display: block;
+      font-family: var(--sc-font-family, system-ui, -apple-system, sans-serif);
+      color: var(--sc-tile-text-color, var(--sc-content-text-color, #1a1a1a));
+    }
+
+    .surface {
+      display: grid;
+      gap: var(--sc-tile-stack-gap, 1rem);
+      padding: 1rem;
+      box-sizing: border-box;
+      min-height: 100%;
+      background: var(--sc-canvas-background, var(--sc-content-background, #ffffff));
+    }
+
+    .sr-only {
+      position: absolute;
+      width: 1px;
+      height: 1px;
+      margin: -1px;
+      padding: 0;
+      overflow: hidden;
+      clip-path: inset(50%);
+      white-space: nowrap;
+      border: 0;
+    }
+
+    /* Sticky, never fixed. A fixed bar measures itself against the visual
+       viewport, so it jumps when the mobile URL bar animates and hides under
+       the soft keyboard. Sticky inside our own scroll container does not. */
+    .region-query {
+      position: sticky;
+      top: 0;
+      z-index: 1;
+      background: var(--sc-canvas-background, var(--sc-content-background, #ffffff));
+      padding-block: 0.5rem;
+    }
+
+    .region {
+      min-width: 0;
+    }
+
+    .query-bar {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: 0.5rem;
+    }
+
+    .followup {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      gap: 0.5rem;
+      flex: 1 1 14rem;
+      min-width: 0;
+    }
+
+    .followup-input {
+      flex: 1 1 12rem;
+      min-width: 0;
+      min-height: 2.5rem;
+      padding: 0.5rem 0.75rem;
+      font: inherit;
+      color: inherit;
+      border: 1px solid var(--sc-tile-border, rgba(0, 0, 0, 0.2));
+      border-radius: var(--sc-border-radius, 0.5rem);
+      background: var(--sc-content-search-background, transparent);
+    }
+
+    .followup-notice {
+      flex: 1 1 100%;
+      margin: 0;
+      font-size: var(--sc-tile-subtitle-size, 0.875rem);
+      color: var(--sc-content-text-secondary-color, inherit);
+    }
+
+    .chips,
+    .suggestions {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 0.5rem;
+    }
+
+    .chip,
+    .suggestion,
+    .store-results {
+      display: inline-flex;
+      align-items: center;
+      gap: 0.25rem;
+      min-height: 1.75rem;
+      min-width: 1.75rem;
+      padding: 0.25rem 0.75rem;
+      font: inherit;
+      cursor: pointer;
+      border-radius: var(--sc-border-radius, 0.5rem);
+      border: 1px solid var(--sc-chip-border, rgba(0, 0, 0, 0.2));
+      background: var(--sc-chip-background, transparent);
+      color: var(--sc-chip-foreground, inherit);
+    }
+
+    .store-results {
+      margin-inline-start: auto;
+      border-color: var(--sc-color-primary, currentColor);
+      color: var(--sc-color-primary, inherit);
+      background: transparent;
+    }
+
+    .tiles {
+      display: grid;
+      gap: var(--sc-tile-gap, 0.75rem);
+    }
+
+    .tile {
+      position: relative;
+      min-width: 0;
+      border: 1px solid var(--sc-tile-border, rgba(0, 0, 0, 0.12));
+      border-radius: var(--sc-tile-border-radius, var(--sc-border-radius, 0.5rem));
+      background: var(--sc-tile-background, transparent);
+    }
+
+    .tile-link {
+      display: flex;
+      flex-direction: column;
+      gap: 0.25rem;
+      padding: var(--sc-tile-body-padding, 0.75rem);
+      color: inherit;
+      text-decoration: none;
+    }
+
+    .tile-image {
+      width: 100%;
+      max-width: 100%;
+      aspect-ratio: 1 / 1;
+      object-fit: cover;
+      border-radius: inherit;
+    }
+
+    .tile-title {
+      font-size: var(--sc-tile-title-size, 0.9375rem);
+      font-weight: var(--sc-tile-title-weight, 600);
+      color: var(--sc-tile-title-color, inherit);
+    }
+
+    .tile-price {
+      font-size: var(--sc-tile-subtitle-size, 0.875rem);
+    }
+
+    .tile-dismiss {
+      position: absolute;
+      inset-block-start: 0.25rem;
+      inset-inline-end: 0.25rem;
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      min-width: 1.75rem;
+      min-height: 1.75rem;
+      padding: 0;
+      font: inherit;
+      cursor: pointer;
+      border: 0;
+      border-radius: 50%;
+      color: var(--sc-tile-dismiss-color, inherit);
+      background: var(--sc-tile-dismiss-background, transparent);
+    }
+
+    .group-title,
+    .hero-reason,
+    .content-block {
+      margin: 0 0 0.5rem;
+    }
+
+    .group-title {
+      font-size: var(--sc-tile-title-size, 0.9375rem);
+      font-weight: 600;
+    }
+
+    .compare-attributes {
+      margin: 0.5rem 0 0;
+      padding-inline-start: 1.1em;
+    }
+
+    .skeleton {
+      display: grid;
+      gap: var(--sc-tile-gap, 0.75rem);
+    }
+
+    .skeleton-block {
+      height: 4rem;
+      border-radius: var(--sc-tile-border-radius, var(--sc-border-radius, 0.5rem));
+      background: var(--sc-tile-background, rgba(0, 0, 0, 0.06));
+      opacity: 0.6;
+      animation: syntro-search-pulse 1.4s ease-in-out infinite;
+    }
+
+    @keyframes syntro-search-pulse {
+      50% {
+        opacity: 0.25;
+      }
+    }
+
+    :focus-visible {
+      outline: 2px solid var(--sc-color-primary, currentColor);
+      outline-offset: 2px;
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+      .skeleton-block {
+        animation: none;
+      }
+    }
+
+    @media (forced-colors: active) {
+      .tile,
+      .chip,
+      .suggestion,
+      .store-results,
+      .followup-input {
+        border: 1px solid CanvasText;
+      }
+      .skeleton-block {
+        border: 1px solid CanvasText;
+        background: Canvas;
+      }
+    }
+
+    /* Every variant is a single column below this width. Above it, each one
+       takes the shape the plan chose. */
+    @media (min-width: 641px) {
+      .tiles {
+        grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
+      }
+
+      .tiles-compact {
+        grid-template-columns: minmax(0, 1fr);
+      }
+
+      .surface[data-variant='rail'] {
+        grid-template-columns: minmax(0, 16rem) minmax(0, 1fr);
+      }
+
+      .surface[data-variant='rail'] > [data-region-id='query-1'],
+      .surface[data-variant='rail'] > [data-region-id='converse-1'] {
+        grid-column: 1 / -1;
+      }
+
+      .surface[data-variant='rail'] > [data-region-id='secondary-1'] {
+        grid-column: 1;
+        grid-row: 2 / span 2;
+      }
+
+      .surface[data-variant='rail'] > [data-region-id='primary-1'] {
+        grid-column: 2;
+        grid-row: 2;
+      }
+
+      .surface[data-variant='rail'] > [data-region-id='support-1'] {
+        grid-column: 2;
+        grid-row: 3;
+      }
+
+      .surface[data-variant='compare'] {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+      }
+
+      .surface[data-variant='compare'] > [data-region-id='query-1'],
+      .surface[data-variant='compare'] > [data-region-id='secondary-1'],
+      .surface[data-variant='compare'] > [data-region-id='converse-1'] {
+        grid-column: 1 / -1;
+      }
+
+      .surface[data-variant='compare'] > [data-region-id='primary-1'] {
+        grid-column: 1;
+      }
+
+      .surface[data-variant='compare'] > [data-region-id='primary-2'] {
+        grid-column: 2;
+      }
+
+      .surface[data-variant='hero'] > [data-region-id='secondary-1'] .tiles {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+      }
+    }
+  `;
+function registerSearchSurfaceElement() {
+  if (typeof customElements === "undefined") return;
+  if (!customElements.get(SEARCH_SURFACE_TAG)) {
+    customElements.define(SEARCH_SURFACE_TAG, SearchSurfaceElement);
+  }
+}
+
+// src/runtime.ts
+registerSearchSurfaceElement();
+var SearchSurfaceMountable = {
+  mount(container, config) {
+    const surfaceConfig = stripMountPlumbing(config ?? null);
+    const element = document.createElement("syntro-search-surface");
+    container.appendChild(element);
+    if (surfaceConfig?.variant) {
+      element.showSkeleton(surfaceConfig.variant, surfaceConfig.query ?? "");
+    }
+    return () => element.remove();
+  }
+};
+var runtime = {
+  id: "adaptive-search",
+  version: "1.0.0",
+  name: "Adaptive Search",
+  description: "Draws every search result as a Syntro surface.",
+  /** No DOM-mutation executors: this surface renders only. */
+  executors: [],
+  widgets: [
+    {
+      id: "adaptive-search:surface",
+      component: SearchSurfaceMountable,
+      metadata: {
+        name: "Search Surface",
+        description: "The search results surface, painted per variant and filled region by region",
+        icon: "\u{1F50E}",
+        /**
+         * The surface replaces a whole results page, so it needs the
+         * full-viewport slot. It is not self-sufficient anywhere else: the
+         * scrolling and scroll containment it relies on come from
+         * `overlay_full`'s own slot styles (`overflow: auto` plus
+         * `overscroll-behavior: contain`), not from this element.
+         */
+        slots: ["overlay_full"]
+      }
+    }
+  ]
+};
+var runtime_default = runtime;
+
+export {
+  SearchSurfaceMountable,
+  runtime,
+  runtime_default
+};
+/*! Bundled license information:
+
+@lit/context/lib/context-request-event.js:
+@lit/context/lib/create-context.js:
+@lit/context/lib/controllers/context-consumer.js:
+@lit/context/lib/value-notifier.js:
+@lit/context/lib/controllers/context-provider.js:
+@lit/context/lib/context-root.js:
+  (**
+   * @license
+   * Copyright 2021 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+@lit/context/lib/decorators/provide.js:
+  (**
+   * @license
+   * Copyright 2017 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+
+@lit/context/lib/decorators/consume.js:
+  (**
+   * @license
+   * Copyright 2022 Google LLC
+   * SPDX-License-Identifier: BSD-3-Clause
+   *)
+*/
+//# sourceMappingURL=chunk-3KPQ5AOG.js.map