@occluze/tether 0.6.7 → 0.7.0

package/dist/tether.search.js

@@ -1,176 +1,247 @@
 (() => {
   var __defProp = Object.defineProperty;
+  var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
   var __export = (target, all) => {
     for (var name in all)
       __defProp(target, name, { get: all[name], enumerable: true });
   };
+  var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
-  // src/search.js
+  // src/search.ts
   var search_exports = {};
   __export(search_exports, {
     mountSearch: () => mountSearch
   });
 
-  // tether-core:config.js
-  var m = window.Tether.__core["config.js"];
-  var { DEFAULTS, cfg, configure, isConfigured, log, reportError, warn } = m;
+  // tether-core:config.ts
+  var m = window.Tether.__core["config.ts"];
+  var [cfg, isConfigured, log, MARKET_SOURCES, parseMarkets, reportError, warn] = m;
 
-  // tether-core:client.js
-  var m2 = window.Tether.__core["client.js"];
-  var { TetherError, endpoint, gql, request, unwrap, withContext } = m2;
+  // tether-core:client.ts
+  var m2 = window.Tether.__core["client.ts"];
+  var [endpoint, gql, orNull, shaped, TetherError] = m2;
 
-  // tether-core:dom.js
-  var m3 = window.Tether.__core["dom.js"];
-  var { attr, busy, cdnUrl, dataKey, emit, formatDate, formatMoney, formatPercent, get, has, hasTemplate, imageUrl, notifyLayoutChanged, parseJSONAttr, productUrl, qsa, readText, repeat, repeatKeyed, sameImage, scoped, sel, setImage, setSelected, setText, setTextTracked, show, toAttributes, watchImages } = m3;
+  // tether-core:dom.ts
+  var m3 = window.Tether.__core["dom.ts"];
+  var [ANALYTICS_EVENTS, attr, attributesFromJson, emit, formatDate, formatMoney, get, has, hasTemplate, isOwnEvent, parseJSONAttr, productUrl, qsa, repeat, sel, setImage, setText, show] = m3;
 
-  // src/search.js
+  // tether-core:mounting.ts
+  var m4 = window.Tether.__core["mounting.ts"];
+  var [liveLists, liveProducts, mountedProducts, mountProduct, pruneLive, within] = m4;
+
+  // src/search.ts
+  var isSearchAnswer = shaped({
+    predictiveSearch: orNull({
+      products: [{ priceRange: "object" }],
+      collections: ["object"],
+      queries: [{ text: "string" }]
+    })
+  });
   var QUERY = `query TetherPredictive($q:String!,$limit:Int!){predictiveSearch(query:$q,limit:$limit,limitScope:EACH,types:[PRODUCT,COLLECTION,QUERY]){products{id handle title availableForSale featuredImage{url altText}priceRange{minVariantPrice{amount currencyCode}}}collections{handle title image{url altText}}queries{text}}}`;
+  var DEFAULT_LIMIT = 6;
+  var DEFAULT_MIN_CHARACTERS = 2;
+  var DEFAULT_ACTION = "/search";
   var mounted = /* @__PURE__ */ new WeakSet();
-  var uid = 0;
-  function mountSearch(root = document) {
-    const roots = [...root.matches?.(sel("search")) ? [root] : [], ...qsa(root, sel("search"))];
-    roots.forEach((el) => {
-      if (!mounted.has(el)) {
-        mounted.add(el);
-        setup(el);
+  var searchBoxCount = 0;
+  function integerAttribute(el, name, fallback) {
+    return parseInt(get(el, name) || "", 10) || fallback;
+  }
+  var linkIn = (node) => node.tagName === "A" ? node : node.querySelector("a");
+  function bindValues(node, values) {
+    qsa(node, sel("search-bind")).forEach((el) => {
+      const field = get(el, "search-bind");
+      if (field === "image") setImage(el, values.image?.url, values.image?.altText || values.title);
+      else if (field === "title" || field === "price" || field === "text") {
+        if (values[field] != null) setText(el, values[field]);
       }
     });
   }
-  function setup(rootEl) {
-    const input = rootEl.querySelector(sel("search-input")) || rootEl.querySelector("input");
-    const results = rootEl.querySelector(sel("search-results"));
-    if (!input || !results) return;
-    const limit = parseInt(get(rootEl, "search-limit") || "6", 10) || 6;
-    const min = parseInt(get(rootEl, "search-min") || "2", 10) || 2;
-    const id = results.id || (results.id = `${cfg.prefix}-search-${++uid}`);
-    input.setAttribute("role", "combobox");
-    input.setAttribute("aria-autocomplete", "list");
-    input.setAttribute("aria-controls", id);
-    input.setAttribute("aria-expanded", "false");
-    input.setAttribute("autocomplete", "off");
-    if (!results.hasAttribute("role")) results.setAttribute("role", "listbox");
-    results.hidden = true;
-    let token = 0;
-    let timer = null;
-    let last = "";
-    const cache = /* @__PURE__ */ new Map();
-    const setState = (state) => rootEl.setAttribute(attr("search-state"), state);
-    const open = (yes) => {
-      rootEl.classList.toggle("is-open", yes);
-      results.hidden = !yes;
-      input.setAttribute("aria-expanded", String(yes));
-      if (!yes) input.removeAttribute("aria-activedescendant");
-    };
-    const items = () => qsa(results, '[role="option"]');
-    async function run(term) {
-      const t = ++token;
-      if (term.length < min) {
-        open(false);
-        setState("idle");
+  function linkOption(node, href) {
+    const link = linkIn(node);
+    if (!link) return;
+    if (href) link.setAttribute("href", href);
+    link.setAttribute("role", "option");
+  }
+  var SearchBox = class {
+    constructor(root, input, results) {
+      __publicField(this, "root");
+      __publicField(this, "input");
+      __publicField(this, "results");
+      __publicField(this, "limit");
+      __publicField(this, "minCharacters");
+      __publicField(this, "resultsId");
+      /** Counts searches, so only the latest one renders. */
+      __publicField(this, "searchNumber", 0);
+      __publicField(this, "timer");
+      __publicField(this, "lastTerm", "");
+      /** Results per term, for typing back and forth. */
+      __publicField(this, "cache", /* @__PURE__ */ new Map());
+      this.root = root;
+      this.input = input;
+      this.results = results;
+      this.limit = integerAttribute(root, "search-limit", DEFAULT_LIMIT);
+      this.minCharacters = integerAttribute(root, "search-min", DEFAULT_MIN_CHARACTERS);
+      if (!results.id) {
+        searchBoxCount += 1;
+        results.id = `${cfg.prefix}-search-${searchBoxCount}`;
+      }
+      this.resultsId = results.id;
+      this.setUpAria();
+      this.listen();
+    }
+    setUpAria() {
+      this.input.setAttribute("role", "combobox");
+      this.input.setAttribute("aria-autocomplete", "list");
+      this.input.setAttribute("aria-controls", this.resultsId);
+      this.input.setAttribute("aria-expanded", "false");
+      this.input.setAttribute("autocomplete", "off");
+      if (!this.results.hasAttribute("role")) this.results.setAttribute("role", "listbox");
+      this.results.hidden = true;
+    }
+    listen() {
+      this.input.addEventListener("input", () => {
+        const term = this.input.value.trim();
+        if (term === this.lastTerm) return;
+        this.lastTerm = term;
+        clearTimeout(this.timer);
+        this.timer = setTimeout(() => void this.search(term), cfg.searchDelay);
+      });
+      this.input.addEventListener("focus", () => {
+        if (this.input.value.trim().length >= this.minCharacters && this.options().length) this.open(true);
+      });
+      this.input.addEventListener("keydown", (event) => {
+        this.onKeydown(event);
+      });
+      document.addEventListener("click", (event) => {
+        if (!this.root.contains(event.target)) this.open(false);
+      });
+    }
+    setState(state) {
+      this.root.setAttribute(attr("search-state"), state);
+    }
+    open(open) {
+      this.root.classList.toggle("is-open", open);
+      this.results.hidden = !open;
+      this.input.setAttribute("aria-expanded", String(open));
+      if (!open) this.input.removeAttribute("aria-activedescendant");
+    }
+    options() {
+      return qsa(this.results, '[role="option"]');
+    }
+    async fetchResults(term) {
+      const cached = this.cache.get(term);
+      if (cached) return cached;
+      const data = await gql(QUERY, { q: term, limit: this.limit }, isSearchAnswer);
+      this.cache.set(term, data.predictiveSearch);
+      return data.predictiveSearch;
+    }
+    async search(term) {
+      this.searchNumber += 1;
+      const searchNumber = this.searchNumber;
+      if (term.length < this.minCharacters) {
+        this.open(false);
+        this.setState("idle");
         return;
       }
-      setState("loading");
+      this.setState("loading");
       try {
-        const data = cache.get(term) || (await gql(QUERY, { q: term, limit })).predictiveSearch;
-        cache.set(term, data);
-        if (t !== token) return;
-        render(data, term);
-      } catch (err) {
-        if (t !== token) return;
-        setState("error");
-        reportError(err, "search");
+        const results = await this.fetchResults(term);
+        if (searchNumber === this.searchNumber) this.render(results, term);
+      } catch (error) {
+        if (searchNumber !== this.searchNumber) {
+          log("a superseded search failed", error);
+          return;
+        }
+        this.setState("error");
+        reportError(error, "search");
       }
     }
-    function render(data, term) {
-      const products = data?.products || [];
-      const collections = data?.collections || [];
-      const queries = (data?.queries || []).filter((q) => q.text.toLowerCase() !== term.toLowerCase());
-      const fill = (name, list, each) => qsa(results, sel(name)).forEach((c) => {
-        repeat(c, list, each);
-        show(c, list.length > 0);
+    /** @param name The list attribute, e.g. `search-products`. */
+    fillList(name, items, render) {
+      qsa(this.results, sel(name)).forEach((list) => {
+        repeat(list, items, render);
+        show(list, items.length > 0);
       });
-      fill("search-products", products, (node, p) => {
-        binds(node, { title: p.title, price: formatMoney(p.priceRange?.minVariantPrice), image: p.featuredImage });
-        link(node, productUrl(p.handle, p.id));
-        node.classList.toggle("is-sold-out", !p.availableForSale);
+    }
+    queryUrl(text) {
+      const action = this.root.getAttribute("action") || DEFAULT_ACTION;
+      const separator = action.includes("?") ? "&" : "?";
+      return `${action}${separator}${this.input.name || "q"}=${encodeURIComponent(text)}`;
+    }
+    render(results, term) {
+      const products = results?.products ?? [];
+      const collections = results?.collections ?? [];
+      const queries = (results?.queries ?? []).filter((query) => query.text.toLowerCase() !== term.toLowerCase());
+      this.fillList("search-products", products, (node, product) => {
+        const price = formatMoney(product.priceRange.minVariantPrice);
+        bindValues(node, { title: product.title, price, image: product.featuredImage });
+        linkOption(node, productUrl(product.handle, product.id));
+        node.classList.toggle("is-sold-out", !product.availableForSale);
       });
-      fill("search-collections", collections, (node, c) => {
-        binds(node, { title: c.title, image: c.image });
-        link(node, `${(cfg.collectionPath || "/collection").replace(/\/$/, "")}/${c.handle}`);
+      this.fillList("search-collections", collections, (node, collection) => {
+        bindValues(node, { title: collection.title, image: collection.image });
+        linkOption(node, `${(cfg.collectionPath || "/collection").replace(/\/$/, "")}/${collection.handle}`);
       });
-      fill("search-queries", queries, (node, q) => {
-        binds(node, { text: q.text });
-        const a = node.tagName === "A" ? node : node.querySelector("a");
-        const action = rootEl.getAttribute("action") || "/search";
-        if (a) a.setAttribute("href", `${action}${action.includes("?") ? "&" : "?"}${input.name || "q"}=${encodeURIComponent(q.text)}`);
+      this.fillList("search-queries", queries, (node, query) => {
+        bindValues(node, { text: query.text });
+        linkIn(node)?.setAttribute("href", this.queryUrl(query.text));
       });
       const count = products.length + collections.length + queries.length;
-      qsa(rootEl, sel("show")).forEach((el) => {
-        const k = get(el, "show");
-        if (k === "search-empty") show(el, count === 0);
-        if (k === "search-results") show(el, count > 0);
+      this.showCount(count);
+      this.setState(count ? "ready" : "empty");
+      this.open(true);
+      emit("search", { term, products, collections, queries }, this.root);
+    }
+    showCount(count) {
+      qsa(this.root, sel("show")).forEach((el) => {
+        const condition = get(el, "show");
+        if (condition === "search-empty") show(el, count === 0);
+        if (condition === "search-results") show(el, count > 0);
       });
-      items().forEach((el, i) => {
-        el.id || (el.id = `${id}-${i}`);
-        el.setAttribute("aria-selected", "false");
+      this.options().forEach((option, index) => {
+        option.id || (option.id = `${this.resultsId}-${index}`);
+        option.setAttribute("aria-selected", "false");
       });
-      setState(count ? "ready" : "empty");
-      open(true);
-      emit("search", { term, products, collections, queries }, rootEl);
     }
-    function binds(node, values) {
-      qsa(node, sel("search-bind")).forEach((el) => {
-        const k = get(el, "search-bind");
-        if (k === "image") setImage(el, values.image?.url, values.image?.altText || values.title);
-        else if (values[k] != null) setText(el, values[k]);
+    highlight(options, index) {
+      options.forEach((option2, optionIndex) => {
+        option2.setAttribute("aria-selected", String(optionIndex === index));
       });
+      const option = options[index];
+      if (!option) return;
+      this.input.setAttribute("aria-activedescendant", option.id);
+      option.scrollIntoView?.({ block: "nearest" });
     }
-    function link(node, href) {
-      const a = node.tagName === "A" ? node : node.querySelector("a");
-      if (a) {
-        a.setAttribute("href", href);
-        a.setAttribute("role", "option");
+    onKeydown(event) {
+      const options = this.options();
+      const current = options.findIndex((option) => option.getAttribute("aria-selected") === "true");
+      if (event.key === "ArrowDown" && options.length) {
+        event.preventDefault();
+        this.open(true);
+        this.highlight(options, (current + 1) % options.length);
+      } else if (event.key === "ArrowUp" && options.length) {
+        event.preventDefault();
+        this.highlight(options, current <= 0 ? options.length - 1 : current - 1);
+      } else if (event.key === "Enter" && current >= 0) {
+        event.preventDefault();
+        options[current]?.click();
+      } else if (event.key === "Escape") {
+        this.open(false);
       }
     }
-    input.addEventListener("input", () => {
-      const term = input.value.trim();
-      if (term === last) return;
-      last = term;
-      clearTimeout(timer);
-      timer = setTimeout(() => run(term), cfg.searchDelay ?? 150);
-    });
-    input.addEventListener("focus", () => {
-      if (input.value.trim().length >= min && items().length) open(true);
-    });
-    input.addEventListener("keydown", (e) => {
-      const list = items();
-      const cur = list.findIndex((el) => el.getAttribute("aria-selected") === "true");
-      const move = (i) => {
-        list.forEach((el, j) => el.setAttribute("aria-selected", String(j === i)));
-        if (list[i]) {
-          input.setAttribute("aria-activedescendant", list[i].id);
-          list[i].scrollIntoView?.({ block: "nearest" });
-        }
-      };
-      if (e.key === "ArrowDown" && list.length) {
-        e.preventDefault();
-        open(true);
-        move((cur + 1) % list.length);
-      } else if (e.key === "ArrowUp" && list.length) {
-        e.preventDefault();
-        move(cur <= 0 ? list.length - 1 : cur - 1);
-      } else if (e.key === "Enter" && cur >= 0) {
-        e.preventDefault();
-        list[cur].click();
-      } else if (e.key === "Escape") {
-        open(false);
-      }
-    });
-    document.addEventListener("click", (e) => {
-      if (!rootEl.contains(e.target)) open(false);
-    });
+  };
+  function mountSearch(root = document) {
+    for (const el of within(root, sel("search"))) {
+      if (mounted.has(el)) continue;
+      mounted.add(el);
+      const input = el.querySelector(sel("search-input")) ?? el.querySelector("input");
+      const results = el.querySelector(sel("search-results"));
+      if (input && results) new SearchBox(el, input, results);
+    }
   }
 
-  // src/parts/search.js
-  window.Tether.__parts.search = search_exports;
+  // src/parts/search.ts
+  var { Tether } = window;
+  if (!Tether) throw new Error("tether.search.js runs after the Tether script, which loads it");
+  Tether.__parts.search = search_exports;
 })();

package/dist/tether.search.min.js

@@ -1 +1 @@
-(()=>{var Q=Object.defineProperty;var Y=(n,s)=>{for(var c in s)Q(n,c,{get:s[c],enumerable:!0})};var S={};Y(S,{mountSearch:()=>G});var H=window.Tether.__core["config.js"],{DEFAULTS:ee,cfg:A,configure:te,isConfigured:re,log:ie,reportError:E,warn:ae}=H;var J=window.Tether.__core["client.js"],{TetherError:ne,endpoint:ce,gql:U,request:oe,unwrap:le,withContext:ue}=J;var W=window.Tether.__core["dom.js"],{attr:D,busy:he,cdnUrl:fe,dataKey:me,emit:_,formatDate:pe,formatMoney:P,formatPercent:ge,get:g,has:be,hasTemplate:we,imageUrl:Ae,notifyLayoutChanged:ye,parseJSONAttr:xe,productUrl:R,qsa:h,readText:Te,repeat:N,repeatKeyed:qe,sameImage:Se,scoped:$e,sel:u,setImage:O,setSelected:ke,setText:j,setTextTracked:ve,show:y,toAttributes:Ie,watchImages:Le}=W;var z="query TetherPredictive($q:String!,$limit:Int!){predictiveSearch(query:$q,limit:$limit,limitScope:EACH,types:[PRODUCT,COLLECTION,QUERY]){products{id handle title availableForSale featuredImage{url altText}priceRange{minVariantPrice{amount currencyCode}}}collections{handle title image{url altText}}queries{text}}}",F=new WeakSet,B=0;function G(n=document){[...n.matches?.(u("search"))?[n]:[],...h(n,u("search"))].forEach(c=>{F.has(c)||(F.add(c),X(c))})}function X(n){let s=n.querySelector(u("search-input"))||n.querySelector("input"),c=n.querySelector(u("search-results"));if(!s||!c)return;let M=parseInt(g(n,"search-limit")||"6",10)||6,$=parseInt(g(n,"search-min")||"2",10)||2,k=c.id||(c.id=`${A.prefix}-search-${++B}`);s.setAttribute("role","combobox"),s.setAttribute("aria-autocomplete","list"),s.setAttribute("aria-controls",k),s.setAttribute("aria-expanded","false"),s.setAttribute("autocomplete","off"),c.hasAttribute("role")||c.setAttribute("role","listbox"),c.hidden=!0;let x=0,v=null,I="",L=new Map,b=e=>n.setAttribute(D("search-state"),e),d=e=>{n.classList.toggle("is-open",e),c.hidden=!e,s.setAttribute("aria-expanded",String(e)),e||s.removeAttribute("aria-activedescendant")},T=()=>h(c,'[role="option"]');async function V(e){let t=++x;if(e.length<$){d(!1),b("idle");return}b("loading");try{let i=L.get(e)||(await U(z,{q:e,limit:M})).predictiveSearch;if(L.set(e,i),t!==x)return;K(i,e)}catch(i){if(t!==x)return;b("error"),E(i,"search")}}function K(e,t){let i=e?.products||[],o=e?.collections||[],l=(e?.queries||[]).filter(r=>r.text.toLowerCase()!==t.toLowerCase()),f=(r,a,w)=>h(c,u(r)).forEach(p=>{N(p,a,w),y(p,a.length>0)});f("search-products",i,(r,a)=>{q(r,{title:a.title,price:P(a.priceRange?.minVariantPrice),image:a.featuredImage}),C(r,R(a.handle,a.id)),r.classList.toggle("is-sold-out",!a.availableForSale)}),f("search-collections",o,(r,a)=>{q(r,{title:a.title,image:a.image}),C(r,`${(A.collectionPath||"/collection").replace(/\/$/,"")}/${a.handle}`)}),f("search-queries",l,(r,a)=>{q(r,{text:a.text});let w=r.tagName==="A"?r:r.querySelector("a"),p=n.getAttribute("action")||"/search";w&&w.setAttribute("href",`${p}${p.includes("?")?"&":"?"}${s.name||"q"}=${encodeURIComponent(a.text)}`)});let m=i.length+o.length+l.length;h(n,u("show")).forEach(r=>{let a=g(r,"show");a==="search-empty"&&y(r,m===0),a==="search-results"&&y(r,m>0)}),T().forEach((r,a)=>{r.id||(r.id=`${k}-${a}`),r.setAttribute("aria-selected","false")}),b(m?"ready":"empty"),d(!0),_("search",{term:t,products:i,collections:o,queries:l},n)}function q(e,t){h(e,u("search-bind")).forEach(i=>{let o=g(i,"search-bind");o==="image"?O(i,t.image?.url,t.image?.altText||t.title):t[o]!=null&&j(i,t[o])})}function C(e,t){let i=e.tagName==="A"?e:e.querySelector("a");i&&(i.setAttribute("href",t),i.setAttribute("role","option"))}s.addEventListener("input",()=>{let e=s.value.trim();e!==I&&(I=e,clearTimeout(v),v=setTimeout(()=>V(e),A.searchDelay??150))}),s.addEventListener("focus",()=>{s.value.trim().length>=$&&T().length&&d(!0)}),s.addEventListener("keydown",e=>{let t=T(),i=t.findIndex(l=>l.getAttribute("aria-selected")==="true"),o=l=>{t.forEach((f,m)=>f.setAttribute("aria-selected",String(m===l))),t[l]&&(s.setAttribute("aria-activedescendant",t[l].id),t[l].scrollIntoView?.({block:"nearest"}))};e.key==="ArrowDown"&&t.length?(e.preventDefault(),d(!0),o((i+1)%t.length)):e.key==="ArrowUp"&&t.length?(e.preventDefault(),o(i<=0?t.length-1:i-1)):e.key==="Enter"&&i>=0?(e.preventDefault(),t[i].click()):e.key==="Escape"&&d(!1)}),document.addEventListener("click",e=>{n.contains(e.target)||d(!1)})}window.Tether.__parts.search=S;})();
+(()=>{var T=Object.defineProperty;var D=(i,t,e)=>t in i?T(i,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):i[t]=e;var V=(i,t)=>{for(var e in t)T(i,e,{get:t[e],enumerable:!0})};var a=(i,t,e)=>D(i,typeof t!="symbol"?t+"":t,e);var g={};V(g,{mountSearch:()=>W});var O=window.Tether.__core["config.ts"],[u,X,b,Z,tt,y,et]=O;var F=window.Tether.__core["client.ts"],[it,E,w,A,st]=F;var K=window.Tether.__core["dom.ts"],[at,I,ot,L,lt,x,m,ct,ht,ut,mt,C,h,q,l,M,v,d]=K;var Q=window.Tether.__core["mounting.ts"],[pt,ft,gt,St,Tt,R]=Q;var j=A({predictiveSearch:w({products:[{priceRange:"object"}],collections:["object"],queries:[{text:"string"}]})}),Y="query TetherPredictive($q:String!,$limit:Int!){predictiveSearch(query:$q,limit:$limit,limitScope:EACH,types:[PRODUCT,COLLECTION,QUERY]){products{id handle title availableForSale featuredImage{url altText}priceRange{minVariantPrice{amount currencyCode}}}collections{handle title image{url altText}}queries{text}}}",B=6,J=2,z="/search",N=new WeakSet,P=0;function _(i,t,e){return parseInt(m(i,t)||"",10)||e}var U=i=>i.tagName==="A"?i:i.querySelector("a");function p(i,t){h(i,l("search-bind")).forEach(e=>{let r=m(e,"search-bind");r==="image"?M(e,t.image?.url,t.image?.altText||t.title):(r==="title"||r==="price"||r==="text")&&t[r]!=null&&v(e,t[r])})}function k(i,t){let e=U(i);e&&(t&&e.setAttribute("href",t),e.setAttribute("role","option"))}var f=class{constructor(t,e,r){a(this,"root");a(this,"input");a(this,"results");a(this,"limit");a(this,"minCharacters");a(this,"resultsId");a(this,"searchNumber",0);a(this,"timer");a(this,"lastTerm","");a(this,"cache",new Map);this.root=t,this.input=e,this.results=r,this.limit=_(t,"search-limit",B),this.minCharacters=_(t,"search-min",J),r.id||(P+=1,r.id=`${u.prefix}-search-${P}`),this.resultsId=r.id,this.setUpAria(),this.listen()}setUpAria(){this.input.setAttribute("role","combobox"),this.input.setAttribute("aria-autocomplete","list"),this.input.setAttribute("aria-controls",this.resultsId),this.input.setAttribute("aria-expanded","false"),this.input.setAttribute("autocomplete","off"),this.results.hasAttribute("role")||this.results.setAttribute("role","listbox"),this.results.hidden=!0}listen(){this.input.addEventListener("input",()=>{let t=this.input.value.trim();t!==this.lastTerm&&(this.lastTerm=t,clearTimeout(this.timer),this.timer=setTimeout(()=>void this.search(t),u.searchDelay))}),this.input.addEventListener("focus",()=>{this.input.value.trim().length>=this.minCharacters&&this.options().length&&this.open(!0)}),this.input.addEventListener("keydown",t=>{this.onKeydown(t)}),document.addEventListener("click",t=>{this.root.contains(t.target)||this.open(!1)})}setState(t){this.root.setAttribute(I("search-state"),t)}open(t){this.root.classList.toggle("is-open",t),this.results.hidden=!t,this.input.setAttribute("aria-expanded",String(t)),t||this.input.removeAttribute("aria-activedescendant")}options(){return h(this.results,'[role="option"]')}async fetchResults(t){let e=this.cache.get(t);if(e)return e;let r=await E(Y,{q:t,limit:this.limit},j);return this.cache.set(t,r.predictiveSearch),r.predictiveSearch}async search(t){this.searchNumber+=1;let e=this.searchNumber;if(t.length<this.minCharacters){this.open(!1),this.setState("idle");return}this.setState("loading");try{let r=await this.fetchResults(t);e===this.searchNumber&&this.render(r,t)}catch(r){if(e!==this.searchNumber){b("a superseded search failed",r);return}this.setState("error"),y(r,"search")}}fillList(t,e,r){h(this.results,l(t)).forEach(o=>{q(o,e,r),d(o,e.length>0)})}queryUrl(t){let e=this.root.getAttribute("action")||z,r=e.includes("?")?"&":"?";return`${e}${r}${this.input.name||"q"}=${encodeURIComponent(t)}`}render(t,e){let r=t?.products??[],o=t?.collections??[],c=(t?.queries??[]).filter(n=>n.text.toLowerCase()!==e.toLowerCase());this.fillList("search-products",r,(n,s)=>{let H=x(s.priceRange.minVariantPrice);p(n,{title:s.title,price:H,image:s.featuredImage}),k(n,C(s.handle,s.id)),n.classList.toggle("is-sold-out",!s.availableForSale)}),this.fillList("search-collections",o,(n,s)=>{p(n,{title:s.title,image:s.image}),k(n,`${(u.collectionPath||"/collection").replace(/\/$/,"")}/${s.handle}`)}),this.fillList("search-queries",c,(n,s)=>{p(n,{text:s.text}),U(n)?.setAttribute("href",this.queryUrl(s.text))});let S=r.length+o.length+c.length;this.showCount(S),this.setState(S?"ready":"empty"),this.open(!0),L("search",{term:e,products:r,collections:o,queries:c},this.root)}showCount(t){h(this.root,l("show")).forEach(e=>{let r=m(e,"show");r==="search-empty"&&d(e,t===0),r==="search-results"&&d(e,t>0)}),this.options().forEach((e,r)=>{e.id||(e.id=`${this.resultsId}-${r}`),e.setAttribute("aria-selected","false")})}highlight(t,e){t.forEach((o,c)=>{o.setAttribute("aria-selected",String(c===e))});let r=t[e];r&&(this.input.setAttribute("aria-activedescendant",r.id),r.scrollIntoView?.({block:"nearest"}))}onKeydown(t){let e=this.options(),r=e.findIndex(o=>o.getAttribute("aria-selected")==="true");t.key==="ArrowDown"&&e.length?(t.preventDefault(),this.open(!0),this.highlight(e,(r+1)%e.length)):t.key==="ArrowUp"&&e.length?(t.preventDefault(),this.highlight(e,r<=0?e.length-1:r-1)):t.key==="Enter"&&r>=0?(t.preventDefault(),e[r]?.click()):t.key==="Escape"&&this.open(!1)}};function W(i=document){for(let t of R(i,l("search"))){if(N.has(t))continue;N.add(t);let e=t.querySelector(l("search-input"))??t.querySelector("input"),r=t.querySelector(l("search-results"));e&&r&&new f(t,e,r)}}var{Tether:$}=window;if(!$)throw new Error("tether.search.js runs after the Tether script, which loads it");$.__parts.search=g;})();

package/dist/types/server/src/shared/account-orders.d.ts

@@ -0,0 +1,44 @@
+/** A `MoneyV2`. */
+interface Money {
+    amount: string;
+    currencyCode: string;
+}
+export interface AccountImage {
+    url: string;
+    altText: string | null;
+}
+/** A line of an order. */
+export interface AccountOrderLine {
+    title: string | null;
+    variantTitle: string | null;
+    quantity: number;
+    image: AccountImage | null;
+}
+/** An order in the customer's list. */
+export interface AccountOrder {
+    id: string;
+    name: string | null;
+    processedAt: string | null;
+    financialStatus: string | null;
+    fulfillmentStatus: string | null;
+    statusPageUrl: string | null;
+    totalPrice: Money | null;
+    lineItems: {
+        nodes: AccountOrderLine[];
+    };
+}
+/** `missing-id` when an order has no id, which each side reports in its own error type. */
+type OrdersReading = {
+    kind: 'read';
+    orders: AccountOrder[];
+} | {
+    kind: 'missing-id';
+};
+export declare function moneyOrNull(value: unknown): Money | null;
+export declare function imageOrNull(value: unknown): AccountImage | null;
+export declare const toOrderLine: (value: unknown) => AccountOrderLine;
+/**
+ * @param value A list of orders: Shopify's `orders.nodes`, or the `orders` of the Worker's `/orders`.
+ */
+export declare function readOrders(value: unknown): OrdersReading;
+export {};

package/dist/types/server/src/shared/account-routes.d.ts

@@ -0,0 +1,153 @@
+/**
+ * The Worker's routes for the customer account operations, the contract between the browser's account part and the
+ * Worker: what the browser sends for each operation, and which method and path it has under `/_tether/account`. The
+ * operations themselves (their documents and input checks) run only in the Worker, in `account/operations.ts`.
+ */
+export type SubscriptionAction = 'pause' | 'resume' | 'skip' | 'unskip' | 'cancel';
+/** Shopify's `CustomerAddressInput` fields; the Worker keeps only these, with bounded lengths. */
+export interface AddressFields {
+    firstName?: string;
+    lastName?: string;
+    company?: string;
+    address1?: string;
+    address2?: string;
+    city?: string;
+    zip?: string;
+    zoneCode?: string;
+    /** Two letters. */
+    countryCode?: string;
+    phoneNumber?: string;
+}
+export interface ReturnLine {
+    lineItemId: string;
+    quantity: number;
+    reasonId?: string;
+    note?: string;
+}
+/** What the browser sends for each operation. Ids are gids, or the number at their end. */
+export interface OperationInputs {
+    order: {
+        id: string | number;
+    };
+    addresses: Record<string, never>;
+    subscriptions: Record<string, never>;
+    profile: {
+        firstName?: string | undefined;
+        lastName?: string | undefined;
+    };
+    /** Without `id`, a new address; without fields, only makes the address the default. */
+    saveAddress: {
+        id?: string | undefined;
+        address: AddressFields | null;
+        isDefault?: boolean | undefined;
+    };
+    deleteAddress: {
+        id: string;
+    };
+    subscription: {
+        id: string | number;
+        action: SubscriptionAction;
+    };
+    requestReturn: {
+        orderId: string | number;
+        lines: ReturnLine[];
+    };
+}
+export type OperationName = keyof OperationInputs;
+/**
+ * Each operation's input fields as they reach the Worker: from a browser, a page script or anyone else, so each value
+ * is unchecked until the operation checks it.
+ */
+export type UncheckedInputs = {
+    [Name in OperationName]: {
+        readonly [Field in keyof OperationInputs[Name]]?: unknown;
+    };
+};
+/** One operation a Worker request asks for, with the fields its route reads, each one unchecked. */
+export interface OperationCall {
+    name: OperationName;
+    input: Readonly<Record<string, unknown>>;
+}
+export declare const OPERATION_ROUTES: {
+    order: {
+        name: "order";
+        method: "GET";
+        path: string;
+        fields: {
+            id: true;
+        };
+    };
+    addresses: {
+        name: "addresses";
+        method: "GET";
+        path: string;
+        fields: {};
+    };
+    subscriptions: {
+        name: "subscriptions";
+        method: "GET";
+        path: string;
+        fields: {};
+    };
+    profile: {
+        name: "profile";
+        method: "POST";
+        path: string;
+        fields: {
+            firstName: true;
+            lastName: true;
+        };
+    };
+    saveAddress: {
+        name: "saveAddress";
+        method: "POST";
+        path: string;
+        fields: {
+            id: true;
+            address: true;
+            isDefault: true;
+        };
+    };
+    deleteAddress: {
+        name: "deleteAddress";
+        method: "POST";
+        path: string;
+        fields: {
+            id: true;
+        };
+    };
+    subscription: {
+        name: "subscription";
+        method: "POST";
+        path: string;
+        fields: {
+            id: true;
+            action: true;
+        };
+    };
+    requestReturn: {
+        name: "requestReturn";
+        method: "POST";
+        path: string;
+        fields: {
+            orderId: true;
+            lines: true;
+        };
+    };
+};
+/**
+ * The operation a Worker request asks for, with its input read from the query string or the body.
+ *
+ * @param path The path under `/_tether/account`.
+ * @param body The JSON body of a POST; `{}` for a GET.
+ * @returns `null` when no operation has this method and path.
+ */
+export declare function operationCall(method: string, path: string, url: URL, body: Record<string, unknown>): OperationCall | null;
+/**
+ * The method and path (with its query string, for a GET) the browser requests an operation with. A POST sends the
+ * input as its JSON body.
+ */
+export declare function operationRequest<Name extends OperationName>(name: Name, input: OperationInputs[Name]): {
+    method: 'GET' | 'POST';
+    path: string;
+};

package/dist/types/server/src/shared/api-versions.d.ts

@@ -0,0 +1,13 @@
+/**
+ * The Shopify API versions Tether is built and smoke-tested against, for the browser script and the Worker alike. The
+ * three APIs are versioned separately, so each has its own constant even while they hold the same quarter. A new
+ * version must pass `npm run smoke` on both the pinned version and the next one.
+ */
+/** A dated, quarterly version such as `2026-07`. */
+export type ApiVersion = `${number}-${'01' | '04' | '07' | '10'}`;
+/** The Storefront API: products, carts, cart buyer identity. */
+export declare const STOREFRONT_API_VERSION: ApiVersion;
+/** The Customer Account API: the logged-in customer's orders, addresses and subscriptions. */
+export declare const CUSTOMER_ACCOUNT_API_VERSION: ApiVersion;
+/** The Admin API the sync reads products with. */
+export declare const ADMIN_API_VERSION: ApiVersion;

package/dist/types/server/src/shared/error-message.d.ts

@@ -0,0 +1,2 @@
+/** The text of anything thrown: an `Error`'s message, or the value itself written as text. */
+export declare function messageOf(error: unknown): string;