mealz-components 0.1.2 → 0.2.0

package/dist/mealz-components.js

@@ -3,19 +3,19 @@
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const N = globalThis, q = N.ShadowRoot && (N.ShadyCSS === void 0 || N.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, J = Symbol(), F = /* @__PURE__ */ new WeakMap();
+const N = globalThis, V = N.ShadowRoot && (N.ShadyCSS === void 0 || N.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, F = Symbol(), W = /* @__PURE__ */ new WeakMap();
 let nt = class {
-  constructor(t, e, s) {
-    if (this._$cssResult$ = !0, s !== J)
+  constructor(t, e, i) {
+    if (this._$cssResult$ = !0, i !== F)
       throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
     this.cssText = t, this.t = e;
   }
   get styleSheet() {
     let t = this.o;
     const e = this.t;
-    if (q && t === void 0) {
-      const s = e !== void 0 && e.length === 1;
-      s && (t = F.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && F.set(e, t));
+    if (V && t === void 0) {
+      const i = e !== void 0 && e.length === 1;
+      i && (t = W.get(e)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), i && W.set(e, t));
     }
     return t;
   }
@@ -23,64 +23,64 @@ let nt = class {
     return this.cssText;
   }
 };
-const pt = (i) => new nt(typeof i == "string" ? i : i + "", void 0, J), ct = (i, ...t) => {
-  const e = i.length === 1 ? i[0] : t.reduce((s, o, r) => s + ((n) => {
+const dt = (s) => new nt(typeof s == "string" ? s : s + "", void 0, F), ct = (s, ...t) => {
+  const e = s.length === 1 ? s[0] : t.reduce((i, o, r) => i + ((n) => {
     if (n._$cssResult$ === !0)
       return n.cssText;
     if (typeof n == "number")
       return n;
     throw Error("Value passed to 'css' function must be a 'css' function result: " + n + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
-  })(o) + i[r + 1], i[0]);
-  return new nt(e, i, J);
-}, ut = (i, t) => {
-  if (q)
-    i.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
+  })(o) + s[r + 1], s[0]);
+  return new nt(e, s, F);
+}, ut = (s, t) => {
+  if (V)
+    s.adoptedStyleSheets = t.map((e) => e instanceof CSSStyleSheet ? e : e.styleSheet);
   else
     for (const e of t) {
-      const s = document.createElement("style"), o = N.litNonce;
-      o !== void 0 && s.setAttribute("nonce", o), s.textContent = e.cssText, i.appendChild(s);
+      const i = document.createElement("style"), o = N.litNonce;
+      o !== void 0 && i.setAttribute("nonce", o), i.textContent = e.cssText, s.appendChild(i);
     }
-}, Z = q ? (i) => i : (i) => i instanceof CSSStyleSheet ? ((t) => {
+}, G = V ? (s) => s : (s) => s instanceof CSSStyleSheet ? ((t) => {
   let e = "";
-  for (const s of t.cssRules)
-    e += s.cssText;
-  return pt(e);
-})(i) : i;
+  for (const i of t.cssRules)
+    e += i.cssText;
+  return dt(e);
+})(s) : s;
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const { is: mt, defineProperty: gt, getOwnPropertyDescriptor: ft, getOwnPropertyNames: _t, getOwnPropertySymbols: $t, getPrototypeOf: yt } = Object, $ = globalThis, G = $.trustedTypes, bt = G ? G.emptyScript : "", z = $.reactiveElementPolyfillSupport, S = (i, t) => i, H = { toAttribute(i, t) {
+const { is: mt, defineProperty: gt, getOwnPropertyDescriptor: ft, getOwnPropertyNames: _t, getOwnPropertySymbols: $t, getPrototypeOf: bt } = Object, b = globalThis, Z = b.trustedTypes, yt = Z ? Z.emptyScript : "", z = b.reactiveElementPolyfillSupport, P = (s, t) => s, I = { toAttribute(s, t) {
   switch (t) {
     case Boolean:
-      i = i ? bt : null;
+      s = s ? yt : null;
       break;
     case Object:
     case Array:
-      i = i == null ? i : JSON.stringify(i);
+      s = s == null ? s : JSON.stringify(s);
   }
-  return i;
-}, fromAttribute(i, t) {
-  let e = i;
+  return s;
+}, fromAttribute(s, t) {
+  let e = s;
   switch (t) {
     case Boolean:
-      e = i !== null;
+      e = s !== null;
       break;
     case Number:
-      e = i === null ? null : Number(i);
+      e = s === null ? null : Number(s);
       break;
     case Object:
     case Array:
       try {
-        e = JSON.parse(i);
+        e = JSON.parse(s);
       } catch {
         e = null;
       }
   }
   return e;
-} }, W = (i, t) => !mt(i, t), K = { attribute: !0, type: String, converter: H, reflect: !1, hasChanged: W };
-Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), $.litPropertyMetadata ?? ($.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+} }, J = (s, t) => !mt(s, t), K = { attribute: !0, type: String, converter: I, reflect: !1, hasChanged: J };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), b.litPropertyMetadata ?? (b.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
 class w extends HTMLElement {
   static addInitializer(t) {
     this._$Ei(), (this.l ?? (this.l = [])).push(t);
@@ -90,11 +90,11 @@ class w extends HTMLElement {
   }
   static createProperty(t, e = K) {
     if (e.state && (e.attribute = !1), this._$Ei(), this.elementProperties.set(t, e), !e.noAccessor) {
-      const s = Symbol(), o = this.getPropertyDescriptor(t, s, e);
+      const i = Symbol(), o = this.getPropertyDescriptor(t, i, e);
       o !== void 0 && gt(this.prototype, t, o);
     }
   }
-  static getPropertyDescriptor(t, e, s) {
+  static getPropertyDescriptor(t, e, i) {
     const { get: o, set: r } = ft(this.prototype, t) ?? { get() {
       return this[e];
     }, set(n) {
@@ -104,36 +104,36 @@ class w extends HTMLElement {
       return o == null ? void 0 : o.call(this);
     }, set(n) {
       const l = o == null ? void 0 : o.call(this);
-      r.call(this, n), this.requestUpdate(t, l, s);
+      r.call(this, n), this.requestUpdate(t, l, i);
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(t) {
     return this.elementProperties.get(t) ?? K;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(S("elementProperties")))
+    if (this.hasOwnProperty(P("elementProperties")))
       return;
-    const t = yt(this);
+    const t = bt(this);
     t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(S("finalized")))
+    if (this.hasOwnProperty(P("finalized")))
       return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(S("properties"))) {
-      const e = this.properties, s = [..._t(e), ...$t(e)];
-      for (const o of s)
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(P("properties"))) {
+      const e = this.properties, i = [..._t(e), ...$t(e)];
+      for (const o of i)
         this.createProperty(o, e[o]);
     }
     const t = this[Symbol.metadata];
     if (t !== null) {
       const e = litPropertyMetadata.get(t);
       if (e !== void 0)
-        for (const [s, o] of e)
-          this.elementProperties.set(s, o);
+        for (const [i, o] of e)
+          this.elementProperties.set(i, o);
     }
     this._$Eh = /* @__PURE__ */ new Map();
-    for (const [e, s] of this.elementProperties) {
-      const o = this._$Eu(e, s);
+    for (const [e, i] of this.elementProperties) {
+      const o = this._$Eu(e, i);
       o !== void 0 && this._$Eh.set(o, e);
     }
     this.elementStyles = this.finalizeStyles(this.styles);
@@ -141,16 +141,16 @@ class w extends HTMLElement {
   static finalizeStyles(t) {
     const e = [];
     if (Array.isArray(t)) {
-      const s = new Set(t.flat(1 / 0).reverse());
-      for (const o of s)
-        e.unshift(Z(o));
+      const i = new Set(t.flat(1 / 0).reverse());
+      for (const o of i)
+        e.unshift(G(o));
     } else
-      t !== void 0 && e.push(Z(t));
+      t !== void 0 && e.push(G(t));
     return e;
   }
   static _$Eu(t, e) {
-    const s = e.attribute;
-    return s === !1 ? void 0 : typeof s == "string" ? s : typeof t == "string" ? t.toLowerCase() : void 0;
+    const i = e.attribute;
+    return i === !1 ? void 0 : typeof i == "string" ? i : typeof t == "string" ? t.toLowerCase() : void 0;
   }
   constructor() {
     super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
@@ -169,8 +169,8 @@ class w extends HTMLElement {
   }
   _$E_() {
     const t = /* @__PURE__ */ new Map(), e = this.constructor.elementProperties;
-    for (const s of e.keys())
-      this.hasOwnProperty(s) && (t.set(s, this[s]), delete this[s]);
+    for (const i of e.keys())
+      this.hasOwnProperty(i) && (t.set(i, this[i]), delete this[i]);
     t.size > 0 && (this._$Ep = t);
   }
   createRenderRoot() {
@@ -180,8 +180,8 @@ class w extends HTMLElement {
   connectedCallback() {
     var t;
     this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(!0), (t = this._$EO) == null || t.forEach((e) => {
-      var s;
-      return (s = e.hostConnected) == null ? void 0 : s.call(e);
+      var i;
+      return (i = e.hostConnected) == null ? void 0 : i.call(e);
     });
   }
   enableUpdating(t) {
@@ -189,39 +189,39 @@ class w extends HTMLElement {
   disconnectedCallback() {
     var t;
     (t = this._$EO) == null || t.forEach((e) => {
-      var s;
-      return (s = e.hostDisconnected) == null ? void 0 : s.call(e);
+      var i;
+      return (i = e.hostDisconnected) == null ? void 0 : i.call(e);
     });
   }
-  attributeChangedCallback(t, e, s) {
-    this._$AK(t, s);
+  attributeChangedCallback(t, e, i) {
+    this._$AK(t, i);
   }
   _$EC(t, e) {
     var r;
-    const s = this.constructor.elementProperties.get(t), o = this.constructor._$Eu(t, s);
-    if (o !== void 0 && s.reflect === !0) {
-      const n = (((r = s.converter) == null ? void 0 : r.toAttribute) !== void 0 ? s.converter : H).toAttribute(e, s.type);
+    const i = this.constructor.elementProperties.get(t), o = this.constructor._$Eu(t, i);
+    if (o !== void 0 && i.reflect === !0) {
+      const n = (((r = i.converter) == null ? void 0 : r.toAttribute) !== void 0 ? i.converter : I).toAttribute(e, i.type);
       this._$Em = t, n == null ? this.removeAttribute(o) : this.setAttribute(o, n), this._$Em = null;
     }
   }
   _$AK(t, e) {
     var r;
-    const s = this.constructor, o = s._$Eh.get(t);
+    const i = this.constructor, o = i._$Eh.get(t);
     if (o !== void 0 && this._$Em !== o) {
-      const n = s.getPropertyOptions(o), l = typeof n.converter == "function" ? { fromAttribute: n.converter } : ((r = n.converter) == null ? void 0 : r.fromAttribute) !== void 0 ? n.converter : H;
+      const n = i.getPropertyOptions(o), l = typeof n.converter == "function" ? { fromAttribute: n.converter } : ((r = n.converter) == null ? void 0 : r.fromAttribute) !== void 0 ? n.converter : I;
       this._$Em = o, this[o] = l.fromAttribute(e, n.type), this._$Em = null;
     }
   }
-  requestUpdate(t, e, s) {
+  requestUpdate(t, e, i) {
     if (t !== void 0) {
-      if (s ?? (s = this.constructor.getPropertyOptions(t)), !(s.hasChanged ?? W)(this[t], e))
+      if (i ?? (i = this.constructor.getPropertyOptions(t)), !(i.hasChanged ?? J)(this[t], e))
         return;
-      this.P(t, e, s);
+      this.P(t, e, i);
     }
     this.isUpdatePending === !1 && (this._$ES = this._$ET());
   }
-  P(t, e, s) {
-    this._$AL.has(t) || this._$AL.set(t, e), s.reflect === !0 && this._$Em !== t && (this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Set())).add(t);
+  P(t, e, i) {
+    this._$AL.has(t) || this._$AL.set(t, e), i.reflect === !0 && this._$Em !== t && (this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Set())).add(t);
   }
   async _$ET() {
     this.isUpdatePending = !0;
@@ -237,7 +237,7 @@ class w extends HTMLElement {
     return this.performUpdate();
   }
   performUpdate() {
-    var s;
+    var i;
     if (!this.isUpdatePending)
       return;
     if (!this.hasUpdated) {
@@ -254,7 +254,7 @@ class w extends HTMLElement {
     let t = !1;
     const e = this._$AL;
     try {
-      t = this.shouldUpdate(e), t ? (this.willUpdate(e), (s = this._$EO) == null || s.forEach((o) => {
+      t = this.shouldUpdate(e), t ? (this.willUpdate(e), (i = this._$EO) == null || i.forEach((o) => {
         var r;
         return (r = o.hostUpdate) == null ? void 0 : r.call(o);
       }), this.update(e)) : this._$EU();
@@ -267,9 +267,9 @@ class w extends HTMLElement {
   }
   _$AE(t) {
     var e;
-    (e = this._$EO) == null || e.forEach((s) => {
+    (e = this._$EO) == null || e.forEach((i) => {
       var o;
-      return (o = s.hostUpdated) == null ? void 0 : o.call(s);
+      return (o = i.hostUpdated) == null ? void 0 : o.call(i);
     }), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(t)), this.updated(t);
   }
   _$EU() {
@@ -292,86 +292,86 @@ class w extends HTMLElement {
   firstUpdated(t) {
   }
 }
-w.elementStyles = [], w.shadowRootOptions = { mode: "open" }, w[S("elementProperties")] = /* @__PURE__ */ new Map(), w[S("finalized")] = /* @__PURE__ */ new Map(), z == null || z({ ReactiveElement: w }), ($.reactiveElementVersions ?? ($.reactiveElementVersions = [])).push("2.0.4");
+w.elementStyles = [], w.shadowRootOptions = { mode: "open" }, w[P("elementProperties")] = /* @__PURE__ */ new Map(), w[P("finalized")] = /* @__PURE__ */ new Map(), z == null || z({ ReactiveElement: w }), (b.reactiveElementVersions ?? (b.reactiveElementVersions = [])).push("2.0.4");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const P = globalThis, I = P.trustedTypes, Y = I ? I.createPolicy("lit-html", { createHTML: (i) => i }) : void 0, rt = "$lit$", _ = `lit$${(Math.random() + "").slice(9)}$`, at = "?" + _, vt = `<${at}>`, v = document, U = () => v.createComment(""), k = (i) => i === null || typeof i != "object" && typeof i != "function", lt = Array.isArray, At = (i) => lt(i) || typeof (i == null ? void 0 : i[Symbol.iterator]) == "function", D = `[ 	
-\f\r]`, E = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, Q = /-->/g, X = />/g, y = RegExp(`>|${D}(?:([^\\s"'>=/]+)(${D}*=${D}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), tt = /'/g, et = /"/g, ht = /^(?:script|style|textarea|title)$/i, wt = (i) => (t, ...e) => ({ _$litType$: i, strings: t, values: e }), f = wt(1), x = Symbol.for("lit-noChange"), p = Symbol.for("lit-nothing"), st = /* @__PURE__ */ new WeakMap(), b = v.createTreeWalker(v, 129);
-function dt(i, t) {
-  if (!Array.isArray(i) || !i.hasOwnProperty("raw"))
+const L = globalThis, B = L.trustedTypes, Y = B ? B.createPolicy("lit-html", { createHTML: (s) => s }) : void 0, rt = "$lit$", $ = `lit$${(Math.random() + "").slice(9)}$`, at = "?" + $, vt = `<${at}>`, A = document, U = () => A.createComment(""), M = (s) => s === null || typeof s != "object" && typeof s != "function", lt = Array.isArray, xt = (s) => lt(s) || typeof (s == null ? void 0 : s[Symbol.iterator]) == "function", D = `[ 	
+\f\r]`, C = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, Q = /-->/g, X = />/g, v = RegExp(`>|${D}(?:([^\\s"'>=/]+)(${D}*=${D}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), tt = /'/g, et = /"/g, pt = /^(?:script|style|textarea|title)$/i, At = (s) => (t, ...e) => ({ _$litType$: s, strings: t, values: e }), u = At(1), S = Symbol.for("lit-noChange"), d = Symbol.for("lit-nothing"), st = /* @__PURE__ */ new WeakMap(), x = A.createTreeWalker(A, 129);
+function ht(s, t) {
+  if (!Array.isArray(s) || !s.hasOwnProperty("raw"))
     throw Error("invalid template strings array");
   return Y !== void 0 ? Y.createHTML(t) : t;
 }
-const xt = (i, t) => {
-  const e = i.length - 1, s = [];
-  let o, r = t === 2 ? "<svg>" : "", n = E;
+const wt = (s, t) => {
+  const e = s.length - 1, i = [];
+  let o, r = t === 2 ? "<svg>" : "", n = C;
   for (let l = 0; l < e; l++) {
-    const a = i[l];
-    let d, c, h = -1, m = 0;
-    for (; m < a.length && (n.lastIndex = m, c = n.exec(a), c !== null); )
-      m = n.lastIndex, n === E ? c[1] === "!--" ? n = Q : c[1] !== void 0 ? n = X : c[2] !== void 0 ? (ht.test(c[2]) && (o = RegExp("</" + c[2], "g")), n = y) : c[3] !== void 0 && (n = y) : n === y ? c[0] === ">" ? (n = o ?? E, h = -1) : c[1] === void 0 ? h = -2 : (h = n.lastIndex - c[2].length, d = c[1], n = c[3] === void 0 ? y : c[3] === '"' ? et : tt) : n === et || n === tt ? n = y : n === Q || n === X ? n = E : (n = y, o = void 0);
-    const g = n === y && i[l + 1].startsWith("/>") ? " " : "";
-    r += n === E ? a + vt : h >= 0 ? (s.push(d), a.slice(0, h) + rt + a.slice(h) + _ + g) : a + _ + (h === -2 ? l : g);
-  }
-  return [dt(i, r + (i[e] || "<?>") + (t === 2 ? "</svg>" : "")), s];
+    const a = s[l];
+    let h, c, p = -1, f = 0;
+    for (; f < a.length && (n.lastIndex = f, c = n.exec(a), c !== null); )
+      f = n.lastIndex, n === C ? c[1] === "!--" ? n = Q : c[1] !== void 0 ? n = X : c[2] !== void 0 ? (pt.test(c[2]) && (o = RegExp("</" + c[2], "g")), n = v) : c[3] !== void 0 && (n = v) : n === v ? c[0] === ">" ? (n = o ?? C, p = -1) : c[1] === void 0 ? p = -2 : (p = n.lastIndex - c[2].length, h = c[1], n = c[3] === void 0 ? v : c[3] === '"' ? et : tt) : n === et || n === tt ? n = v : n === Q || n === X ? n = C : (n = v, o = void 0);
+    const _ = n === v && s[l + 1].startsWith("/>") ? " " : "";
+    r += n === C ? a + vt : p >= 0 ? (i.push(h), a.slice(0, p) + rt + a.slice(p) + $ + _) : a + $ + (p === -2 ? l : _);
+  }
+  return [ht(s, r + (s[e] || "<?>") + (t === 2 ? "</svg>" : "")), i];
 };
-class L {
-  constructor({ strings: t, _$litType$: e }, s) {
+class R {
+  constructor({ strings: t, _$litType$: e }, i) {
     let o;
     this.parts = [];
     let r = 0, n = 0;
-    const l = t.length - 1, a = this.parts, [d, c] = xt(t, e);
-    if (this.el = L.createElement(d, s), b.currentNode = this.el.content, e === 2) {
-      const h = this.el.content.firstChild;
-      h.replaceWith(...h.childNodes);
+    const l = t.length - 1, a = this.parts, [h, c] = wt(t, e);
+    if (this.el = R.createElement(h, i), x.currentNode = this.el.content, e === 2) {
+      const p = this.el.content.firstChild;
+      p.replaceWith(...p.childNodes);
     }
-    for (; (o = b.nextNode()) !== null && a.length < l; ) {
+    for (; (o = x.nextNode()) !== null && a.length < l; ) {
       if (o.nodeType === 1) {
         if (o.hasAttributes())
-          for (const h of o.getAttributeNames())
-            if (h.endsWith(rt)) {
-              const m = c[n++], g = o.getAttribute(h).split(_), R = /([.?@])?(.*)/.exec(m);
-              a.push({ type: 1, index: r, name: R[2], strings: g, ctor: R[1] === "." ? Et : R[1] === "?" ? St : R[1] === "@" ? Pt : B }), o.removeAttribute(h);
+          for (const p of o.getAttributeNames())
+            if (p.endsWith(rt)) {
+              const f = c[n++], _ = o.getAttribute(p).split($), O = /([.?@])?(.*)/.exec(f);
+              a.push({ type: 1, index: r, name: O[2], strings: _, ctor: O[1] === "." ? Et : O[1] === "?" ? Ct : O[1] === "@" ? Pt : H }), o.removeAttribute(p);
             } else
-              h.startsWith(_) && (a.push({ type: 6, index: r }), o.removeAttribute(h));
-        if (ht.test(o.tagName)) {
-          const h = o.textContent.split(_), m = h.length - 1;
-          if (m > 0) {
-            o.textContent = I ? I.emptyScript : "";
-            for (let g = 0; g < m; g++)
-              o.append(h[g], U()), b.nextNode(), a.push({ type: 2, index: ++r });
-            o.append(h[m], U());
+              p.startsWith($) && (a.push({ type: 6, index: r }), o.removeAttribute(p));
+        if (pt.test(o.tagName)) {
+          const p = o.textContent.split($), f = p.length - 1;
+          if (f > 0) {
+            o.textContent = B ? B.emptyScript : "";
+            for (let _ = 0; _ < f; _++)
+              o.append(p[_], U()), x.nextNode(), a.push({ type: 2, index: ++r });
+            o.append(p[f], U());
           }
         }
       } else if (o.nodeType === 8)
         if (o.data === at)
           a.push({ type: 2, index: r });
         else {
-          let h = -1;
-          for (; (h = o.data.indexOf(_, h + 1)) !== -1; )
-            a.push({ type: 7, index: r }), h += _.length - 1;
+          let p = -1;
+          for (; (p = o.data.indexOf($, p + 1)) !== -1; )
+            a.push({ type: 7, index: r }), p += $.length - 1;
         }
       r++;
     }
   }
   static createElement(t, e) {
-    const s = v.createElement("template");
-    return s.innerHTML = t, s;
+    const i = A.createElement("template");
+    return i.innerHTML = t, i;
   }
 }
-function C(i, t, e = i, s) {
+function E(s, t, e = s, i) {
   var n, l;
-  if (t === x)
+  if (t === S)
     return t;
-  let o = s !== void 0 ? (n = e._$Co) == null ? void 0 : n[s] : e._$Cl;
-  const r = k(t) ? void 0 : t._$litDirective$;
-  return (o == null ? void 0 : o.constructor) !== r && ((l = o == null ? void 0 : o._$AO) == null || l.call(o, !1), r === void 0 ? o = void 0 : (o = new r(i), o._$AT(i, e, s)), s !== void 0 ? (e._$Co ?? (e._$Co = []))[s] = o : e._$Cl = o), o !== void 0 && (t = C(i, o._$AS(i, t.values), o, s)), t;
+  let o = i !== void 0 ? (n = e._$Co) == null ? void 0 : n[i] : e._$Cl;
+  const r = M(t) ? void 0 : t._$litDirective$;
+  return (o == null ? void 0 : o.constructor) !== r && ((l = o == null ? void 0 : o._$AO) == null || l.call(o, !1), r === void 0 ? o = void 0 : (o = new r(s), o._$AT(s, e, i)), i !== void 0 ? (e._$Co ?? (e._$Co = []))[i] = o : e._$Cl = o), o !== void 0 && (t = E(s, o._$AS(s, t.values), o, i)), t;
 }
-class Ct {
+class St {
   constructor(t, e) {
     this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = e;
   }
@@ -382,31 +382,31 @@ class Ct {
     return this._$AM._$AU;
   }
   u(t) {
-    const { el: { content: e }, parts: s } = this._$AD, o = ((t == null ? void 0 : t.creationScope) ?? v).importNode(e, !0);
-    b.currentNode = o;
-    let r = b.nextNode(), n = 0, l = 0, a = s[0];
+    const { el: { content: e }, parts: i } = this._$AD, o = ((t == null ? void 0 : t.creationScope) ?? A).importNode(e, !0);
+    x.currentNode = o;
+    let r = x.nextNode(), n = 0, l = 0, a = i[0];
     for (; a !== void 0; ) {
       if (n === a.index) {
-        let d;
-        a.type === 2 ? d = new O(r, r.nextSibling, this, t) : a.type === 1 ? d = new a.ctor(r, a.name, a.strings, this, t) : a.type === 6 && (d = new Tt(r, this, t)), this._$AV.push(d), a = s[++l];
+        let h;
+        a.type === 2 ? h = new k(r, r.nextSibling, this, t) : a.type === 1 ? h = new a.ctor(r, a.name, a.strings, this, t) : a.type === 6 && (h = new Lt(r, this, t)), this._$AV.push(h), a = i[++l];
       }
-      n !== (a == null ? void 0 : a.index) && (r = b.nextNode(), n++);
+      n !== (a == null ? void 0 : a.index) && (r = x.nextNode(), n++);
     }
-    return b.currentNode = v, o;
+    return x.currentNode = A, o;
   }
   p(t) {
     let e = 0;
-    for (const s of this._$AV)
-      s !== void 0 && (s.strings !== void 0 ? (s._$AI(t, s, e), e += s.strings.length - 2) : s._$AI(t[e])), e++;
+    for (const i of this._$AV)
+      i !== void 0 && (i.strings !== void 0 ? (i._$AI(t, i, e), e += i.strings.length - 2) : i._$AI(t[e])), e++;
   }
 }
-class O {
+class k {
   get _$AU() {
     var t;
     return ((t = this._$AM) == null ? void 0 : t._$AU) ?? this._$Cv;
   }
-  constructor(t, e, s, o) {
-    this.type = 2, this._$AH = p, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = s, this.options = o, this._$Cv = (o == null ? void 0 : o.isConnected) ?? !0;
+  constructor(t, e, i, o) {
+    this.type = 2, this._$AH = d, this._$AN = void 0, this._$AA = t, this._$AB = e, this._$AM = i, this.options = o, this._$Cv = (o == null ? void 0 : o.isConnected) ?? !0;
   }
   get parentNode() {
     let t = this._$AA.parentNode;
@@ -420,7 +420,7 @@ class O {
     return this._$AB;
   }
   _$AI(t, e = this) {
-    t = C(this, t, e), k(t) ? t === p || t == null || t === "" ? (this._$AH !== p && this._$AR(), this._$AH = p) : t !== this._$AH && t !== x && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : At(t) ? this.k(t) : this._(t);
+    t = E(this, t, e), M(t) ? t === d || t == null || t === "" ? (this._$AH !== d && this._$AR(), this._$AH = d) : t !== this._$AH && t !== S && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : xt(t) ? this.k(t) : this._(t);
   }
   S(t) {
     return this._$AA.parentNode.insertBefore(t, this._$AB);
@@ -429,33 +429,33 @@ class O {
     this._$AH !== t && (this._$AR(), this._$AH = this.S(t));
   }
   _(t) {
-    this._$AH !== p && k(this._$AH) ? this._$AA.nextSibling.data = t : this.T(v.createTextNode(t)), this._$AH = t;
+    this._$AH !== d && M(this._$AH) ? this._$AA.nextSibling.data = t : this.T(A.createTextNode(t)), this._$AH = t;
   }
   $(t) {
     var r;
-    const { values: e, _$litType$: s } = t, o = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = L.createElement(dt(s.h, s.h[0]), this.options)), s);
+    const { values: e, _$litType$: i } = t, o = typeof i == "number" ? this._$AC(t) : (i.el === void 0 && (i.el = R.createElement(ht(i.h, i.h[0]), this.options)), i);
     if (((r = this._$AH) == null ? void 0 : r._$AD) === o)
       this._$AH.p(e);
     else {
-      const n = new Ct(o, this), l = n.u(this.options);
+      const n = new St(o, this), l = n.u(this.options);
       n.p(e), this.T(l), this._$AH = n;
     }
   }
   _$AC(t) {
     let e = st.get(t.strings);
-    return e === void 0 && st.set(t.strings, e = new L(t)), e;
+    return e === void 0 && st.set(t.strings, e = new R(t)), e;
   }
   k(t) {
     lt(this._$AH) || (this._$AH = [], this._$AR());
     const e = this._$AH;
-    let s, o = 0;
+    let i, o = 0;
     for (const r of t)
-      o === e.length ? e.push(s = new O(this.S(U()), this.S(U()), this, this.options)) : s = e[o], s._$AI(r), o++;
-    o < e.length && (this._$AR(s && s._$AB.nextSibling, o), e.length = o);
+      o === e.length ? e.push(i = new k(this.S(U()), this.S(U()), this, this.options)) : i = e[o], i._$AI(r), o++;
+    o < e.length && (this._$AR(i && i._$AB.nextSibling, o), e.length = o);
   }
   _$AR(t = this._$AA.nextSibling, e) {
-    var s;
-    for ((s = this._$AP) == null ? void 0 : s.call(this, !1, !0, e); t && t !== this._$AB; ) {
+    var i;
+    for ((i = this._$AP) == null ? void 0 : i.call(this, !1, !0, e); t && t !== this._$AB; ) {
       const o = t.nextSibling;
       t.remove(), t = o;
     }
@@ -465,85 +465,85 @@ class O {
     this._$AM === void 0 && (this._$Cv = t, (e = this._$AP) == null || e.call(this, t));
   }
 }
-class B {
+class H {
   get tagName() {
     return this.element.tagName;
   }
   get _$AU() {
     return this._$AM._$AU;
   }
-  constructor(t, e, s, o, r) {
-    this.type = 1, this._$AH = p, this._$AN = void 0, this.element = t, this.name = e, this._$AM = o, this.options = r, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = p;
+  constructor(t, e, i, o, r) {
+    this.type = 1, this._$AH = d, this._$AN = void 0, this.element = t, this.name = e, this._$AM = o, this.options = r, i.length > 2 || i[0] !== "" || i[1] !== "" ? (this._$AH = Array(i.length - 1).fill(new String()), this.strings = i) : this._$AH = d;
   }
-  _$AI(t, e = this, s, o) {
+  _$AI(t, e = this, i, o) {
     const r = this.strings;
     let n = !1;
     if (r === void 0)
-      t = C(this, t, e, 0), n = !k(t) || t !== this._$AH && t !== x, n && (this._$AH = t);
+      t = E(this, t, e, 0), n = !M(t) || t !== this._$AH && t !== S, n && (this._$AH = t);
     else {
       const l = t;
-      let a, d;
+      let a, h;
       for (t = r[0], a = 0; a < r.length - 1; a++)
-        d = C(this, l[s + a], e, a), d === x && (d = this._$AH[a]), n || (n = !k(d) || d !== this._$AH[a]), d === p ? t = p : t !== p && (t += (d ?? "") + r[a + 1]), this._$AH[a] = d;
+        h = E(this, l[i + a], e, a), h === S && (h = this._$AH[a]), n || (n = !M(h) || h !== this._$AH[a]), h === d ? t = d : t !== d && (t += (h ?? "") + r[a + 1]), this._$AH[a] = h;
     }
     n && !o && this.j(t);
   }
   j(t) {
-    t === p ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
+    t === d ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
   }
 }
-class Et extends B {
+class Et extends H {
   constructor() {
     super(...arguments), this.type = 3;
   }
   j(t) {
-    this.element[this.name] = t === p ? void 0 : t;
+    this.element[this.name] = t === d ? void 0 : t;
   }
 }
-class St extends B {
+class Ct extends H {
   constructor() {
     super(...arguments), this.type = 4;
   }
   j(t) {
-    this.element.toggleAttribute(this.name, !!t && t !== p);
+    this.element.toggleAttribute(this.name, !!t && t !== d);
   }
 }
-class Pt extends B {
-  constructor(t, e, s, o, r) {
-    super(t, e, s, o, r), this.type = 5;
+class Pt extends H {
+  constructor(t, e, i, o, r) {
+    super(t, e, i, o, r), this.type = 5;
   }
   _$AI(t, e = this) {
-    if ((t = C(this, t, e, 0) ?? p) === x)
+    if ((t = E(this, t, e, 0) ?? d) === S)
       return;
-    const s = this._$AH, o = t === p && s !== p || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, r = t !== p && (s === p || o);
-    o && this.element.removeEventListener(this.name, this, s), r && this.element.addEventListener(this.name, this, t), this._$AH = t;
+    const i = this._$AH, o = t === d && i !== d || t.capture !== i.capture || t.once !== i.once || t.passive !== i.passive, r = t !== d && (i === d || o);
+    o && this.element.removeEventListener(this.name, this, i), r && this.element.addEventListener(this.name, this, t), this._$AH = t;
   }
   handleEvent(t) {
     var e;
     typeof this._$AH == "function" ? this._$AH.call(((e = this.options) == null ? void 0 : e.host) ?? this.element, t) : this._$AH.handleEvent(t);
   }
 }
-class Tt {
-  constructor(t, e, s) {
-    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = s;
+class Lt {
+  constructor(t, e, i) {
+    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = e, this.options = i;
   }
   get _$AU() {
     return this._$AM._$AU;
   }
   _$AI(t) {
-    C(this, t);
+    E(this, t);
   }
 }
-const j = P.litHtmlPolyfillSupport;
-j == null || j(L, O), (P.litHtmlVersions ?? (P.litHtmlVersions = [])).push("3.1.2");
-const Ut = (i, t, e) => {
-  const s = (e == null ? void 0 : e.renderBefore) ?? t;
-  let o = s._$litPart$;
+const j = L.litHtmlPolyfillSupport;
+j == null || j(R, k), (L.litHtmlVersions ?? (L.litHtmlVersions = [])).push("3.1.2");
+const Tt = (s, t, e) => {
+  const i = (e == null ? void 0 : e.renderBefore) ?? t;
+  let o = i._$litPart$;
   if (o === void 0) {
     const r = (e == null ? void 0 : e.renderBefore) ?? null;
-    s._$litPart$ = o = new O(t.insertBefore(U(), r), r, void 0, e ?? {});
+    i._$litPart$ = o = new k(t.insertBefore(U(), r), r, void 0, e ?? {});
   }
-  return o._$AI(i), o;
+  return o._$AI(s), o;
 };
 /**
  * @license
@@ -561,7 +561,7 @@ class T extends w {
   }
   update(t) {
     const e = this.render();
-    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = Ut(e, this.renderRoot, this.renderOptions);
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t), this._$Do = Tt(e, this.renderRoot, this.renderOptions);
   }
   connectedCallback() {
     var t;
@@ -572,96 +572,96 @@ class T extends w {
     super.disconnectedCallback(), (t = this._$Do) == null || t.setConnected(!1);
   }
   render() {
-    return x;
+    return S;
   }
 }
 var ot;
 T._$litElement$ = !0, T.finalized = !0, (ot = globalThis.litElementHydrateSupport) == null || ot.call(globalThis, { LitElement: T });
-const V = globalThis.litElementPolyfillSupport;
-V == null || V({ LitElement: T });
+const q = globalThis.litElementPolyfillSupport;
+q == null || q({ LitElement: T });
 (globalThis.litElementVersions ?? (globalThis.litElementVersions = [])).push("4.0.4");
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const kt = (i) => (t, e) => {
+const Ut = (s) => (t, e) => {
   e !== void 0 ? e.addInitializer(() => {
-    customElements.define(i, t);
-  }) : customElements.define(i, t);
+    customElements.define(s, t);
+  }) : customElements.define(s, t);
 };
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const Lt = { attribute: !0, type: String, converter: H, reflect: !1, hasChanged: W }, Ot = (i = Lt, t, e) => {
-  const { kind: s, metadata: o } = e;
+const Mt = { attribute: !0, type: String, converter: I, reflect: !1, hasChanged: J }, Rt = (s = Mt, t, e) => {
+  const { kind: i, metadata: o } = e;
   let r = globalThis.litPropertyMetadata.get(o);
-  if (r === void 0 && globalThis.litPropertyMetadata.set(o, r = /* @__PURE__ */ new Map()), r.set(e.name, i), s === "accessor") {
+  if (r === void 0 && globalThis.litPropertyMetadata.set(o, r = /* @__PURE__ */ new Map()), r.set(e.name, s), i === "accessor") {
     const { name: n } = e;
     return { set(l) {
       const a = t.get.call(this);
-      t.set.call(this, l), this.requestUpdate(n, a, i);
+      t.set.call(this, l), this.requestUpdate(n, a, s);
     }, init(l) {
-      return l !== void 0 && this.P(n, void 0, i), l;
+      return l !== void 0 && this.P(n, void 0, s), l;
     } };
   }
-  if (s === "setter") {
+  if (i === "setter") {
     const { name: n } = e;
     return function(l) {
       const a = this[n];
-      t.call(this, l), this.requestUpdate(n, a, i);
+      t.call(this, l), this.requestUpdate(n, a, s);
     };
   }
-  throw Error("Unsupported decorator location: " + s);
+  throw Error("Unsupported decorator location: " + i);
 };
-function M(i) {
-  return (t, e) => typeof e == "object" ? Ot(i, t, e) : ((s, o, r) => {
+function y(s) {
+  return (t, e) => typeof e == "object" ? Rt(s, t, e) : ((i, o, r) => {
     const n = o.hasOwnProperty(r);
-    return o.constructor.createProperty(r, n ? { ...s, wrapped: !0 } : s), n ? Object.getOwnPropertyDescriptor(o, r) : void 0;
-  })(i, t, e);
+    return o.constructor.createProperty(r, n ? { ...i, wrapped: !0 } : i), n ? Object.getOwnPropertyDescriptor(o, r) : void 0;
+  })(s, t, e);
 }
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function Mt(i) {
-  return M({ ...i, state: !0, attribute: !1 });
+function kt(s) {
+  return y({ ...s, state: !0, attribute: !1 });
 }
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-const it = (i, t, e) => (e.configurable = !0, e.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(i, t, e), e);
+const it = (s, t, e) => (e.configurable = !0, e.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(s, t, e), e);
 /**
  * @license
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-function Rt(i, t) {
-  return (e, s, o) => {
+function Ot(s, t) {
+  return (e, i, o) => {
     const r = (n) => {
       var l;
-      return ((l = n.renderRoot) == null ? void 0 : l.querySelector(i)) ?? null;
+      return ((l = n.renderRoot) == null ? void 0 : l.querySelector(s)) ?? null;
     };
     if (t) {
-      const { get: n, set: l } = typeof s == "object" ? e : o ?? (() => {
+      const { get: n, set: l } = typeof i == "object" ? e : o ?? (() => {
         const a = Symbol();
         return { get() {
           return this[a];
-        }, set(d) {
-          this[a] = d;
+        }, set(h) {
+          this[a] = h;
         } };
       })();
-      return it(e, s, { get() {
+      return it(e, i, { get() {
         let a = n.call(this);
         return a === void 0 && (a = r(this), (a !== null || this.hasUpdated) && l.call(this, a)), a;
       } });
     }
-    return it(e, s, { get() {
+    return it(e, i, { get() {
       return r(this);
     } });
   };
@@ -671,29 +671,29 @@ class Nt {
     return this.attributes["ext-id"];
   }
 }
-class Ht {
-}
-var It = Object.defineProperty, Bt = Object.getOwnPropertyDescriptor, A = (i, t, e, s) => {
-  for (var o = s > 1 ? void 0 : s ? Bt(t, e) : t, r = i.length - 1, n; r >= 0; r--)
-    (n = i[r]) && (o = (s ? n(t, e, o) : n(o)) || o);
-  return s && o && It(t, e, o), o;
+var It = Object.defineProperty, Bt = Object.getOwnPropertyDescriptor, g = (s, t, e, i) => {
+  for (var o = i > 1 ? void 0 : i ? Bt(t, e) : t, r = s.length - 1, n; r >= 0; r--)
+    (n = s[r]) && (o = (i ? n(t, e, o) : n(o)) || o);
+  return i && o && It(t, e, o), o;
 };
-let u = class extends T {
+let m = class extends T {
   constructor() {
-    var i, t, e, s;
-    super(...arguments), this.getByAddress = (t = (i = window.miam) == null ? void 0 : i.pos) == null ? void 0 : t.getByAddress, this.getByCoordinates = (s = (e = window.miam) == null ? void 0 : e.pos) == null ? void 0 : s.getByCoordinates, this._posList = [], this._markers = [], this._searchingPos = !1;
+    var s, t, e, i, o, r;
+    super(...arguments), this.selectedRadius = 25, this.radiusOption = [10, 25, 50], this.getByAddress = (t = (s = window.miam) == null ? void 0 : s.pos) == null ? void 0 : t.getByAddress, this.getByCoordinates = (i = (e = window.miam) == null ? void 0 : e.pos) == null ? void 0 : i.getByCoordinates, this.getAffiliateSuppliers = (r = (o = window.miam) == null ? void 0 : o.supplier) == null ? void 0 : r.getAffiliateSuppliers, this._posList = [], this._markers = [], this._searchingPos = !1, this._searchSubmitted = !1, this._previousSearchMethod = () => {
+    }, this._suppliers = [], this._selectedSuppliers = [], this._showPosList = !1;
   }
-  set geolocationCoordinates(i) {
-    this._geolocationCoordinates = i, this._geolocationCoordinates && Object.keys(this._geolocationCoordinates).length > 0 && this.getPosByCoordinates(this._geolocationCoordinates.latitude, this._geolocationCoordinates.longitude);
+  set geolocationCoordinates(s) {
+    var t, e;
+    this._geolocationCoordinates = s, (t = s == null ? void 0 : s.coords) != null && t.latitude && ((e = s == null ? void 0 : s.coords) != null && e.longitude) && this.getPosByCoordinates();
   }
   get geolocationCoordinates() {
     return this._geolocationCoordinates;
   }
-  _nameOfStore(i) {
-    return `${i.supplier.attributes.name} - ${i.attributes.name}`;
+  _nameOfStore(s) {
+    return `${s.supplier.attributes.name} - ${s.attributes.name}`;
   }
   connectedCallback() {
-    super.connectedCallback(), console.debug("[MealzComponents] loading store locator"), this.initLeaflet();
+    super.connectedCallback(), console.debug("[MealzComponents] loading store locator"), this.initLeaflet(), this.fetchSuppliers();
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this._leafletCss.remove(), this._miamDs.remove(), this._leafletJs.remove();
@@ -704,107 +704,160 @@ let u = class extends T {
   }
   // Executes after rendering
   firstUpdated() {
-    this.loadMap(), this.geolocationTimeout();
+    this.loadMap(), this.geolocationTimeout(), this.listenFormSubmit();
   }
   posSelectionTemplate() {
-    return f`
+    return u`
       <div class="wrapper miam-ds-body">
         <div class="pos-selection">
           <div class="title">
             <button @click=${() => this.dispatchShow(!1)}><</button>
             <span>Sélectionner un magasin</span>
           </div>
-          <div class="address-input-container">
-            ${this.geolocButtonTemplate()}
-            <input class="address-input" type="text" name="address" placeholder="Votre code postal ou ville"
-                   @keydown=${(i) => {
-      i.stopPropagation();
-    }}>
-            <button @click=${this.setAddress} class="miam-ds-button primary search-address-button">OK</button>
-          </div>
-          ${this.posListTemplate()}
+            <form id="store-locator-form">
+              <div class="address-input-container">
+                ${this.geolocButtonTemplate()}
+                <input required class="address-input" type="text" name="address" placeholder="Votre code postal ou ville">
+                <button type="submit" class="miam-ds-button primary search-address-button">OK</button>
+              </div>
+              ${this.selectRadiusTemplate()}
+              ${this.selectSupplierTemplate()}
+            </form>
+            ${this.posListTemplate()}
+          ${this._posList.length > 0 ? u`
+              <div id="mobile-buttons-wrapper" class="mobile-buttons-wrapper__see-list">
+                <button @click=${() => this.togglePosList(this._showPosList)} class="miam-ds-button primary hide-pos-button">
+                  ${this.getButtonLabel()}
+                </button>
+              </div>` : ""}
         </div>
+      </div>
         ${this.posMapTemplate()}
       </div>
   `;
   }
   geolocButtonTemplate() {
-    let i;
-    if (this._geolocationCoordinates === void 0)
-      i = f`<div class="miam-ds-loader"></div>`;
-    else if (Object.keys(this._geolocationCoordinates).length > 0)
-      i = f`<img title="Votre position" class="geolocation-icon" src="https://storage.googleapis.com/assets.miam.tech/generic/icons/locate-primary.svg" alt="Geolocaliser"/>`;
+    var t, e, i, o;
+    let s;
+    if (this.geolocationCoordinates === void 0)
+      s = u`<div class="miam-ds-loader"></div>`;
+    else if ((e = (t = this.geolocationCoordinates) == null ? void 0 : t.coords) != null && e.longitude && ((o = (i = this.geolocationCoordinates) == null ? void 0 : i.coords) != null && o.latitude))
+      s = u`<img title="Votre position" class="geolocation-icon" src="https://storage.googleapis.com/assets.miam.tech/generic/icons/locate-primary.svg" alt="Geolocaliser"/>`;
     else
-      return f``;
-    return f`
-        <button ?disabled=${this._geolocationCoordinates === void 0} class="locate-button" @click=${this.setGeolocation}>
-            ${i}
+      return u``;
+    return u`
+        <button type="button" ?disabled=${this.geolocationCoordinates === void 0} class="miam-ds-button square ghost locate-button" @click=${this.setGeolocation}>
+            ${s}
         </button>
     `;
   }
+  selectRadiusTemplate() {
+    return u`
+      <div class="select-radius miam-ds-dropdown">
+        <select @change=${this.radiusChanged}>
+          ${this.radiusOption.map((s) => u`<option ?selected=${s === this.selectedRadius} value=${s}>${s} km</option>`)}
+        </select>
+      </div>`;
+  }
+  radiusChanged(s) {
+    this.selectedRadius = parseInt(s.target.value), this._showPosList = !0, this._previousSearchMethod(!0);
+  }
   posMapTemplate() {
-    return f`
+    return u`
       <div id="map"></div>
     `;
   }
+  selectSupplierTemplate() {
+    return u`
+        <div class="select-supplier miam-ds-dropdown">
+            <select @change=${this.supplierSelected}>
+                <option ?selected=${this._selectedSuppliers.length < 1} value="${null}">Toutes les enseignes</option>
+                ${this._suppliers.map((s) => u`
+                      <option ?selected=${s === this._selectedSuppliers[0]} value=${s.id}>
+                          ${s.name}
+                      </option>`)}
+            </select>
+        </div>`;
+  }
+  supplierSelected(s) {
+    s.target.value ? this._selectedSuppliers[0] = s.target.value : this._selectedSuppliers = [], this._previousSearchMethod(!0);
+  }
   posListTemplate() {
-    if (!(this._posList.length < 1))
-      return f`
-      <div id="pos-list">
-        ${this._posList.map((i) => f`
+    if (this._searchingPos)
+      return u`
+          <div class="pos-loader">
+              <div class="miam-ds-loader"></div>
+          </div>
+      `;
+    if (this._posList.length < 1 && this._searchSubmitted)
+      return u`
+        <div class="no-pos-found">
+          <b>Aucun magasin trouvé à proximité.</b>
+          <span>Essayez une autre adresse.</span> 
+        </div>
+      `;
+    if (this._posList.length < 1)
+      return;
+    const s = this.shadowRoot.querySelector(".pos-selection");
+    return s && s.classList.toggle("pos-selection__height", this._showPosList), u`
+      <div id="pos-list" class="${this._showPosList ? "pos-list__visible" : "pos-list__hidden"}">
+        ${this._posList.map((t) => u`
             <div class="pos-item">
               <div class="top">
-                <img src="${i.supplier.attributes.logo}" alt="${i.supplier.attributes.name}"/>
+                <img src="${t.supplier.attributes.logo}" alt="${t.supplier.attributes.name}"/>
                 <div class="top-right">
-                  <div class="name">${this._nameOfStore(i)}</div>
-                  <div class="address">${i.attributes.address}</div>
+                  <div class="name">${this._nameOfStore(t)}</div>
+                  <div class="address">${t.attributes.address}</div>
                 </div>
               </div>
               <div class="bottom">
-                <button @click=${() => this.dispatchPos(i)} class="miam-ds-button primary select-pos-button">Sélectionner</button>
+                <button @click=${() => this.dispatchPos(t)} class="miam-ds-button primary select-pos-button">Sélectionner</button>
               </div>
             </div>
           `)}
       </div>
-      <div id="hide-pos-wrapper">
-        <button @click=${() => this.togglePosList(!1)} class="miam-ds-button primary hide-pos-button">Masquer</button>
-      </div>
     `;
   }
-  setAddress() {
-    if (!this._addressInput.value || this._addressInput.value.length < 3 || this._searchingPos || this._prevAddress === this._addressInput.value + ", France")
+  getButtonLabel() {
+    if (this._showPosList)
+      return "Voir la carte";
+    const s = this._posList.length;
+    return s === 1 ? "Voir le magasin" : `Voir les ${s} magasins`;
+  }
+  setAddress(s = !1) {
+    if (!this._addressInput.value || this._addressInput.value.length < 3 || this._searchingPos || !s && this._prevAddress === this._addressInput.value + ", France")
       return;
-    const i = this.shadowRoot.getElementById("pos-list");
-    i && i.style.display === "none" && this.togglePosList(!0), this._prevAddress = this._addressInput.value + ", France", this._searchingPos = !0, this.getByAddress(this._prevAddress, 10).subscribe((t) => {
-      this.setPosList(t), this.setNewLocation(), this._searchingPos = !1, this.requestUpdate();
+    const t = this.shadowRoot.getElementById("pos-list");
+    t && t.style.display === "none" && this.togglePosList(!0), this._previousSearchMethod = this.setAddress, this._prevAddress = this._addressInput.value + ", France", this._searchingPos = !0, this.requestUpdate(), this.getByAddress(this._prevAddress, this.selectedRadius, this._selectedSuppliers).subscribe((e) => {
+      this.setPosList(e), this.setNewLocation(), this._searchingPos = !1, this._searchSubmitted = !0, this.requestUpdate();
     });
   }
-  setGeolocation() {
-    const i = this.shadowRoot.getElementById("pos-list");
-    i && i.style.display === "none" && this.togglePosList(!0), this._prevAddress = "", this.getPosByCoordinates();
+  setGeolocation(s = !1) {
+    const t = this.shadowRoot.getElementById("pos-list");
+    t && t.style.display === "none" && this.togglePosList(!0), this._prevAddress = "", this._previousSearchMethod = this.setGeolocation, this.getPosByCoordinates();
   }
   getPosByCoordinates() {
-    this.getByCoordinates(this.geolocationCoordinates.latitude, this.geolocationCoordinates.longitude, 10).subscribe((i) => {
-      this._addressInput.value = "", this.setPosList(i), this.setNewLocation(), this.requestUpdate();
+    this._searchingPos = !0, this.requestUpdate(), this.getByCoordinates(this.geolocationCoordinates.coords.latitude, this.geolocationCoordinates.coords.longitude, this.selectedRadius, this._selectedSuppliers).subscribe((s) => {
+      this._addressInput.value = "", this.setPosList(s), this._searchingPos = !1, this.setNewLocation(), this._searchSubmitted = !0, this.requestUpdate();
     });
   }
-  setPosList(i) {
-    this._posList = i.data.map((t) => {
+  setPosList(s) {
+    this._posList = s.data.map((t) => {
       const e = Object.assign(new Nt(), t);
-      return e.supplier = i.included.find((s) => s.id === e.relationships.supplier.data.id), e;
+      return e.supplier = s.included.find((i) => i.id === e.relationships.supplier.data.id), e;
     });
   }
-  dispatchPos(i) {
+  dispatchPos(s) {
     const t = {
-      detail: { posId: i.id, posExtId: i.extId, supplierId: i.supplier.id, posName: this._nameOfStore(i) },
+      detail: { posId: s.id, posExtId: s.extId, supplierId: s.supplier.id, posName: this._nameOfStore(s) },
       bubbles: !0,
       composed: !0
     };
     console.debug("[MealzComponents] dispatchEvent posIdChange", t), this.dispatchEvent(new CustomEvent("posIdChange", t));
   }
-  dispatchShow(i) {
+  dispatchShow(s) {
     const t = {
-      detail: { show: i },
+      detail: { show: s },
       bubbles: !0,
       composed: !0
     };
@@ -814,37 +867,56 @@ let u = class extends T {
   initLeaflet() {
     this._leafletCss = document.createElement("link"), this._leafletCss.setAttribute("rel", "stylesheet"), this._leafletCss.setAttribute("href", "https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"), this._leafletCss.setAttribute("integrity", "sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="), this._leafletCss.setAttribute("crossorigin", ""), this._leafletJs = document.createElement("script"), this._leafletJs.setAttribute("src", "https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"), this._leafletJs.setAttribute("integrity", "sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="), this._leafletJs.setAttribute("crossorigin", ""), this._miamDs = document.createElement("link"), this._miamDs.setAttribute("rel", "stylesheet"), this._miamDs.setAttribute("href", "https://unpkg.com/miam-ds@1.2.4/miam-ds.min.css"), this.shadowRoot.appendChild(this._miamDs), this.shadowRoot.appendChild(this._leafletCss), document.head.appendChild(this._leafletJs);
   }
+  waitForLeaflet(s) {
+    let i = 50;
+    console.debug("[Map] Checking for window.L");
+    const o = setInterval(() => {
+      window.L !== void 0 || i === 0 ? (clearInterval(o), window.L !== void 0 ? (console.debug("[Map] window.L is defined"), s(!0)) : (console.error("[Map] Failed to load Leaflet after", 50 * 100, "ms"), s(!1))) : i--;
+    }, 100);
+  }
+  initMap() {
+    this._map && (this._map.off(), this._map.remove()), this.setNewLocation(), window.L.tileLayer("https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png", {
+      maxZoom: 19,
+      attribution: "Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL."
+    }).addTo(this._map);
+  }
   loadMap() {
-    this._map && (this._map.off(), this._map.remove()), setTimeout(() => {
-      this.setNewLocation(), window.L.tileLayer("https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png", {
-        maxZoom: 19,
-        attribution: "Map tiles by Carto, under CC BY 3.0. Data by OpenStreetMap, under ODbL."
-      }).addTo(this._map);
-    }, 250);
+    this.waitForLeaflet((s) => {
+      s && this.initMap();
+    });
+  }
+  fetchSuppliers() {
+    this.getAffiliateSuppliers().subscribe((s) => {
+      this._suppliers = s.map((t) => ({
+        id: t.id,
+        name: t.attributes.name
+      })), this.requestUpdate();
+    });
   }
   setNewLocation() {
-    const i = this.shadowRoot.getElementById("map");
-    i && (this._map ? (this._markers.forEach((t) => {
-      this._map.removeLayer(t);
-    }), this._markers = [], this._map.panTo(this.getCoordinates())) : this._map = window.L.map(i).setView(this.getCoordinates(), 13), this.addMarkers());
+    var t;
+    const s = this.shadowRoot.getElementById("map");
+    s && (this._map ? (this._markers.forEach((e) => {
+      this._map.removeLayer(e);
+    }), this._markers = [], this._map.panTo(this.getCoordinates())) : this._map = (t = window.L) == null ? void 0 : t.map(s).setView(this.getCoordinates(), 13), this.addMarkers());
   }
   getCoordinates() {
     return this._posList.length < 1 ? [48.866667, 2.333333] : [this._posList[0].attributes.latitude, this._posList[0].attributes.longitude];
   }
   addMarkers() {
-    this._posList.length > 0 && this._posList.forEach((i, t) => {
+    this._posList.length > 0 && this._posList.forEach((s, t) => {
       this._markers.push(window.L.marker(
-        [i.attributes.latitude, i.attributes.longitude],
-        { icon: this.buildIcon(i.supplier) }
+        [s.attributes.latitude, s.attributes.longitude],
+        { icon: this.buildIcon(s.supplier) }
       ).addTo(this._map));
       let e = window.L.popup({
         content: `
             <div class="pos-item">
               <div class="top">
-                <img class="pos-img" src="${i.supplier.attributes.logo}" alt="${i.supplier.attributes.name}"/>
+                <img class="pos-img" src="${s.supplier.attributes.logo}" alt="${s.supplier.attributes.name}"/>
                 <div class="top-right">
-                  <div class="name">${this._nameOfStore(i)}</div>
-                  <div class="address">${i.attributes.address}</div>
+                  <div class="name">${this._nameOfStore(s)}</div>
+                  <div class="address">${s.attributes.address}</div>
                 </div>
               </div>
               <div class="bottom">
@@ -853,16 +925,16 @@ let u = class extends T {
             </div>
           `
       });
-      this._markers[t].bindPopup(e).on("popupopen", (s) => {
-        s.target.getPopup().getElement().querySelector("#select").addEventListener("click", () => {
-          this.dispatchPos(i);
+      this._markers[t].bindPopup(e).on("popupopen", (i) => {
+        i.target.getPopup().getElement().querySelector("#select").addEventListener("click", () => {
+          this.dispatchPos(s);
         });
       });
     });
   }
-  buildIcon(i) {
+  buildIcon(s) {
     return window.L.icon({
-      iconUrl: i.attributes.logo || "https://cdn-icons-png.flaticon.com/512/3515/3515146.png",
+      iconUrl: s.attributes.logo || "https://cdn-icons-png.flaticon.com/512/3515/3515146.png",
       shadowUrl: "https://storage.googleapis.com/assets.miam.tech/mealz-components/store-locator/marker.svg",
       iconSize: [32, 32],
       // size of the icon
@@ -876,17 +948,22 @@ let u = class extends T {
       // point from which the popup should open relative to the iconAnchor
     });
   }
-  togglePosList(i) {
-    const t = this.shadowRoot.getElementById("pos-list"), e = this.shadowRoot.getElementById("hide-pos-wrapper");
-    !t || !e || (i ? (t.style.display = "flex", e.style.display = "flex") : (t.style.display = "none", e.style.display = "none"));
+  togglePosList(s) {
+    const t = this.shadowRoot.getElementById("pos-list"), e = this.shadowRoot.getElementById("mobile-buttons-wrapper");
+    !t || !e || (s ? (t.style.display = "none", e.className = "mobile-buttons-wrapper__see-list") : (t.style.display = "flex", e.className = "mobile-buttons-wrapper__see-map"), this._showPosList = !this._showPosList, this.requestUpdate());
   }
   geolocationTimeout() {
     setTimeout(() => {
-      this._geolocationCoordinates === void 0 && (this._geolocationCoordinates = {});
+      this.geolocationCoordinates === void 0 && (this.geolocationCoordinates = {});
     }, 2e4);
   }
+  listenFormSubmit() {
+    this.shadowRoot.getElementById("store-locator-form").addEventListener("submit", (t) => {
+      t.preventDefault(), this.setAddress();
+    });
+  }
 };
-u.styles = [
+m.styles = [
   ct`
       :host {
         display: block;
@@ -903,12 +980,18 @@ u.styles = [
         width: 320px;
         padding: 40px var(--spacing-padding-16-px, 16px);
         flex-direction: column;
-        align-items: flex-start;
+        align-items: stretch;
         gap: var(--spacing-padding-16-px, 16px);
         flex-shrink: 0;
         background: var(--miam-ds-color-neutral-50, #FFF);
         box-shadow: 2px 0px 16px 0px rgba(0, 0, 0, 0.15);
         z-index: 1;
+        
+        form {
+          display: flex;
+          flex-direction: column;
+          gap: var(--spacing-padding-8-px, 8px);
+        }
       }
 
       .pos-selection .title {
@@ -927,36 +1010,40 @@ u.styles = [
         gap: 8px;
         height: 40px;
         position: relative;
-        width: 100%;
+      }
+      
+      .pos-selection .address-input-container {
+        .address-input {
+          padding-left: 8px;
+        }
         
-        button + .address-input {
+        .locate-button + .address-input {
           padding-left: 40px;
         }
         
         .address-input {
           flex: 1;
         }
-        
-        .locate-button {
-          position: absolute;
-          background: unset;
-          border: unset;
-          padding: 0;
-          top: 8px;
-          left: 8px;
-          width: 24px;
-          height: 24px;
-          
-           img {
-             cursor: pointer;
-             width: 24px;
-             height: 24px;
-           }
-        }
+      }
+      
+      .pos-selection .address-input-container .locate-button {
+        position: absolute;
+        background: unset;
+        border: unset;
+        padding: 0;
+        top: 8px;
+        left: 8px;
+        width: 24px;
+        height: 24px;
+      }
+      
+      .pos-selection .address-input-container .locate-button img {
+        cursor: pointer;
+        width: 24px;
+        height: 24px;
       }
 
       .pos-selection #pos-list {
-        display: flex;
         flex-direction: column;
         align-items: flex-start;
         gap: var(--spacing-padding-12-px, 12px);
@@ -964,6 +1051,58 @@ u.styles = [
         overflow: auto;
       }
 
+      .pos-list__visible,
+      .pos-list__hidden {
+        display: flex;
+      }
+
+      .pos-selection .pos-loader {
+        flex: 1;
+        width: 100%;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+
+      .pos-selection .pos-loader .miam-ds-loader {
+        margin: 16px;
+        display: flex;
+        width: 72px;
+        height: 72px;
+        background-position-x: 36px;
+        background-size: 36px 36px;
+      }
+      
+      .pos-selection .no-pos-found {
+        margin-bottom: 16px;
+        width: 100%;
+        flex: 1;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        flex-direction: column;
+      }
+      
+      .pos-selection .select-radius {
+        display: flex;
+      }
+      
+      .pos-selection .select-radius select {
+        flex: 1;
+        padding: 10px;
+        max-width: initial;
+      }
+      
+      .pos-selection .select-supplier {
+        display: flex;
+        
+        select {
+          flex: 1;
+          padding: 10px;
+          max-width: initial;
+        }
+      }
+
       .pos-item {
         display: flex;
         flex-direction: column;
@@ -1008,7 +1147,7 @@ u.styles = [
         width: 100%;
       }
 
-      #hide-pos-wrapper {
+      #mobile-buttons-wrapper {
         display: none;
       }
 
@@ -1016,6 +1155,8 @@ u.styles = [
         width: 100%;
         min-height: 100%;
         z-index: 0;
+        position: absolute;
+        top: 0;
       }
 
       #map .pos-item {
@@ -1037,13 +1178,16 @@ u.styles = [
           width: 100%;
           padding: 0;
           gap: 0;
+
+          form {
+            padding: 24px 16px;
+          }
         }
 
         .pos-selection .title {
           position: relative;
-          height: 56px;
+          min-height: 56px;
           font-size: 16px;
-          width: 100%;
           display: flex;
           align-items: center;
           justify-content: center;
@@ -1059,11 +1203,6 @@ u.styles = [
           height: 32px;
         }
 
-        .pos-selection .address-input-container {
-          width: calc(100% - 32px);
-          margin: 24px 16px;
-        }
-
         .pos-selection .address-input-container input {
           width: calc(100% - 44px);
         }
@@ -1071,20 +1210,70 @@ u.styles = [
         .pos-selection .address-input-container button {
           width: 36px;
         }
+
+        .pos-selection .suppliers-selection-container {
+          width: calc(100% - 32px);
+          margin: 8px 16px 24px 16px;
+        }
       
         .pos-selection #pos-list {
           padding: 0 16px 12px;
-          max-height: 235px;
           align-items: center;
         }
+
+        .pos-list__visible {
+          display: flex;
+        }
+
+        .pos-list__hidden {
+          display: none;
+        }
+
+        .pos-selection__height {
+          height: 100%;
+        }
+
+        .pos-selection .pos-loader {
+          position: absolute;
+          height: 100%;
+        }
+
+        .suppliers-list-wrapper__not-mobile {
+          display: none;
+        }
+
+        .suppliers-list-wrapper__mobile {
+          display: block;
+
+          .suppliers-list {
+            position: relative;
+            z-index: 1;
+            width: calc(100% - 32px);
+            margin: -16px 16px 8px 16px;
+
+            .suppliers-list__supplier {
+              padding: 8px 16px;
+            }
+          }
+        }
         
-        #hide-pos-wrapper {
+        #mobile-buttons-wrapper {
           width: 100%;
           display: flex;
           justify-content: center;
           padding: 12px 0;
         }
 
+        .mobile-buttons-wrapper__see-list {
+          z-index: 1;
+          bottom: 40px;
+          position: absolute;
+        }
+
+        .mobile-buttons-wrapper__see-map {
+          margin-top: auto;
+        }
+
         #map {
           min-height: unset;
           position: absolute;
@@ -1094,28 +1283,37 @@ u.styles = [
       }
     `
 ];
-A([
-  M({ type: Boolean })
-], u.prototype, "show", 2);
-A([
-  M({ type: Ht })
-], u.prototype, "geolocationCoordinates", 1);
-A([
-  M()
-], u.prototype, "getByAddress", 2);
-A([
-  M()
-], u.prototype, "getByCoordinates", 2);
-A([
-  Mt()
-], u.prototype, "_geolocationCoordinates", 2);
-A([
-  Rt("input")
-], u.prototype, "_addressInput", 2);
-u = A([
-  kt("mealz-store-locator")
-], u);
-window.customElements.get("mealz-store-locator") || window.customElements.define("mealz-store-locator", u);
+g([
+  y({ type: Boolean })
+], m.prototype, "show", 2);
+g([
+  y({ type: Number })
+], m.prototype, "selectedRadius", 2);
+g([
+  y({ type: Array })
+], m.prototype, "radiusOption", 2);
+g([
+  y({ type: GeolocationPosition })
+], m.prototype, "geolocationCoordinates", 1);
+g([
+  y()
+], m.prototype, "getByAddress", 2);
+g([
+  y()
+], m.prototype, "getByCoordinates", 2);
+g([
+  y()
+], m.prototype, "getAffiliateSuppliers", 2);
+g([
+  kt()
+], m.prototype, "_geolocationCoordinates", 2);
+g([
+  Ot("input")
+], m.prototype, "_addressInput", 2);
+m = g([
+  Ut("mealz-store-locator")
+], m);
+window.customElements.get("mealz-store-locator") || window.customElements.define("mealz-store-locator", m);
 export {
-  u as MealzStoreLocator
+  m as MealzStoreLocator
 };