@tma.js/sdk 0.13.3 → 1.0.1

package/dist/index.mjs

@@ -1,851 +1,1739 @@
-var st = Object.defineProperty;
-var rt = (s, t, e) => t in s ? st(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
-var i = (s, t, e) => (rt(s, typeof t != "symbol" ? t + "" : t, e), e);
-import { retrieveLaunchData as N, parse as ot } from "@tma.js/launch-params";
-import { EventEmitter as f } from "@tma.js/event-emitter";
-import { supports as S, postEvent as g, on as E, off as z, request as _, setDebug as nt, setTargetOrigin as it, createPostEvent as at, isIframe as ct } from "@tma.js/bridge";
-import { array as ht, string as W, json as ut } from "@tma.js/parsing";
-import { parse as D } from "@tma.js/theme-params";
-import { isColorDark as U, isRGB as pt } from "@tma.js/colors";
-import { compareVersions as lt, withTimeout as dt } from "@tma.js/utils";
-function m(s, t) {
-  return (e) => S(t[e], s);
-}
-function gt(s, t) {
-  return (e) => {
-    const [r, o] = t[e];
-    return S(r, o, s);
-  };
+var $t = Object.defineProperty;
+var Vt = (r, t, e) => t in r ? $t(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var o = (r, t, e) => (Vt(r, typeof t != "symbol" ? t + "" : t, e), e);
+function D(r) {
+  return typeof r == "object" && r !== null && !Array.isArray(r);
 }
-class b {
-  constructor(t, e) {
-    this.state = t, this.ee = e;
-  }
-  emit(t, e) {
-    this.ee && this.ee.emit(t, e);
-  }
-  internalSet(t, e) {
-    return this.state[t] === e ? !1 : (this.state[t] = e, this.emit(`${String(t)}Changed`, e), !0);
-  }
-  set(t, e) {
-    let r = !1;
-    if (typeof t == "string")
-      r = this.internalSet(t, e);
-    else
-      for (const o in t)
-        this.internalSet(o, t[o]) && (r = !0);
-    r && this.emit("changed");
-  }
-  get(t) {
-    return this.state[t];
-  }
-  getState() {
-    return { ...this.state };
-  }
+function ct() {
+  return performance.getEntriesByType("navigation")[0] || null;
 }
-class _t {
-  constructor(t, e, r = g) {
-    i(this, "ee", new f());
-    i(this, "state");
-    /**
-     * Adds event listener.
-     * @param event - event name.
-     * @param listener - event listener.
-     */
-    i(this, "on", (t, e) => t === "click" ? E("back_button_pressed", e) : this.ee.on(t, e));
-    /**
-     * Removes event listener.
-     * @param event - event name.
-     * @param listener - event listener.
-     */
-    i(this, "off", (t, e) => {
-      if (t === "click")
-        return z("back_button_pressed", e);
-      this.ee.off(t, e);
-    });
+function Tt() {
+  const r = ct();
+  return r ? r.type === "reload" : null;
+}
+function L() {
+  return new TypeError("Value has unexpected type");
+}
+class G extends Error {
+  constructor(e, { cause: n, type: s } = {}) {
+    super(`Unable to parse value${s ? ` as ${s}` : ""}`, { cause: n });
     /**
-     * Checks if specified method is supported by current component.
+     * Parser name.
      */
-    i(this, "supports");
-    this.postEvent = r, this.state = new b({ isVisible: t }, this.ee), this.supports = m(e, {
-      show: "web_app_setup_back_button",
-      hide: "web_app_setup_back_button"
-    });
+    o(this, "type");
+    this.value = e, Object.setPrototypeOf(this, G.prototype), this.type = s;
   }
-  set isVisible(t) {
-    this.state.set("isVisible", t), this.postEvent("web_app_setup_back_button", { is_visible: t });
+}
+class F {
+  constructor(t, e, n) {
+    this.parser = t, this.isOptional = e, this.type = n;
+  }
+  parse(t) {
+    if (!(this.isOptional && t === void 0))
+      try {
+        return this.parser(t);
+      } catch (e) {
+        throw new G(t, { type: this.type, cause: e });
+      }
   }
-  /**
-   * True if BackButton is currently visible.
-   */
-  get isVisible() {
-    return this.state.get("isVisible");
+  optional() {
+    return this.isOptional = !0, this;
   }
-  /**
-   * Hides the BackButton.
-   */
-  hide() {
-    this.isVisible = !1;
+}
+function It(r) {
+  if (Array.isArray(r))
+    return r;
+  if (typeof r == "string")
+    try {
+      const t = JSON.parse(r);
+      if (Array.isArray(t))
+        return t;
+    } catch {
+    }
+  throw L();
+}
+class Rt extends F {
+  constructor(e, n, s) {
+    super(It, n, s);
+    o(this, "itemParser");
+    this.itemParser = typeof e == "function" ? e : e.parse.bind(e);
   }
-  /**
-   * Shows the BackButton.
-   */
-  show() {
-    this.isVisible = !0;
+  parse(e) {
+    const n = super.parse(e);
+    return n === void 0 ? n : n.map(this.itemParser);
+  }
+  of(e) {
+    return this.itemParser = typeof e == "function" ? e : e.parse.bind(e), this;
   }
 }
-class bt {
-  constructor(t, e = g) {
-    i(this, "ee", new f());
-    i(this, "state");
-    /**
-     * Adds new event listener.
-     */
-    i(this, "on", this.ee.on.bind(this.ee));
-    /**
-     * Removes event listener.
-     */
-    i(this, "off", this.ee.off.bind(this.ee));
-    this.postEvent = e, this.state = new b({ isConfirmationNeeded: t }, this.ee);
+function $(r, t) {
+  return () => new F(r, !1, t);
+}
+class U extends Error {
+  constructor(t, { cause: e, type: n } = {}) {
+    super(`Unable to parse field "${t}"${n ? ` as ${n}` : ""}`, { cause: e }), Object.setPrototypeOf(this, U.prototype);
   }
-  set isConfirmationNeeded(t) {
-    this.state.set("isConfirmationNeeded", t), this.postEvent("web_app_setup_closing_behavior", { need_confirmation: t });
+}
+function ht(r, t) {
+  const e = {};
+  for (const n in r) {
+    const s = r[n];
+    if (!s)
+      continue;
+    let i, a;
+    if (typeof s == "function" || "parse" in s)
+      i = n, a = typeof s == "function" ? s : s.parse.bind(s);
+    else {
+      const { type: l } = s;
+      i = s.from || n, a = typeof l == "function" ? l : l.parse.bind(l);
+    }
+    let c;
+    const u = t(i);
+    try {
+      c = a(u);
+    } catch (l) {
+      throw l instanceof G ? new U(i, {
+        type: l.type,
+        cause: l
+      }) : new U(i, { cause: l });
+    }
+    c !== void 0 && (e[n] = c);
+  }
+  return e;
+}
+function Bt(r) {
+  return new Rt((t) => t, !1, r);
+}
+const C = $((r) => {
+  if (typeof r == "boolean")
+    return r;
+  const t = String(r);
+  if (t === "1" || t === "true")
+    return !0;
+  if (t === "0" || t === "false")
+    return !1;
+  throw L();
+}, "boolean"), A = $((r) => {
+  if (typeof r == "number")
+    return r;
+  if (typeof r == "string") {
+    const t = Number(r);
+    if (!Number.isNaN(t))
+      return t;
+  }
+  throw L();
+}, "number"), Dt = A(), Ht = $((r) => r instanceof Date ? r : new Date(Dt.parse(r) * 1e3), "Date");
+function Z(r) {
+  let t = r;
+  if (typeof t == "string" && (t = JSON.parse(t)), typeof t != "object" || t === null || Array.isArray(t))
+    throw L();
+  return t;
+}
+function g(r, t) {
+  return new F((e) => {
+    const n = Z(e);
+    return ht(r, (s) => n[s]);
+  }, !1, t);
+}
+function ut(r) {
+  return /^#[\da-f]{6}$/i.test(r);
+}
+function Nt(r) {
+  return /^#[\da-f]{3}$/i.test(r);
+}
+function pt(r) {
+  const t = r.replace(/\s/g, "").toLowerCase();
+  if (ut(t))
+    return t;
+  if (Nt(t)) {
+    let n = "#";
+    for (let s = 0; s < 3; s += 1)
+      n += t[1 + s].repeat(2);
+    return n;
+  }
+  const e = t.match(/^rgb\((\d{1,3}),(\d{1,3}),(\d{1,3})\)$/) || t.match(/^rgba\((\d{1,3}),(\d{1,3}),(\d{1,3}),\d{1,3}\)$/);
+  if (e === null)
+    throw new Error(`Value "${r}" does not satisfy any of known RGB formats.`);
+  return e.slice(1).reduce((n, s) => {
+    const i = parseInt(s, 10).toString(16);
+    return n + (i.length === 1 ? "0" : "") + i;
+  }, "#");
+}
+function lt(r) {
+  const t = pt(r);
+  return Math.sqrt(
+    [0.299, 0.587, 0.114].reduce((n, s, i) => {
+      const a = parseInt(t.slice(1 + i * 2, 1 + (i + 1) * 2), 16);
+      return n + a * a * s;
+    }, 0)
+  ) < 120;
+}
+const h = $((r) => {
+  if (typeof r == "string" || typeof r == "number")
+    return r.toString();
+  throw L();
+}, "string"), Ot = h(), dt = $((r) => pt(Ot.parse(r)), "rgb");
+function ft(r, t) {
+  return new F((e) => {
+    if (typeof e != "string" && !(e instanceof URLSearchParams))
+      throw L();
+    const n = typeof e == "string" ? new URLSearchParams(e) : e;
+    return ht(r, (s) => {
+      const i = n.get(s);
+      return i === null ? void 0 : i;
+    });
+  }, !1, t);
+}
+function Wt() {
+  return g({
+    id: A(),
+    type: h(),
+    title: h(),
+    photoUrl: {
+      type: h().optional(),
+      from: "photo_url"
+    },
+    username: h().optional()
+  }, "Chat");
+}
+class Mt {
+  constructor(t) {
+    this.initData = t;
   }
   /**
-   * Returns true, if the confirmation dialog enabled while the user is trying
-   * to close the Mini App.
+   * @see InitDataParsed.authDate
    */
-  get isConfirmationNeeded() {
-    return this.state.get("isConfirmationNeeded");
+  get authDate() {
+    return this.initData.authDate;
   }
   /**
-   * Disables the confirmation dialog while the user is trying to close the
-   * Mini App.
+   * @see InitDataParsed.canSendAfter
    */
-  disableConfirmation() {
-    this.isConfirmationNeeded = !1;
+  get canSendAfter() {
+    return this.initData.canSendAfter;
   }
   /**
-   * Enables the confirmation dialog while the user is trying to close the
-   * Mini App.
+   * Date after which it is allowed to call
+   * the [answerWebAppQuery](https://core.telegram.org/bots/api#answerwebappquery) method.
    */
-  enableConfirmation() {
-    this.isConfirmationNeeded = !0;
-  }
-}
-const ft = ht().of(W());
-function L(s, t) {
-  return s.reduce((e, r) => (e[r] = t, e), {});
-}
-class wt {
-  constructor(t, e, r = g) {
-    /**
-     * Checks if specified method is supported by current component.
-     */
-    i(this, "supports");
-    this.createRequestId = e, this.postEvent = r, this.supports = m(t, {
-      deleteKeys: "web_app_invoke_custom_method",
-      getKeys: "web_app_invoke_custom_method",
-      getValues: "web_app_invoke_custom_method",
-      saveValue: "web_app_invoke_custom_method"
-    });
+  get canSendAfterDate() {
+    const { canSendAfter: t } = this;
+    return t === void 0 ? void 0 : new Date(this.authDate.getTime() + t * 1e3);
   }
   /**
-   * Invokes custom method related to CloudStorage.
-   * @param method - method name.
-   * @param params - method parameters.
-   * @param options - execution options.
+   * @see InitDataParsed.chat
    */
-  async invokeCustomMethod(t, e, r = {}) {
-    const { result: o, error: n } = await _(
-      "web_app_invoke_custom_method",
-      { method: t, params: e, req_id: this.createRequestId() },
-      "custom_method_invoked",
-      { ...r, postEvent: this.postEvent }
-    );
-    if (n)
-      throw new Error(typeof n == "string" ? n : `Unknown error: ${JSON.stringify(n)}`);
-    return o;
+  get chat() {
+    return this.initData.chat;
   }
   /**
-   * Deletes specified keys from the CloudStorage.
-   * @param keys - keys list.
-   * @param options - request execution options.
+   * @see InitDataParsed.chatType
    */
-  async deleteKeys(t, e) {
-    t.length !== 0 && await this.invokeCustomMethod("deleteStorageValues", { keys: t }, e);
+  get chatType() {
+    return this.initData.chatType;
   }
   /**
-   * Returns list of all keys presented in CloudStorage.
-   * @param options - request execution options.
+   * @see InitDataParsed.chatInstance
    */
-  async getKeys(t) {
-    const e = await this.invokeCustomMethod("getStorageKeys", {}, t);
-    return ft.parse(e);
+  get chatInstance() {
+    return this.initData.chatInstance;
   }
   /**
-   * Returns map, where key is one of the specified in keys argument, and value is according
-   * storage value.
-   * @param keys - keys list.
-   * @param options - request execution options.
+   * @see InitDataParsed.hash
    */
-  async getValues(t, e) {
-    if (t.length === 0)
-      return L(t, "");
-    const r = ut(
-      L(t, W())
-      // fixme
-    ), o = await this.invokeCustomMethod("getStorageValues", { keys: t }, e);
-    return r.parse(o);
+  get hash() {
+    return this.initData.hash;
   }
   /**
-   * Saves specified value by key.
-   * @param key - storage key.
-   * @param value - storage value.
-   * @param options - request execution options.
+   * @see InitDataParsed.queryId
    */
-  async saveValue(t, e, r) {
-    await this.invokeCustomMethod("saveStorageValue", { key: t, value: e }, r);
-  }
-}
-class mt {
-  constructor(t, e = g) {
-    /**
-     * Checks if specified method is supported by current component.
-     */
-    i(this, "supports");
-    this.postEvent = e, this.supports = m(t, {
-      impactOccurred: "web_app_trigger_haptic_feedback",
-      notificationOccurred: "web_app_trigger_haptic_feedback",
-      selectionChanged: "web_app_trigger_haptic_feedback"
-    });
+  get queryId() {
+    return this.initData.queryId;
   }
   /**
-   * A method tells that an impact occurred. The Telegram app may play the
-   * appropriate haptics based on style value passed.
-   * @param style - impact style.
+   * @see InitDataParsed.receiver
    */
-  impactOccurred(t) {
-    this.postEvent("web_app_trigger_haptic_feedback", { type: "impact", impact_style: t });
+  get receiver() {
+    return this.initData.receiver;
   }
   /**
-   * A method tells that a task or action has succeeded, failed, or produced
-   * a warning. The Telegram app may play the appropriate haptics based on
-   * type value passed.
-   * @param type - notification type.
+   * @see InitDataParsed.startParam
    */
-  notificationOccurred(t) {
-    this.postEvent("web_app_trigger_haptic_feedback", {
-      type: "notification",
-      notification_type: t
-    });
+  get startParam() {
+    return this.initData.startParam;
   }
   /**
-   * A method tells that the user has changed a selection. The Telegram app
-   * may play the appropriate haptics.
-   *
-   * Do not use this feedback when the user makes or confirms a selection;
-   * use it only when the selection changes.
+   * @see InitDataParsed.user
    */
-  selectionChanged() {
-    this.postEvent("web_app_trigger_haptic_feedback", { type: "selection_change" });
+  get user() {
+    return this.initData.user;
   }
 }
-class Ct {
-  constructor(t, e, r = {}) {
-    i(this, "state");
-    const {
-      chat: o = null,
-      canSendAfter: n = null,
-      chatType: a = null,
-      chatInstance: u = null,
-      user: c = null,
-      queryId: p = null,
-      receiver: h = null,
-      startParam: d = null
-    } = r;
-    this.state = new b({
-      authDate: t,
-      canSendAfter: n === null ? null : new Date(t.getTime() + n * 1e3),
-      chat: o,
-      chatType: a,
-      chatInstance: u,
-      user: c,
-      queryId: p,
-      receiver: h,
-      startParam: d,
-      hash: e
+function tt() {
+  return g({
+    addedToAttachmentMenu: {
+      type: C().optional(),
+      from: "added_to_attachment_menu"
+    },
+    allowsWriteToPm: {
+      type: C().optional(),
+      from: "allows_write_to_pm"
+    },
+    firstName: {
+      type: h(),
+      from: "first_name"
+    },
+    id: A(),
+    isBot: {
+      type: C().optional(),
+      from: "is_bot"
+    },
+    isPremium: {
+      type: C().optional(),
+      from: "is_premium"
+    },
+    languageCode: {
+      type: h().optional(),
+      from: "language_code"
+    },
+    lastName: {
+      type: h().optional(),
+      from: "last_name"
+    },
+    photoUrl: {
+      type: h().optional(),
+      from: "photo_url"
+    },
+    username: h().optional()
+  }, "User");
+}
+function gt() {
+  return ft({
+    authDate: {
+      type: Ht(),
+      from: "auth_date"
+    },
+    canSendAfter: {
+      type: A().optional(),
+      from: "can_send_after"
+    },
+    chat: Wt().optional(),
+    chatInstance: {
+      type: h().optional(),
+      from: "chat_instance"
+    },
+    chatType: {
+      type: h().optional(),
+      from: "chat_type"
+    },
+    hash: h(),
+    queryId: {
+      type: h().optional(),
+      from: "query_id"
+    },
+    receiver: tt().optional(),
+    startParam: {
+      type: h().optional(),
+      from: "start_param"
+    },
+    user: tt().optional()
+  }, "InitData");
+}
+function Xe(r) {
+  return gt().parse(r);
+}
+function Ut(r) {
+  return r.replace(/(^|_)bg/, (t, e) => `${e}background`).replace(/_([a-z])/g, (t, e) => e.toUpperCase());
+}
+function jt(r) {
+  return r.replace(/[A-Z]/g, (t) => `_${t.toLowerCase()}`).replace(/(^|_)background/, (t, e) => `${e}bg`);
+}
+const Gt = dt().optional(), wt = $(
+  (r) => Object.entries(Z(r)).reduce((t, [e, n]) => (t[Ut(e)] = Gt.parse(n), t), {}),
+  "ThemeParams"
+);
+function _t(r) {
+  return wt().parse(r);
+}
+function tr(r = {}) {
+  return _("web_app_request_theme", "theme_changed", r).then(_t);
+}
+function Ft(r) {
+  return JSON.stringify(
+    Object.entries(r).reduce((t, [e, n]) => (n && (t[jt(e)] = n), t), {})
+  );
+}
+class w {
+  constructor() {
+    o(this, "listeners", /* @__PURE__ */ new Map());
+    o(this, "subscribeListeners", []);
+  }
+  /**
+   * Adds specified event listener.
+   * @param event - event name.
+   * @param listener - event listener.
+   * @param once - should listener called only once.
+   */
+  addListener(t, e, n) {
+    let s = this.listeners.get(t);
+    return s || (s = [], this.listeners.set(t, s)), s.push([e, n]), () => this.off(t, e);
+  }
+  emit(t, ...e) {
+    this.subscribeListeners.forEach((s) => s(t, ...e));
+    const n = this.listeners.get(t);
+    n && n.forEach(([s, i], a) => {
+      s(...e), i && n.splice(a, 1);
     });
   }
   /**
-   * Init data generation date.
+   * Adds event listener.
+   * @param event - event name.
+   * @param listener - event listener.
+   * @returns Function to remove event listener.
    */
-  get authDate() {
-    return this.state.get("authDate");
+  on(t, e) {
+    return this.addListener(t, e, !1);
   }
   /**
-   * Date after which a message can be sent via the
-   * [answerWebAppQuery](https://core.telegram.org/bots/api#answerwebappquery) method.
+   * Adds event listener following the logic, described in `on` method, but calls specified
+   * listener only once, removing it after.
+   * @param event - event name.
+   * @param listener - event listener.
+   * @returns Function to remove event listener.
+   * @see on
    */
-  get canSendAfter() {
-    return this.state.get("canSendAfter");
+  once(t, e) {
+    return this.addListener(t, e, !0);
   }
   /**
-   * An object containing data about the chat where the bot was launched via the attachment
-   * menu. Returned for supergroups, channels and group chats – only for Mini Apps launched via
-   * the attachment menu.
+   * Removes event listener. In case, specified listener was bound several times, it removes
+   * only a single one.
+   * @param event - event name.
+   * @param listener - event listener.
    */
-  get chat() {
-    return this.state.get("chat");
+  off(t, e) {
+    const n = this.listeners.get(t);
+    if (n) {
+      for (let s = 0; s < n.length; s += 1)
+        if (e === n[s][0]) {
+          n.splice(s, 1);
+          return;
+        }
+    }
   }
   /**
-   * The type of chat from which Mini App was opened.
+   * Adds event listener to all events.
+   * @param listener - events listener.
+   * @returns Function to remove event listener.
+   * @see on
+   * @see once
    */
-  get chatType() {
-    return this.state.get("chatType");
+  subscribe(t) {
+    return this.subscribeListeners.push(t), () => this.unsubscribe(t);
   }
   /**
-   * A global identifier indicating the chat from which Mini App was opened. Returned only for
-   * applications opened by direct link.
+   * Removes global event listener. In case, specified listener was bound several times, it removes
+   * only a single one.
+   * @param listener - events listener.
+   * @returns Function to remove event listener.
    */
-  get chatInstance() {
-    return this.state.get("chatInstance");
+  unsubscribe(t) {
+    for (let e = 0; e < this.subscribeListeners.length; e += 1)
+      if (this.subscribeListeners[e] === t) {
+        this.subscribeListeners.splice(e, 1);
+        return;
+      }
   }
-  /**
-   * A hash of all passed parameters, which the bot server can use to
-   * check their validity.
-   * @see https://core.telegram.org/bots/webapps#validating-data-received-via-the-web-app
-   */
-  get hash() {
-    return this.state.get("hash");
+}
+class b {
+  constructor(t, e) {
+    this.state = t, this.ee = e;
   }
-  /**
-   * A unique identifier for the Mini App session, required for sending
-   * messages via the `answerWebAppQuery` method.
-   * @see https://core.telegram.org/bots/api#answerwebappquery
-   */
-  get queryId() {
-    return this.state.get("queryId");
+  internalSet(t, e) {
+    return this.state[t] === e || e === void 0 ? !1 : (this.state[t] = e, this.ee.emit(`change:${t}`, e), !0);
   }
   /**
-   * An object containing data about the chat partner of the current
-   * user in the chat where the bot was launched via the attachment menu.
-   * Returned only for private chats and only for Mini Apps launched
-   * via the attachment menu.
+   * Returns copy of current state.
    */
-  get receiver() {
-    return this.state.get("receiver");
+  clone() {
+    return { ...this.state };
   }
-  /**
-   * The value of the `startattach` parameter, passed via link. Only
-   * returned for Mini Apps when launched from the attachment menu via link.
-   */
-  get startParam() {
-    return this.state.get("startParam");
+  set(t, e) {
+    let n = !1;
+    if (typeof t == "string")
+      n = this.internalSet(t, e);
+    else
+      for (const s in t)
+        this.internalSet(s, t[s]) && (n = !0);
+    n && this.ee.emit("change");
   }
   /**
-   * An object containing data about the current user.
+   * Returns value by specified key.
+   * @param key - state key.
    */
-  get user() {
-    return this.state.get("user");
+  get(t) {
+    return this.state[t];
   }
 }
-class vt {
-  constructor(t, e, r, o, n, a, u = g) {
-    i(this, "ee", new f());
-    i(this, "state");
+class zt {
+  constructor(t) {
+    o(this, "ee", new w());
+    o(this, "state");
     /**
      * Adds new event listener.
-     * FIXME: Event 'main_button_pressed' is still being received on Android
-     *  even if the main button is disabled.
-     *  Issue: https://github.com/Telegram-Mini-Apps/tma.js/issues/3
-     * @param event - event name.
-     * @param listener - event listener.
      */
-    i(this, "on", (t, e) => t === "click" ? E("main_button_pressed", e) : this.ee.on(t, e));
+    o(this, "on", this.ee.on.bind(this.ee));
     /**
      * Removes event listener.
-     * @param event - event name.
-     * @param listener - event listener.
      */
-    i(this, "off", (t, e) => {
-      if (t === "click")
-        return z("main_button_pressed", e);
-      this.ee.off(t, e);
-    });
-    this.postEvent = u, this.state = new b({
-      backgroundColor: t,
-      isEnabled: e,
-      isVisible: r,
-      isProgressVisible: o,
-      text: n,
-      textColor: a
-    }, this.ee);
-  }
-  set isEnabled(t) {
-    this.state.set("isEnabled", t), this.commit();
+    o(this, "off", this.ee.off.bind(this.ee));
+    this.state = new b(t, this.ee);
   }
   /**
-   * Returns true in case, MainButton is currently enabled.
+   * @since v6.10
    */
-  get isEnabled() {
-    return this.state.get("isEnabled");
+  get accentTextColor() {
+    return this.get("accentTextColor");
   }
-  set isProgressVisible(t) {
-    this.state.set("isProgressVisible", t), this.commit();
+  get backgroundColor() {
+    return this.get("backgroundColor");
   }
-  /**
-   * Returns true in case, MainButton loading progress is currently visible.
-   */
-  get isProgressVisible() {
-    return this.state.get("isProgressVisible");
+  get buttonColor() {
+    return this.get("buttonColor");
   }
-  set isVisible(t) {
-    this.state.set("isVisible", t), this.commit();
+  get buttonTextColor() {
+    return this.get("buttonTextColor");
   }
-  /**
-   * Returns true in case, MainButton is currently visible.
-   */
-  get isVisible() {
-    return this.state.get("isVisible");
+  get destructiveTextColor() {
+    return this.get("destructiveTextColor");
   }
   /**
-   * Sends current local button state to Telegram application.
+   * Retrieves palette color value by its name.
+   * @param key - palette key name.
    */
-  commit() {
-    this.text !== "" && this.postEvent("web_app_setup_main_button", {
-      is_visible: this.isVisible,
-      is_active: this.isEnabled,
-      is_progress_visible: this.isProgressVisible,
-      text: this.text,
-      color: this.backgroundColor,
-      text_color: this.textColor
-    });
+  get(t) {
+    return this.state.get(t);
   }
   /**
-   * Returns current main button background color.
+   * Returns the copy of the internal state of the current component instance.
    */
-  get backgroundColor() {
-    return this.state.get("backgroundColor");
+  getState() {
+    return this.state.clone();
   }
   /**
-   * Returns current main button text.
+   * @since v6.10
    */
-  get text() {
-    return this.state.get("text");
+  get headerBackgroundColor() {
+    return this.get("headerBackgroundColor");
+  }
+  get hintColor() {
+    return this.get("hintColor");
   }
   /**
-   * Returns current main button text color.
-   */
-  get textColor() {
-    return this.state.get("textColor");
+   * Returns true in case, current color scheme is recognized as dark. This
+   * value is calculated according to theme background color.
+   */
+  get isDark() {
+    return !this.backgroundColor || lt(this.backgroundColor);
+  }
+  get linkColor() {
+    return this.get("linkColor");
+  }
+  get secondaryBackgroundColor() {
+    return this.get("secondaryBackgroundColor");
   }
   /**
-   * Disables button. Returns current button instance for chaining.
+   * @since v6.10
    */
-  disable() {
-    return this.isEnabled = !1, this;
+  get sectionBackgroundColor() {
+    return this.get("sectionBackgroundColor");
   }
   /**
-   * Enables button. Returns current button instance for chaining.
+   * @since v6.10
    */
-  enable() {
-    return this.isEnabled = !0, this;
+  get sectionHeaderTextColor() {
+    return this.get("sectionHeaderTextColor");
   }
   /**
-   * Hides button. Returns current button instance for chaining.
+   * Starts listening to theme changes and applies them.
+   * @returns Function to stop listening.
    */
-  hide() {
-    return this.isVisible = !1, this;
+  listen() {
+    return k("theme_changed", (t) => {
+      this.state.set(_t(t.theme_params));
+    });
   }
   /**
-   * Hides button progress. Returns current button instance for chaining.
+   * @since v6.10
    */
-  hideProgress() {
-    return this.isProgressVisible = !1, this;
+  get subtitleTextColor() {
+    return this.get("subtitleTextColor");
+  }
+  get textColor() {
+    return this.get("textColor");
+  }
+}
+function bt() {
+  return ft({
+    botInline: {
+      type: C().optional(),
+      from: "tgWebAppBotInline"
+    },
+    initData: {
+      type: gt().optional(),
+      from: "tgWebAppData"
+    },
+    initDataRaw: {
+      type: h().optional(),
+      from: "tgWebAppData"
+    },
+    platform: {
+      type: h(),
+      from: "tgWebAppPlatform"
+    },
+    showSettings: {
+      type: C().optional(),
+      from: "tgWebAppShowSettings"
+    },
+    themeParams: {
+      type: wt(),
+      from: "tgWebAppThemeParams"
+    },
+    version: {
+      type: h(),
+      from: "tgWebAppVersion"
+    }
+  }, "LaunchParams");
+}
+function mt(r) {
+  return bt().parse(r);
+}
+function Jt() {
+  return mt(window.location.hash.slice(1));
+}
+function Qt() {
+  const r = ct();
+  if (!r)
+    throw new Error("Unable to get first navigation entry.");
+  const t = r.name.match(/#(.*)/);
+  if (!t)
+    throw new Error("First navigation entry does not contain hash part.");
+  return mt(t[1]);
+}
+function Zt() {
+  try {
+    return Qt();
+  } catch {
+  }
+  try {
+    return Jt();
+  } catch {
+  }
+  return null;
+}
+function Kt(r) {
+  const {
+    initDataRaw: t,
+    themeParams: e,
+    platform: n,
+    version: s,
+    showSettings: i,
+    botInline: a
+  } = r, c = new URLSearchParams();
+  return t && c.set("tgWebAppData", t), c.set("tgWebAppPlatform", n), c.set("tgWebAppThemeParams", Ft(e)), c.set("tgWebAppVersion", s), typeof i == "boolean" && c.set("tgWebAppShowSettings", i ? "1" : "0"), typeof a == "boolean" && c.set("tgWebAppBotInline", a ? "1" : "0"), c.toString();
+}
+const yt = "telegram-mini-apps-launch-params";
+function Yt() {
+  const r = sessionStorage.getItem(yt);
+  return r ? bt().parse(r) : null;
+}
+function Xt(r) {
+  sessionStorage.setItem(yt, Kt(r));
+}
+function te() {
+  try {
+    return window.self !== window.top;
+  } catch {
+    return !0;
+  }
+}
+function ee() {
+  const r = Yt(), t = Zt(), e = Tt();
+  if (r) {
+    if (t)
+      return {
+        launchParams: t,
+        isPageReload: te() ? e || r.initDataRaw === t.initDataRaw : !0
+      };
+    if (e)
+      return {
+        launchParams: r,
+        isPageReload: e
+      };
+    throw new Error("Unable to retrieve current launch parameters, which must exist.");
+  }
+  if (t)
+    return {
+      launchParams: t,
+      isPageReload: !1
+    };
+  throw new Error("Unable to retrieve any launch parameters.");
+}
+const et = "tmajsLaunchData";
+function Et() {
+  const r = window[et];
+  if (r)
+    return r;
+  const t = ee();
+  return window[et] = t, Xt(t.launchParams), t;
+}
+function er() {
+  try {
+    return Et(), !0;
+  } catch {
+    return !1;
+  }
+}
+function re(r) {
+  return "external" in r && D(r.external) && "notify" in r.external && typeof r.external.notify == "function";
+}
+function ne(r) {
+  return "TelegramWebviewProxy" in r && D(r.TelegramWebviewProxy) && "postEvent" in r.TelegramWebviewProxy && typeof r.TelegramWebviewProxy.postEvent == "function";
+}
+function Ct() {
+  try {
+    return window.self !== window.top;
+  } catch {
+    return !0;
+  }
+}
+class K extends Error {
+  constructor(t, e) {
+    super(`Method "${t}" is unsupported in the Mini Apps version ${e}.`), Object.setPrototypeOf(this, K.prototype);
+  }
+}
+class Y extends Error {
+  constructor(t, e, n) {
+    super(`Parameter "${e}" in method "${t}" is unsupported in the Mini Apps version ${n}.`), Object.setPrototypeOf(this, Y.prototype);
+  }
+}
+class vt {
+  constructor(t, e) {
+    this.prefix = t, this.enabled = e;
   }
   /**
-   * Shows the button. Note that opening the Mini App from the attachment
-   * menu hides the main button until the user interacts with the Mini App
-   * interface.
-   *
-   * Returns current button instance for chaining.
+   * Prints message into a console in case, logger is currently enabled.
+   * @param level - log level.
+   * @param args - arguments.
    */
-  show() {
-    return this.isVisible = !0, this;
+  print(t, ...e) {
+    if (!this.enabled)
+      return;
+    const n = /* @__PURE__ */ new Date(), s = Intl.DateTimeFormat("en-GB", {
+      hour: "2-digit",
+      minute: "2-digit",
+      second: "2-digit",
+      fractionalSecondDigits: 3,
+      timeZone: "UTC"
+    }).format(n);
+    console[t](`[${s}]`, this.prefix, ...e);
   }
   /**
-   * A method to show a loading indicator on the button.
-   * It is recommended to display loading progress if the action tied to the
-   * button may take a long time.
-   *
-   * Returns current button instance for chaining.
+   * Disables the logger.
    */
-  showProgress() {
-    return this.isProgressVisible = !0, this;
+  disable() {
+    this.enabled = !1;
   }
   /**
-   * Sets new main button text. Returns current button instance for chaining.
-   * Minimal length for text is 1 symbol, and maximum is 64 symbols.
-   *
-   * Returns current button instance for chaining.
-   * @param value - new text.
+   * Prints error message into a console.
+   * @param args
    */
-  setText(t) {
-    return this.state.set("text", t), this.commit(), this;
+  error(...t) {
+    this.print("error", ...t);
   }
   /**
-   * Sets new main button text color. Returns current button instance for
-   * chaining.
-   *
-   * Returns current button instance for chaining.
-   * @param value - new text color.
+   * Enables the logger.
    */
-  setTextColor(t) {
-    return this.state.set("textColor", t), this.commit(), this;
+  enable() {
+    this.enabled = !0;
   }
   /**
-   * Updates current button color. Returns current button instance for
-   * chaining.
-   *
-   * Returns current button instance for chaining.
-   * @param value - color to set.
+   * Prints log message into a console.
+   * @param args
    */
-  setBackgroundColor(t) {
-    return this.state.set("backgroundColor", t), this.commit(), this;
+  log(...t) {
+    this.print("log", ...t);
+  }
+  /**
+   * Prints warning message into a console.
+   * @param args
+   */
+  warn(...t) {
+    this.print("warn", ...t);
   }
 }
-function yt(s) {
-  const t = s.message.trim(), e = (s.title || "").trim(), r = s.buttons || [];
-  let o;
-  if (e.length > 64)
-    throw new Error(`Title has incorrect size: ${e.length}`);
-  if (t.length === 0 || t.length > 256)
-    throw new Error(`Message has incorrect size: ${t.length}`);
-  if (r.length > 3)
-    throw new Error(`Buttons have incorrect size: ${r.length}`);
-  return r.length === 0 ? o = [{ type: "close", id: "" }] : o = r.map((n) => {
-    const { id: a = "" } = n;
-    if (a.length > 64)
-      throw new Error(`Button ID has incorrect size: ${a}`);
-    if (n.type === void 0 || n.type === "default" || n.type === "destructive") {
-      const u = n.text.trim();
-      if (u.length === 0 || u.length > 64) {
-        const c = n.type || "default";
-        throw new Error(`Button text with type "${c}" has incorrect size: ${n.text.length}`);
+let kt = "https://web.telegram.org";
+const P = new vt("[SDK]", !1);
+function rr(r) {
+  if (r) {
+    P.enable();
+    return;
+  }
+  P.disable();
+}
+function nr(r) {
+  kt = r;
+}
+function se() {
+  return kt;
+}
+const ie = g({
+  eventType: h(),
+  eventData: (r) => r
+});
+function oe(r, t) {
+  window.dispatchEvent(new MessageEvent("message", {
+    data: JSON.stringify({ eventType: r, eventData: t })
+  }));
+}
+function ae() {
+  const r = window;
+  "TelegramGameProxy_receiveEvent" in r || [
+    ["TelegramGameProxy_receiveEvent"],
+    // Windows Phone.
+    ["TelegramGameProxy", "receiveEvent"],
+    // Desktop.
+    ["Telegram", "WebView", "receiveEvent"]
+    // Android and iOS.
+  ].forEach((t) => {
+    let e = r;
+    t.forEach((n, s, i) => {
+      if (s === i.length - 1) {
+        e[n] = oe;
+        return;
       }
-      return { ...n, text: u, id: a };
+      n in e || (e[n] = {}), e = e[n];
+    });
+  });
+}
+function ce(r) {
+  ae(), window.addEventListener("message", (t) => {
+    try {
+      const { eventType: e, eventData: n } = ie.parse(t.data);
+      r(e, n);
+    } catch {
+    }
+  });
+}
+function he() {
+  return g({
+    req_id: h(),
+    data: (r) => r === null ? r : h().optional().parse(r)
+  });
+}
+function ue() {
+  return g({
+    req_id: h(),
+    result: (r) => r,
+    error: h().optional()
+  });
+}
+function pe() {
+  return g({
+    slug: h(),
+    status: h()
+  });
+}
+function le() {
+  return g({ status: h() });
+}
+function de() {
+  return g({
+    button_id: (r) => r == null ? void 0 : h().parse(r)
+  });
+}
+function fe() {
+  return g({
+    data: h().optional()
+  });
+}
+function ge() {
+  return g({
+    theme_params: (r) => {
+      const t = dt().optional();
+      return Object.entries(Z(r)).reduce((e, [n, s]) => (e[n] = t.parse(s), e), {});
+    }
+  });
+}
+function we() {
+  return g({
+    height: A(),
+    width: (r) => r == null ? window.innerWidth : A().parse(r),
+    is_state_stable: C(),
+    is_expanded: C()
+  });
+}
+function _e() {
+  return g({ status: h() });
+}
+function be() {
+  const r = new w(), t = (e, ...n) => {
+    P.log("Emitting processed event:", e, ...n), r.emit(e, ...n);
+  };
+  return window.addEventListener("resize", () => {
+    t("viewport_changed", {
+      width: window.innerWidth,
+      height: window.innerHeight,
+      is_state_stable: !0,
+      is_expanded: !0
+    });
+  }), ce((e, n) => {
+    P.log("Received raw event:", e, n);
+    try {
+      switch (e) {
+        case "viewport_changed":
+          return t(e, we().parse(n));
+        case "theme_changed":
+          return t(e, ge().parse(n));
+        case "popup_closed":
+          return (
+            // Sent on desktop.
+            n == null ? t(e, {}) : t(e, de().parse(n))
+          );
+        case "set_custom_style":
+          return t(e, h().parse(n));
+        case "qr_text_received":
+          return t(e, fe().parse(n));
+        case "clipboard_text_received":
+          return t(e, he().parse(n));
+        case "invoice_closed":
+          return t(e, pe().parse(n));
+        case "phone_requested":
+          return t("phone_requested", le().parse(n));
+        case "custom_method_invoked":
+          return t("custom_method_invoked", ue().parse(n));
+        case "write_access_requested":
+          return t("write_access_requested", _e().parse(n));
+        case "main_button_pressed":
+        case "back_button_pressed":
+        case "settings_button_pressed":
+        case "scan_qr_popup_closed":
+        case "reload_iframe":
+          return t(e);
+        default:
+          return t(e, n);
+      }
+    } catch (s) {
+      P.error("Error processing event:", s);
+    }
+  }), r;
+}
+const z = "telegram-mini-apps-cached-emitter";
+function H() {
+  const r = window;
+  return r[z] === void 0 && (r[z] = be()), r[z];
+}
+function N(r, t) {
+  H().off(r, t);
+}
+function k(r, t) {
+  return H().on(r, t), () => N(r, t);
+}
+function sr(r, t) {
+  return H().once(r, t), () => N(r, t);
+}
+function me(r) {
+  H().unsubscribe(r);
+}
+function ir(r) {
+  return H().subscribe(r), () => me(r);
+}
+function ye(r, t) {
+  const e = r.split("."), n = t.split("."), s = Math.max(e.length, n.length);
+  for (let i = 0; i < s; i += 1) {
+    const a = parseInt(e[i] || "0", 10), c = parseInt(n[i] || "0", 10);
+    if (a !== c)
+      return a > c ? 1 : -1;
+  }
+  return 0;
+}
+function E(r, t) {
+  return ye(r, t) <= 0;
+}
+function q(r, t, e) {
+  if (typeof e == "string") {
+    if (r === "web_app_open_link" && t === "try_instant_view")
+      return E("6.4", e);
+    if (r === "web_app_set_header_color" && t === "color")
+      return E("6.9", e);
+  }
+  switch (r) {
+    case "web_app_open_tg_link":
+    case "web_app_open_invoice":
+    case "web_app_setup_back_button":
+    case "web_app_set_background_color":
+    case "web_app_set_header_color":
+    case "web_app_trigger_haptic_feedback":
+      return E("6.1", t);
+    case "web_app_open_popup":
+      return E("6.2", t);
+    case "web_app_close_scan_qr_popup":
+    case "web_app_open_scan_qr_popup":
+    case "web_app_read_text_from_clipboard":
+      return E("6.4", t);
+    case "web_app_switch_inline_query":
+      return E("6.7", t);
+    case "web_app_invoke_custom_method":
+    case "web_app_request_write_access":
+    case "web_app_request_phone":
+      return E("6.9", t);
+    case "web_app_setup_settings_button":
+      return E("6.10", t);
+    default:
+      return !0;
+  }
+}
+function S(r, t) {
+  return (e) => q(t[e], r);
+}
+function St(r, t) {
+  return (e) => {
+    const [n, s] = t[e];
+    return q(n, s, r);
+  };
+}
+function f(r, t, e) {
+  let n = {}, s;
+  t === void 0 && e === void 0 ? n = {} : t !== void 0 && e !== void 0 ? (n = e, s = t) : t !== void 0 && ("targetOrigin" in t ? n = t : s = t);
+  const { targetOrigin: i = se() } = n;
+  if (P.log(`Calling method "${r}"`, s), Ct()) {
+    window.parent.postMessage(JSON.stringify({
+      eventType: r,
+      eventData: s
+    }), i);
+    return;
+  }
+  if (re(window)) {
+    window.external.notify(JSON.stringify({ eventType: r, eventData: s }));
+    return;
+  }
+  if (ne(window)) {
+    window.TelegramWebviewProxy.postEvent(r, JSON.stringify(s));
+    return;
+  }
+  throw new Error(
+    "Unable to determine current environment and possible way to send event."
+  );
+}
+function Ee(r) {
+  return (t, e) => {
+    if (!q(t, r))
+      throw new K(t, r);
+    if (D(e)) {
+      let n;
+      if (t === "web_app_open_link" && "try_instant_view" in e ? n = "try_instant_view" : t === "web_app_set_header_color" && "color" in e && (n = "color"), n && !q(t, n, r))
+        throw new Y(t, n, r);
+    }
+    return f(t, e);
+  };
+}
+class X extends Error {
+  constructor(t) {
+    super(`Async call timeout exceeded. Timeout: ${t}`), Object.setPrototypeOf(this, X.prototype);
+  }
+}
+function rt(r) {
+  return new Promise((t, e) => {
+    setTimeout(e, r, new X(r));
+  });
+}
+function Ce(r, t) {
+  return typeof r == "function" ? (...e) => Promise.race([
+    r(...e),
+    rt(t)
+  ]) : Promise.race([r, rt(t)]);
+}
+function _(r, t, e, n) {
+  let s, i, a, c;
+  typeof t == "string" || Array.isArray(t) ? (a = Array.isArray(t) ? t : [t], s = e) : (i = t, a = Array.isArray(e) ? e : [e], s = n), D(i) && typeof i.req_id == "string" && (c = i.req_id);
+  const { postEvent: u = f, timeout: l } = s || {}, p = s && "capture" in s ? s.capture : null, m = new Promise((d, y) => {
+    const x = a.map((T) => k(T, (M) => {
+      typeof c == "string" && (!D(M) || M.req_id !== c) || typeof p == "function" && !p(M) || (V(), d(M));
+    })), V = () => x.forEach((T) => T());
+    try {
+      u(r, i);
+    } catch (T) {
+      V(), y(T);
     }
-    return { ...n, id: a };
-  }), { title: e, message: t, buttons: o };
+  });
+  return typeof l == "number" ? Ce(m, l) : m;
+}
+class ve {
+  constructor(t, e, n = f) {
+    o(this, "ee", new w());
+    o(this, "state");
+    /**
+     * Adds event listener.
+     * @param event - event name.
+     * @param listener - event listener.
+     */
+    o(this, "on", (t, e) => t === "click" ? k("back_button_pressed", e) : this.ee.on(t, e));
+    /**
+     * Removes event listener.
+     * @param event - event name.
+     * @param listener - event listener.
+     */
+    o(this, "off", (t, e) => t === "click" ? N("back_button_pressed", e) : this.ee.off(t, e));
+    /**
+     * Checks if specified method is supported by current component.
+     */
+    o(this, "supports");
+    this.postEvent = n, this.state = new b({ isVisible: t }, this.ee), this.supports = S(e, {
+      show: "web_app_setup_back_button",
+      hide: "web_app_setup_back_button"
+    });
+  }
+  set isVisible(t) {
+    this.state.set("isVisible", t), this.postEvent("web_app_setup_back_button", { is_visible: t });
+  }
+  /**
+   * True if BackButton is currently visible.
+   */
+  get isVisible() {
+    return this.state.get("isVisible");
+  }
+  /**
+   * Hides the BackButton.
+   */
+  hide() {
+    this.isVisible = !1;
+  }
+  /**
+   * Shows the BackButton.
+   */
+  show() {
+    this.isVisible = !0;
+  }
+}
+function nt(r, t) {
+  return r + (r.length > 0 && t.length > 0 ? ` ${t}` : t);
 }
-class Et {
-  constructor(t, e = g) {
-    i(this, "ee", new f());
-    i(this, "state");
+function ke(...r) {
+  return r.reduce((t, e) => {
+    let n = "";
+    return typeof e == "string" ? n = e : typeof e == "object" && e !== null && (n = Object.entries(e).reduce((s, [i, a]) => a ? nt(s, i) : s, "")), nt(t, n);
+  }, "");
+}
+function Se(r) {
+  return typeof r == "object" && r !== null && !Array.isArray(null);
+}
+function or(...r) {
+  return r.reduce((t, e) => (Se(e) && Object.entries(e).forEach(([n, s]) => {
+    const i = ke(t[n], s);
+    i.length > 0 && (t[n] = i);
+  }), t), {});
+}
+class xe {
+  constructor(t, e = f) {
+    o(this, "ee", new w());
+    o(this, "state");
     /**
      * Adds new event listener.
      */
-    i(this, "on", this.ee.on.bind(this.ee));
+    o(this, "on", this.ee.on.bind(this.ee));
     /**
      * Removes event listener.
      */
-    i(this, "off", this.ee.off.bind(this.ee));
+    o(this, "off", this.ee.off.bind(this.ee));
+    this.postEvent = e, this.state = new b({ isConfirmationNeeded: t }, this.ee);
+  }
+  set isConfirmationNeeded(t) {
+    this.state.set("isConfirmationNeeded", t), this.postEvent("web_app_setup_closing_behavior", { need_confirmation: t });
+  }
+  /**
+   * Returns true, if the confirmation dialog enabled while the user is trying
+   * to close the Mini App.
+   */
+  get isConfirmationNeeded() {
+    return this.state.get("isConfirmationNeeded");
+  }
+  /**
+   * Disables the confirmation dialog while the user is trying to close the
+   * Mini App.
+   */
+  disableConfirmation() {
+    this.isConfirmationNeeded = !1;
+  }
+  /**
+   * Enables the confirmation dialog while the user is trying to close the
+   * Mini App.
+   */
+  enableConfirmation() {
+    this.isConfirmationNeeded = !0;
+  }
+}
+const Pe = Bt().of(h());
+function st(r, t) {
+  return r.reduce((e, n) => (e[n] = t, e), {});
+}
+class Ae {
+  constructor(t, e, n = f) {
     /**
      * Checks if specified method is supported by current component.
      */
-    i(this, "supports");
-    this.postEvent = e, this.state = new b({ isOpened: !1 }, this.ee), this.supports = m(t, { open: "web_app_open_popup" });
+    o(this, "supports");
+    this.createRequestId = e, this.postEvent = n, this.supports = S(t, {
+      delete: "web_app_invoke_custom_method",
+      get: "web_app_invoke_custom_method",
+      getKeys: "web_app_invoke_custom_method",
+      set: "web_app_invoke_custom_method"
+    });
+  }
+  /**
+   * Invokes custom method related to CloudStorage.
+   * @param method - method name.
+   * @param params - method parameters.
+   * @param options - execution options.
+   */
+  async invokeCustomMethod(t, e, n = {}) {
+    const { result: s, error: i } = await _(
+      "web_app_invoke_custom_method",
+      { method: t, params: e, req_id: this.createRequestId() },
+      "custom_method_invoked",
+      { ...n, postEvent: this.postEvent }
+    );
+    if (i)
+      throw new Error(i);
+    return s;
   }
   /**
-   * Shows whether popup is currently opened.
+   * Deletes specified key or keys from the cloud storage.
+   * @param keyOrKeys - key or keys to delete.
+   * @param options - request execution options.
    */
-  get isOpened() {
-    return this.state.get("isOpened");
+  async delete(t, e) {
+    const n = Array.isArray(t) ? t : [t];
+    n.length !== 0 && await this.invokeCustomMethod("deleteStorageValues", { keys: n }, e);
+  }
+  /**
+   * Returns list of all keys presented in the cloud storage.
+   * @param options - request execution options.
+   */
+  async getKeys(t) {
+    const e = await this.invokeCustomMethod("getStorageKeys", {}, t);
+    return Pe.parse(e);
+  }
+  async get(t, e) {
+    const n = Array.isArray(t) ? t : [t];
+    if (n.length === 0)
+      return st(n, "");
+    const s = g(
+      st(n, h())
+    ), i = await this.invokeCustomMethod("getStorageValues", { keys: n }, e).then((a) => s.parse(a));
+    return Array.isArray(t) ? i : i[t];
+  }
+  /**
+   * Saves specified value by key.
+   * @param key - storage key.
+   * @param value - storage value.
+   * @param options - request execution options.
+   */
+  async set(t, e, n) {
+    await this.invokeCustomMethod("saveStorageValue", { key: t, value: e }, n);
+  }
+}
+class qe {
+  constructor(t, e = f) {
+    /**
+     * Checks if specified method is supported by current component.
+     */
+    o(this, "supports");
+    this.postEvent = e, this.supports = S(t, {
+      impactOccurred: "web_app_trigger_haptic_feedback",
+      notificationOccurred: "web_app_trigger_haptic_feedback",
+      selectionChanged: "web_app_trigger_haptic_feedback"
+    });
+  }
+  /**
+   * A method tells that an impact occurred. The Telegram app may play the
+   * appropriate haptics based on style value passed.
+   * @param style - impact style.
+   */
+  impactOccurred(t) {
+    this.postEvent("web_app_trigger_haptic_feedback", {
+      type: "impact",
+      impact_style: t
+    });
+  }
+  /**
+   * A method tells that a task or action has succeeded, failed, or produced
+   * a warning. The Telegram app may play the appropriate haptics based on
+   * type value passed.
+   * @param type - notification type.
+   */
+  notificationOccurred(t) {
+    this.postEvent("web_app_trigger_haptic_feedback", {
+      type: "notification",
+      notification_type: t
+    });
+  }
+  /**
+   * A method tells that the user has changed a selection. The Telegram app
+   * may play the appropriate haptics.
+   *
+   * Do not use this feedback when the user makes or confirms a selection;
+   * use it only when the selection changes.
+   */
+  selectionChanged() {
+    this.postEvent("web_app_trigger_haptic_feedback", { type: "selection_change" });
+  }
+}
+function Le() {
+  const r = document.createElement("style");
+  r.id = "telegram-custom-styles", document.head.appendChild(r), k("set_custom_style", (t) => {
+    r.innerHTML = t;
+  });
+}
+function xt(r) {
+  return `telegram-mini-apps-${r}`;
+}
+function O(r, t) {
+  sessionStorage.setItem(xt(r), JSON.stringify(t));
+}
+function W(r) {
+  const t = sessionStorage.getItem(xt(r));
+  return t ? JSON.parse(t) : null;
+}
+function $e(r, t, e) {
+  const { isVisible: n = !1 } = r ? W("back-button") || {} : {}, s = new ve(n, t, e);
+  return s.on("change", () => {
+    O("back-button", { isVisible: s.isVisible });
+  }), s;
+}
+function Ve(r, t) {
+  const { isConfirmationNeeded: e = !1 } = r ? W("closing-behavior") || {} : {}, n = new xe(e, t);
+  return n.on("change", () => O("closing-behavior", {
+    isConfirmationNeeded: n.isConfirmationNeeded
+  })), n;
+}
+class Te {
+  constructor(t) {
+    o(this, "ee", new w());
+    o(this, "state");
+    o(this, "postEvent");
+    /**
+     * Adds new event listener.
+     * @param event - event name.
+     * @param listener - event listener.
+     */
+    o(this, "on", (t, e) => (
+      // FIXME: Event 'main_button_pressed' is still being received on Android
+      //  even if the main button is disabled.
+      //  Issue: https://github.com/Telegram-Mini-Apps/tma.js/issues/3
+      t === "click" ? k("main_button_pressed", e) : this.ee.on(t, e)
+    ));
+    /**
+     * Removes event listener.
+     * @param event - event name.
+     * @param listener - event listener.
+     */
+    o(this, "off", (t, e) => t === "click" ? N("main_button_pressed", e) : this.ee.off(t, e));
+    const {
+      postEvent: e = f,
+      text: n,
+      textColor: s,
+      backgroundColor: i,
+      isEnabled: a,
+      isVisible: c,
+      isLoaderVisible: u
+    } = t;
+    this.postEvent = e, this.state = new b({
+      backgroundColor: i,
+      isEnabled: a,
+      isVisible: c,
+      isLoaderVisible: u,
+      text: n,
+      textColor: s
+    }, this.ee);
+  }
+  /**
+   * Sends current local state to Telegram application.
+   */
+  commit() {
+    this.text !== "" && this.postEvent("web_app_setup_main_button", {
+      is_visible: this.isVisible,
+      is_active: this.isEnabled,
+      is_progress_visible: this.isLoaderVisible,
+      text: this.text,
+      color: this.backgroundColor,
+      text_color: this.textColor
+    });
+  }
+  set isEnabled(t) {
+    this.setParams({ isEnabled: t });
+  }
+  /**
+   * True if the Main Button is currently enabled.
+   */
+  get isEnabled() {
+    return this.state.get("isEnabled");
+  }
+  set isLoaderVisible(t) {
+    this.setParams({ isLoaderVisible: t });
+  }
+  /**
+   * True if the Main Button loader is currently visible.
+   */
+  get isLoaderVisible() {
+    return this.state.get("isLoaderVisible");
+  }
+  set isVisible(t) {
+    this.setParams({ isVisible: t });
+  }
+  /**
+   * True if the Main Button is currently visible.
+   */
+  get isVisible() {
+    return this.state.get("isVisible");
+  }
+  /**
+   * The Main Button background color.
+   */
+  get backgroundColor() {
+    return this.state.get("backgroundColor");
+  }
+  /**
+   * The Main Button text.
+   */
+  get text() {
+    return this.state.get("text");
+  }
+  /**
+   * The Main Button text color.
+   */
+  get textColor() {
+    return this.state.get("textColor");
+  }
+  /**
+   * Disables the Main Button.
+   */
+  disable() {
+    return this.isEnabled = !1, this;
+  }
+  /**
+   * Enables the Main Button.
+   */
+  enable() {
+    return this.isEnabled = !0, this;
+  }
+  /**
+   * Hides the Main Button.
+   */
+  hide() {
+    return this.isVisible = !1, this;
+  }
+  /**
+   * Hides the Main Button loader.
+   */
+  hideLoader() {
+    return this.isLoaderVisible = !1, this;
+  }
+  /**
+   * Shows the Main Button. Note that opening the Mini App from the attachment menu hides the
+   * main button until the user interacts with the Mini App interface.
+   */
+  show() {
+    return this.isVisible = !0, this;
   }
   /**
-   * A method that shows a native popup described by the `params` argument.
-   * Promise will be resolved when popup is closed. Resolved value will have
-   * an identifier of pressed button.
-   *
-   * In case, user clicked outside the popup or clicked top right popup close
-   * button, null will be returned.
-   *
-   * FIXME: In desktop, this function may work incorrectly.
-   *  Issue: https://github.com/Telegram-Mini-Apps/tma.js/issues/7
-   * @param params - popup parameters.
-   * @throws {Error} Popup is already opened.
+   * A method to show a loading indicator on the Main Button. It is recommended to display
+   * loader if the action tied to the button may take a long time.
    */
-  async open(t) {
-    if (this.isOpened)
-      throw new Error("Popup is already opened.");
-    this.state.set("isOpened", !0);
-    try {
-      const { button_id: e = null } = await _(
-        "web_app_open_popup",
-        yt(t),
-        "popup_closed",
-        { postEvent: this.postEvent }
-      );
-      return e;
-    } finally {
-      this.state.set("isOpened", !1);
-    }
-  }
-}
-class kt {
-  constructor(t, e = g) {
-    i(this, "ee", new f());
-    i(this, "state");
-    /**
-     * Adds new event listener.
-     */
-    i(this, "on", this.ee.on.bind(this.ee));
-    /**
-     * Removes event listener.
-     */
-    i(this, "off", this.ee.off.bind(this.ee));
-    /**
-     * Checks if specified method is supported by current component.
-     */
-    i(this, "supports");
-    this.postEvent = e, this.state = new b({ isOpened: !1 }, this.ee), this.supports = m(t, {
-      close: "web_app_close_scan_qr_popup",
-      open: "web_app_open_scan_qr_popup"
-    });
+  showLoader() {
+    return this.isLoaderVisible = !0, this;
   }
   /**
-   * Closes scanner.
+   * Sets new Main Button text. Minimal length for text is 1 symbol, and maximum is 64 symbols.
+   * @param text - new text.
    */
-  close() {
-    this.postEvent("web_app_close_scan_qr_popup"), this.isOpened = !1;
+  setText(t) {
+    return this.setParams({ text: t });
   }
-  set isOpened(t) {
-    this.state.set("isOpened", t);
+  /**
+   * Sets new Main Button text color.
+   * @param textColor - new text color.
+   */
+  setTextColor(t) {
+    return this.setParams({ textColor: t });
   }
   /**
-   * Returns true in case, QR scanner is currently opened.
+   * Updates current Main Button color.
+   * @param backgroundColor - color to set.
    */
-  get isOpened() {
-    return this.state.get("isOpened");
+  setBackgroundColor(t) {
+    return this.setParams({ backgroundColor: t });
   }
   /**
-   * Opens scanner with specified title shown to user. Method returns promise
-   * with scanned QR content in case, it was scanned. It will contain null in
-   * case, scanner was closed.
-   * @param text - title to display.
+   * Allows setting multiple Main Button parameters.
+   * @param params - Main Button parameters.
    */
-  async open(t) {
-    if (this.isOpened)
-      throw new Error("QR scanner is already opened.");
-    this.isOpened = !0;
-    try {
-      const e = await _(
-        "web_app_open_scan_qr_popup",
-        { text: t },
-        ["qr_text_received", "scan_qr_popup_closed"],
-        { postEvent: this.postEvent }
-      );
-      return typeof e == "object" && typeof e.data == "string" ? e.data : null;
-    } finally {
-      this.isOpened = !1;
-    }
+  setParams(t) {
+    return this.state.set(t), this.commit(), this;
   }
 }
-class V {
+function Ie(r, t, e, n) {
+  const {
+    backgroundColor: s = t,
+    isEnabled: i = !1,
+    isVisible: a = !1,
+    isLoaderVisible: c = !1,
+    textColor: u = e,
+    text: l = ""
+  } = r ? W("main-button") || {} : {}, p = new Te({
+    backgroundColor: s,
+    isEnabled: i,
+    isLoaderVisible: c,
+    isVisible: a,
+    postEvent: n,
+    text: l,
+    textColor: u
+  }), m = () => O("main-button", {
+    backgroundColor: p.backgroundColor,
+    isEnabled: p.isEnabled,
+    isLoaderVisible: p.isLoaderVisible,
+    isVisible: p.isVisible,
+    text: p.text,
+    textColor: p.textColor
+  });
+  return p.on("change", m), p;
+}
+class Re {
   constructor(t) {
-    i(this, "ee", new f());
-    i(this, "state");
+    o(this, "ee", new w());
+    o(this, "state");
+    o(this, "botInline");
+    o(this, "postEvent");
     /**
      * Adds new event listener.
      */
-    i(this, "on", this.ee.on.bind(this.ee));
+    o(this, "on", this.ee.on.bind(this.ee));
     /**
      * Removes event listener.
      */
-    i(this, "off", this.ee.off.bind(this.ee));
-    this.state = new b(t, this.ee);
+    o(this, "off", this.ee.off.bind(this.ee));
+    /**
+     * Checks if specified method is supported by current component.
+     */
+    o(this, "supports");
+    /**
+     * Checks if specified method parameter is supported by current component.
+     */
+    o(this, "supportsParam");
+    const {
+      postEvent: e = f,
+      headerColor: n,
+      backgroundColor: s,
+      version: i,
+      botInline: a
+    } = t, c = S(i, {
+      requestPhoneAccess: "web_app_request_phone",
+      requestWriteAccess: "web_app_request_write_access",
+      switchInlineQuery: "web_app_switch_inline_query",
+      setHeaderColor: "web_app_set_header_color",
+      setBackgroundColor: "web_app_set_background_color"
+    });
+    this.postEvent = e, this.botInline = a, this.supports = (u) => !(!c(u) || u === "switchInlineQuery" && !a), this.state = new b({ backgroundColor: s, headerColor: n }, this.ee), this.supportsParam = St(i, {
+      "setHeaderColor.color": ["web_app_set_header_color", "color"]
+    });
   }
   /**
-   * Requests fresh information about current theme.
-   * FIXME: Be careful using this function in desktop version of Telegram as
-   *  long as method web_app_request_theme does not work on `macos` platform.
-   * @param options - method options.
+   * The Mini App background color.
    */
-  static async request(t = {}) {
-    const { timeout: e = 1e3, ...r } = t, o = await _("web_app_request_theme", "theme_changed", {
-      ...r,
-      timeout: e
-    });
-    return D(o.theme_params);
+  get backgroundColor() {
+    return this.state.get("backgroundColor");
   }
   /**
-   * Synchronizes specified instance of ThemeParams with the actual value in the native
-   * application.
-   * @param themeParams - ThemeParams instance.
+   * Closes the Mini App.
    */
-  static sync(t) {
-    E("theme_changed", (e) => {
-      t.state.set(D(e.theme_params));
-    });
+  close() {
+    this.postEvent("web_app_close");
   }
   /**
-   * Returns instance of ThemeParams which is synchronized with external
-   * environment.
-   * @param options - method options.
+   * The Mini App header color. Could either be a header color key or RGB color.
    */
-  static async synced(t) {
-    const e = await this.request(t), r = new V(e);
-    return this.sync(r), r;
-  }
-  get accentTextColor() {
-    return this.get("accentTextColor");
+  get headerColor() {
+    return this.state.get("headerColor");
   }
   /**
-   * Returns background color.
+   * True if Mini App is currently launched in bot inline mode.
    */
-  get backgroundColor() {
-    return this.get("backgroundColor");
+  get isBotInline() {
+    return this.botInline;
   }
   /**
-   * Returns button color.
+   * True if current Mini App background color recognized as dark.
    */
-  get buttonColor() {
-    return this.get("buttonColor");
+  get isDark() {
+    return lt(this.backgroundColor);
   }
   /**
-   * Returns button text color.
+   * Informs the Telegram app that the Mini App is ready to be displayed.
+   *
+   * It is recommended to call this method as early as possible, as soon as all essential
+   * interface elements loaded. Once this method called, the loading placeholder is hidden
+   * and the Mini App shown.
+   *
+   * If the method not called, the placeholder will be hidden only when the page fully loaded.
    */
-  get buttonTextColor() {
-    return this.get("buttonTextColor");
-  }
-  get destructiveTextColor() {
-    return this.get("destructiveTextColor");
+  ready() {
+    this.postEvent("web_app_ready");
   }
   /**
-   * Retrieves palette color value by its name.
-   * @param key - palette key name.
+   * Requests current user phone access.
    */
-  get(t) {
-    return this.state.get(t) || null;
-  }
-  getState() {
-    return this.state.getState();
-  }
-  get headerBackgroundColor() {
-    return this.get("headerBackgroundColor");
+  requestPhoneAccess() {
+    return _(
+      "web_app_request_phone",
+      "phone_requested",
+      { postEvent: this.postEvent }
+    ).then((t) => t.status);
   }
   /**
-   * Returns hint color.
+   * Requests write message access to current user.
    */
-  get hintColor() {
-    return this.get("hintColor");
+  requestWriteAccess() {
+    return _(
+      "web_app_request_write_access",
+      "write_access_requested",
+      { postEvent: this.postEvent }
+    ).then((t) => t.status);
   }
   /**
-   * Returns true in case, current color scheme is recognized as dark. This
-   * value is calculated according to theme background color.
+   * A method used to send data to the bot. When this method called, a service message sent to
+   * the bot containing the data of the length up to 4096 bytes, and the Mini App closed. See the
+   * field `web_app_data` in the class [Message](https://core.telegram.org/bots/api#message).
+   *
+   * This method is only available for Mini Apps launched via a Keyboard button.
+   * @param data - data to send to bot.
+   * @throws {Error} data has incorrect size.
    */
-  get isDark() {
-    return this.backgroundColor === null || U(this.backgroundColor);
+  sendData(t) {
+    const { size: e } = new Blob([t]);
+    if (e === 0 || e > 4096)
+      throw new Error(`Passed data has incorrect size: ${e}`);
+    this.postEvent("web_app_data_send", { data: t });
   }
   /**
-   * Returns current link color.
+   * Updates current Mini App header color.
+   * @param color - color key or RGB color.
    */
-  get linkColor() {
-    return this.get("linkColor");
+  setHeaderColor(t) {
+    this.postEvent("web_app_set_header_color", ut(t) ? { color: t } : { color_key: t }), this.state.set("headerColor", t);
   }
   /**
-   * Returns secondary background color.
+   * Updates current Mini App background color.
+   * @param color - RGB color.
    */
-  get secondaryBackgroundColor() {
-    return this.get("secondaryBackgroundColor");
-  }
-  get sectionBackgroundColor() {
-    return this.get("sectionBackgroundColor");
-  }
-  get sectionHeaderTextColor() {
-    return this.get("sectionHeaderTextColor");
-  }
-  get subtitleTextColor() {
-    return this.get("subtitleTextColor");
+  setBackgroundColor(t) {
+    this.postEvent("web_app_set_background_color", { color: t }), this.state.set("backgroundColor", t);
   }
   /**
-   * Returns text color.
-   */
-  get textColor() {
-    return this.get("textColor");
+   * Inserts the bot's username and the specified inline query in the current chat's input field.
+   * Query may be empty, in which case only the bot's username will be inserted. The client prompts
+   * the user to choose a specific chat, then opens that chat and inserts the bot's username and
+   * the specified inline query in the input field.
+   * @param text - text which should be inserted in the input after the current bot name. Max
+   * length is 256 symbols.
+   * @param chatTypes - List of chat types which could be chosen to send the message. Could be
+   * empty list.
+   */
+  switchInlineQuery(t, e = []) {
+    if (!this.supports("switchInlineQuery") && !this.isBotInline)
+      throw new Error("Method is unsupported because Mini App should be launched in inline mode.");
+    this.postEvent("web_app_switch_inline_query", {
+      query: t,
+      chat_types: e
+    });
   }
 }
-function v(s) {
-  return s < 0 ? 0 : s;
+function Be(r, t, e, n, s) {
+  const {
+    backgroundColor: i = t,
+    headerColor: a = "bg_color"
+  } = r ? W("mini-app") || {} : {}, c = new Re({
+    headerColor: a,
+    backgroundColor: i,
+    version: e,
+    botInline: n,
+    postEvent: s
+  }), u = () => O("mini-app", {
+    backgroundColor: c.backgroundColor,
+    headerColor: c.headerColor
+  });
+  return c.on("change", u), c;
+}
+function De() {
+  let r = 0;
+  return () => (r += 1, r.toString());
 }
-class y {
-  constructor(t, e, r, o, n = g) {
-    i(this, "ee", new f());
-    i(this, "state");
+function He(r) {
+  const t = new zt(r);
+  return t.listen(), t;
+}
+async function Pt(r) {
+  const t = await _("web_app_request_viewport", "viewport_changed", r);
+  return {
+    height: t.height,
+    width: t.width,
+    isExpanded: t.is_expanded,
+    isStateStable: t.is_state_stable
+  };
+}
+function I(r) {
+  return r < 0 ? 0 : r;
+}
+class j {
+  constructor(t) {
+    o(this, "ee", new w());
+    o(this, "state");
+    o(this, "postEvent");
     /**
      * Adds new event listener.
      */
-    i(this, "on", this.ee.on.bind(this.ee));
+    o(this, "on", this.ee.on.bind(this.ee));
     /**
      * Removes event listener.
      */
-    i(this, "off", this.ee.off.bind(this.ee));
-    this.postEvent = n, this.state = new b({
-      height: v(t),
-      isExpanded: o,
-      stableHeight: v(r),
-      width: v(e)
+    o(this, "off", this.ee.off.bind(this.ee));
+    const {
+      height: e,
+      isExpanded: n,
+      width: s,
+      stableHeight: i,
+      postEvent: a = f
+    } = t;
+    this.postEvent = a, this.state = new b({
+      height: I(e),
+      isExpanded: n,
+      stableHeight: I(i),
+      width: I(s)
     }, this.ee);
   }
   /**
-   * Requests fresh information about current viewport.
-   * FIXME: Be careful using this function in desktop version of Telegram as
-   *  long as method web_app_request_viewport does not work on `macos` platform.
-   * @see Issue: https://github.com/Telegram-Mini-Apps/tma.js/issues/5
-   * @param options - method options.
-   */
-  static async request(t = {}) {
-    const { timeout: e = 1e3, ...r } = t, {
-      is_expanded: o,
-      is_state_stable: n,
-      ...a
-    } = await _("web_app_request_viewport", "viewport_changed", {
-      ...r,
-      timeout: e
-    });
-    return { ...a, isExpanded: o, isStateStable: n };
-  }
-  /**
-   * Synchronizes specified instance of Viewport with the actual value in the native
-   * application.
-   * @param viewport - Viewport instance.
+   * Request viewport information from the Telegram application and updates current Viewport
+   * instance.
+   * @param options - options to request fresh data.
    */
-  static sync(t) {
-    E("viewport_changed", (e) => {
-      const {
-        height: r,
-        width: o,
-        is_expanded: n,
-        is_state_stable: a
-      } = e, u = v(r);
-      t.state.set({
-        height: u,
+  sync(t) {
+    return Pt(t).then(({ height: e, isExpanded: n, width: s, isStateStable: i }) => {
+      this.state.set({
+        height: e,
+        width: s,
         isExpanded: n,
-        width: v(o),
-        stableHeight: a ? u : void 0
+        stableHeight: i ? e : this.state.get("stableHeight")
       });
     });
   }
-  /**
-   * Returns initialized instance of Viewport which is synchronized with
-   * its actual state in Mini Apps.
-   * @param options - method options.
-   */
-  static async synced(t = {}) {
-    const { height: e, isExpanded: r, width: o } = await this.request(t), n = new y(e, o, e, r, t.postEvent);
-    return this.sync(n), n;
-  }
   /**
    * The current height of the visible area of the Mini App.
    *
@@ -861,10 +1749,6 @@ class y {
    * used to pin interface elements to the bottom of the visible area. It's
    * more appropriate to use the value of the `stableHeight`
    * field for this purpose.
-   *
-   * @see init
-   * @see expand
-   * @see stableHeight
    */
   get height() {
     return this.state.get("height");
@@ -882,14 +1766,29 @@ class y {
    * gestures or during animations. The value of `stableHeight`
    * will be updated after all gestures and animations are completed and
    * the Mini App reaches its final size.
-   *
-   * @see init
-   * @see expand
-   * @see height
    */
   get stableHeight() {
     return this.state.get("stableHeight");
   }
+  /**
+   * Starts listening to viewport changes and applies them.
+   * @returns Function to stop listening.
+   */
+  listen() {
+    return k("viewport_changed", (t) => {
+      const {
+        height: e,
+        width: n,
+        is_expanded: s,
+        is_state_stable: i
+      } = t, a = {
+        height: I(e),
+        isExpanded: s,
+        width: I(n)
+      };
+      i && (a.stableHeight = a.height), this.state.set(a);
+    });
+  }
   /**
    * Returns true if the Mini App is expanded to the maximum available height.
    * Otherwise, if the Mini App occupies part of the screen and can be expanded
@@ -899,104 +1798,323 @@ class y {
   get isExpanded() {
     return this.state.get("isExpanded");
   }
-  /**
-   * Current viewport width.
-   */
-  get width() {
-    return this.state.get("width");
+  /**
+   * Current viewport width.
+   */
+  get width() {
+    return this.state.get("width");
+  }
+  /**
+   * A method that expands the Mini App to the maximum available height. To
+   * find out if the Mini App is expanded to the maximum height, refer to the
+   * value of the `isExpanded`.
+   * @see isExpanded
+   */
+  expand() {
+    this.postEvent("web_app_expand"), this.state.set("isExpanded", !0);
+  }
+  /**
+   * Returns true in case current viewport height is stable and is not going to
+   * change in the next moment.
+   */
+  get isStable() {
+    return this.stableHeight === this.height;
+  }
+}
+function At(r, t, e) {
+  if (r || t === "macos" || t === "web" || t === "weba")
+    return new j({
+      height: window.innerHeight,
+      isExpanded: !0,
+      postEvent: e,
+      stableHeight: window.innerHeight,
+      width: window.innerWidth
+    });
+  const n = W("viewport");
+  return n ? new j({ ...n, postEvent: e }) : null;
+}
+function qt(r) {
+  return r.listen(), r.on("change", () => O("viewport", {
+    height: r.height,
+    isExpanded: r.isExpanded,
+    stableHeight: r.stableHeight,
+    width: r.width
+  })), r;
+}
+function Ne(r, t, e) {
+  const n = qt(
+    At(r, t, e) || new j({
+      width: 0,
+      height: 0,
+      isExpanded: !1,
+      postEvent: e,
+      stableHeight: 0
+    })
+  );
+  return n.sync({ postEvent: e, timeout: 100 }).catch((s) => {
+    console.error("Unable to actualize viewport state", s);
+  }), n;
+}
+async function Oe(r, t, e) {
+  return qt(
+    At(r, t, e) || await Pt({ postEvent: e, timeout: 100 }).then(({ height: n, isStateStable: s, ...i }) => new j({
+      ...i,
+      height: n,
+      stableHeight: s ? n : 0
+    }))
+  );
+}
+function v(r, t) {
+  document.documentElement.style.setProperty(r, t);
+}
+function We(r, t) {
+  const e = () => {
+    v("--tg-background-color", r.backgroundColor);
+  }, n = () => {
+    const {
+      backgroundColor: s,
+      secondaryBackgroundColor: i
+    } = t;
+    r.headerColor === "bg_color" ? s && v("--tg-header-color", s) : r.headerColor === "secondary_bg_color" ? i && v("--tg-header-color", i) : v("--tg-header-color", r.headerColor);
+  };
+  t.on("change", n), r.on("change:backgroundColor", e), r.on("change:headerColor", n), e(), n();
+}
+function Me(r) {
+  const t = () => {
+    const e = r.getState();
+    Object.entries(e).forEach(([n, s]) => {
+      if (s) {
+        const i = n.replace(/[A-Z]/g, (a) => `-${a.toLowerCase()}`);
+        v(`--tg-theme-${i}`, s);
+      }
+    });
+  };
+  r.on("change", t), t();
+}
+function it(r) {
+  const t = () => v("--tg-viewport-height", `${r.height}px`), e = () => v("--tg-viewport-width", `${r.width}px`), n = () => v("--tg-viewport-height", `${r.stableHeight}px`);
+  r.on("change:height", t), r.on("change:width", e), r.on("change:stableHeight", n), t(), e(), n();
+}
+function Ue(r) {
+  return typeof r == "object" ? r : r ? {
+    themeParams: !0,
+    viewport: !0,
+    miniApp: !0
+  } : {};
+}
+function ot(r, t, e, n) {
+  const s = Ue(r);
+  s.miniApp && We(t, e), s.themeParams && Me(e), s.viewport && (n instanceof Promise ? n.then(it) : it(n));
+}
+function je(r) {
+  const { hostname: t, pathname: e } = new URL(r, window.location.href);
+  if (t !== "t.me")
+    throw new Error(`Incorrect hostname: ${t}`);
+  const n = e.match(/^\/(\$|invoice\/)([A-Za-z0-9\-_=]+)$/);
+  if (n === null)
+    throw new Error('Link pathname has incorrect format. Expected to receive "/invoice/{slug}" or "/${slug}"');
+  return n[2];
+}
+class Ge {
+  constructor(t, e = f) {
+    o(this, "ee", new w());
+    o(this, "state");
+    /**
+     * Adds new event listener.
+     */
+    o(this, "on", this.ee.on.bind(this.ee));
+    /**
+     * Removes event listener.
+     */
+    o(this, "off", this.ee.off.bind(this.ee));
+    /**
+     * Checks if specified method is supported by current component.
+     */
+    o(this, "supports");
+    this.postEvent = e, this.state = new b({ isOpened: !1 }, this.ee), this.supports = S(t, { open: "web_app_open_invoice" });
+  }
+  set isOpened(t) {
+    this.state.set("isOpened", t);
+  }
+  /**
+   * True if invoice is currently opened.
+   */
+  get isOpened() {
+    return this.state.get("isOpened");
+  }
+  async open(t, e) {
+    if (this.isOpened)
+      throw new Error("Invoice is already opened");
+    const n = e ? je(t) : t;
+    this.isOpened = !0;
+    try {
+      return (await _(
+        "web_app_open_invoice",
+        { slug: n },
+        "invoice_closed",
+        {
+          postEvent: this.postEvent,
+          capture(i) {
+            return n === i.slug;
+          }
+        }
+      )).status;
+    } finally {
+      this.isOpened = !1;
+    }
+  }
+}
+function Fe(r) {
+  const t = r.message.trim(), e = (r.title || "").trim(), n = r.buttons || [];
+  let s;
+  if (e.length > 64)
+    throw new Error(`Title has incorrect size: ${e.length}`);
+  if (t.length === 0 || t.length > 256)
+    throw new Error(`Message has incorrect size: ${t.length}`);
+  if (n.length > 3)
+    throw new Error(`Buttons have incorrect size: ${n.length}`);
+  return n.length === 0 ? s = [{ type: "close", id: "" }] : s = n.map((i) => {
+    const { id: a = "" } = i;
+    if (a.length > 64)
+      throw new Error(`Button ID has incorrect size: ${a}`);
+    if (i.type === void 0 || i.type === "default" || i.type === "destructive") {
+      const c = i.text.trim();
+      if (c.length === 0 || c.length > 64) {
+        const u = i.type || "default";
+        throw new Error(`Button text with type "${u}" has incorrect size: ${i.text.length}`);
+      }
+      return { ...i, text: c, id: a };
+    }
+    return { ...i, id: a };
+  }), { title: e, message: t, buttons: s };
+}
+class ze {
+  constructor(t, e = f) {
+    o(this, "ee", new w());
+    o(this, "state");
+    /**
+     * Adds new event listener.
+     */
+    o(this, "on", this.ee.on.bind(this.ee));
+    /**
+     * Removes event listener.
+     */
+    o(this, "off", this.ee.off.bind(this.ee));
+    /**
+     * Checks if specified method is supported by current component.
+     */
+    o(this, "supports");
+    this.postEvent = e, this.state = new b({ isOpened: !1 }, this.ee), this.supports = S(t, { open: "web_app_open_popup" });
+  }
+  set isOpened(t) {
+    this.state.set("isOpened", t);
   }
   /**
-   * A method that expands the Mini App to the maximum available height. To
-   * find out if the Mini App is expanded to the maximum height, refer to the
-   * value of the `isExpanded`.
-   * @see isExpanded
+   * True if popup is currently opened.
    */
-  expand() {
-    this.state.set("isExpanded", !0), this.postEvent("web_app_expand");
+  get isOpened() {
+    return this.state.get("isOpened");
   }
   /**
-   * Returns true in case current viewport height is stable and is not going to
-   * change in the next moment.
+   * A method that shows a native popup described by the `params` argument.
+   * Promise will be resolved when popup is closed. Resolved value will have
+   * an identifier of pressed button.
+   *
+   * In case, user clicked outside the popup or clicked top right popup close
+   * button, null will be returned.
+   *
+   * FIXME: In desktop, this function may work incorrectly.
+   *  Issue: https://github.com/Telegram-Mini-Apps/tma.js/issues/7
+   * @param options - popup parameters.
+   * @throws {Error} Popup is already opened.
    */
-  get isStable() {
-    return this.stableHeight === this.height;
+  open(t) {
+    if (this.isOpened)
+      throw new Error("Popup is already opened.");
+    return this.isOpened = !0, _(
+      "web_app_open_popup",
+      Fe(t),
+      "popup_closed",
+      { postEvent: this.postEvent }
+    ).then(({ button_id: e = null }) => e).finally(() => {
+      this.isOpened = !1;
+    });
   }
 }
-function T(s) {
-  const t = document.createElement("a");
-  if (t.href = s, t.protocol !== "http:" && t.protocol !== "https:")
-    throw Error(
-      `URL protocol is not supported by OS, or link has not allowed protocol: ${t.protocol}`
-    );
-  return t.href;
-}
-class xt {
-  constructor(t, e, r, o, n, a = g) {
-    i(this, "ee", new f());
-    i(this, "state");
+class Je {
+  constructor(t, e = f) {
+    o(this, "ee", new w());
+    o(this, "state");
     /**
      * Adds new event listener.
      */
-    i(this, "on", this.ee.on.bind(this.ee));
+    o(this, "on", this.ee.on.bind(this.ee));
     /**
      * Removes event listener.
      */
-    i(this, "off", this.ee.off.bind(this.ee));
+    o(this, "off", this.ee.off.bind(this.ee));
     /**
      * Checks if specified method is supported by current component.
      */
-    i(this, "supports");
-    /**
-     * Checks if specified method parameter is supported by current component.
-     */
-    i(this, "supportsParam");
-    this.currentVersion = r, this.currentPlatform = o, this.createRequestId = n, this.postEvent = a, this.state = new b({
-      backgroundColor: e,
-      headerColor: t
-    }, this.ee), this.supports = m(r, {
-      openInvoice: "web_app_open_invoice",
-      readTextFromClipboard: "web_app_read_text_from_clipboard",
-      setHeaderColor: "web_app_set_header_color",
-      setBackgroundColor: "web_app_set_background_color",
-      requestPhoneAccess: "web_app_request_phone",
-      requestWriteAccess: "web_app_request_write_access"
-    }), this.supportsParam = gt(r, {
-      "setHeaderColor.color": ["web_app_set_header_color", "color"],
-      "openLink.tryInstantView": ["web_app_open_link", "try_instant_view"]
+    o(this, "supports");
+    this.postEvent = e, this.state = new b({ isOpened: !1 }, this.ee), this.supports = S(t, {
+      close: "web_app_close_scan_qr_popup",
+      open: "web_app_open_scan_qr_popup"
     });
   }
   /**
-   * Returns current application background color.
+   * Closes scanner.
    */
-  get backgroundColor() {
-    return this.state.get("backgroundColor");
+  close() {
+    this.postEvent("web_app_close_scan_qr_popup"), this.isOpened = !1;
   }
-  /**
-   * Returns current application color scheme. This value is
-   * computed based on the current background color.
-   */
-  get colorScheme() {
-    return U(this.backgroundColor) ? "dark" : "light";
+  set isOpened(t) {
+    this.state.set("isOpened", t);
   }
   /**
-   * Closes the Mini App.
+   * Returns true in case, QR scanner is currently opened.
    */
-  close() {
-    this.postEvent("web_app_close");
+  get isOpened() {
+    return this.state.get("isOpened");
   }
   /**
-   * Returns current application header color.
+   * Opens scanner with specified title shown to user. Method returns promise
+   * with scanned QR content in case, it was scanned. It will contain null in
+   * case, scanner was closed.
+   * @param text - title to display.
    */
-  get headerColor() {
-    return this.state.get("headerColor");
+  async open(t) {
+    if (this.isOpened)
+      throw new Error("QR scanner is already opened.");
+    this.isOpened = !0;
+    try {
+      const e = await _(
+        "web_app_open_scan_qr_popup",
+        { text: t },
+        ["qr_text_received", "scan_qr_popup_closed"],
+        { postEvent: this.postEvent }
+      );
+      return typeof e == "object" && typeof e.data == "string" ? e.data : null;
+    } finally {
+      this.isOpened = !1;
+    }
   }
-  /**
-   * Returns true if passed version is more than or equal to current
-   * Mini App version.
-   * @param version - compared version.
-   */
-  isVersionAtLeast(t) {
-    return lt(t, this.version) >= 0;
+}
+class Qe {
+  constructor(t, e, n = f) {
+    /**
+     * Checks if specified method is supported by current component.
+     */
+    o(this, "supports");
+    /**
+     * Checks if specified method parameter is supported by current component.
+     */
+    o(this, "supportsParam");
+    this.version = t, this.createRequestId = e, this.postEvent = n, this.supports = S(t, {
+      readTextFromClipboard: "web_app_read_text_from_clipboard"
+    }), this.supportsParam = St(t, {
+      "openLink.tryInstantView": ["web_app_open_link", "try_instant_view"]
+    });
   }
   /**
    * Opens a link in an external browser. The Mini App will not be closed.
@@ -1008,378 +2126,487 @@ class xt {
    * @param tryInstantView
    */
   openLink(t, e) {
-    const r = T(t);
-    if (!S("web_app_open_link", this.version)) {
-      window.open(r, "_blank");
+    const n = new URL(t, window.location.href).toString();
+    if (!q("web_app_open_link", this.version)) {
+      window.open(n, "_blank");
       return;
     }
-    return this.postEvent("web_app_open_link", {
-      url: r,
+    this.postEvent("web_app_open_link", {
+      url: n,
       ...typeof e == "boolean" ? { try_instant_view: e } : {}
     });
   }
   /**
-   * Opens a Telegram link inside Telegram app. The Mini App will be closed.
-   * It expects passing link in full format, with hostname "t.me".
+   * Opens a Telegram link inside Telegram app. The Mini App will be closed. It expects passing
+   * link in full format, with hostname "t.me".
    * @param url - URL to be opened.
    * @throws {Error} URL has not allowed hostname.
    */
   openTelegramLink(t) {
-    const { hostname: e, pathname: r, search: o } = new URL(T(t));
+    const {
+      hostname: e,
+      pathname: n,
+      search: s
+    } = new URL(t, window.location.href);
     if (e !== "t.me")
       throw new Error(`URL has not allowed hostname: ${e}. Only "t.me" is allowed`);
-    if (!S("web_app_open_tg_link", this.version)) {
+    if (!q("web_app_open_tg_link", this.version)) {
       window.location.href = t;
       return;
     }
-    return this.postEvent("web_app_open_tg_link", { path_full: r + o });
+    this.postEvent("web_app_open_tg_link", { path_full: n + s });
   }
   /**
-   * Opens an invoice using its url. It expects passing link in full format,
-   * with hostname "t.me".
-   * @param url - invoice URL.
+   * Reads text from clipboard and returns string or null. null is returned
+   * in cases:
+   * - Value in clipboard is not text
+   * - Access to clipboard is not allowed
    */
-  async openInvoice(t) {
-    const { hostname: e, pathname: r } = new URL(T(t));
-    if (e !== "t.me")
-      throw new Error(`Incorrect hostname: ${e}`);
-    const o = r.match(/^\/(\$|invoice\/)([A-Za-z0-9\-_=]+)$/);
-    if (o === null)
-      throw new Error('Link pathname has incorrect format. Expected to receive "/invoice/slug" or "/$slug"');
-    const [, , n] = o;
-    return (await _("web_app_open_invoice", { slug: n }, "invoice_closed", {
-      postEvent: this.postEvent,
-      capture: ({ slug: u }) => n === u
-    })).status;
+  readTextFromClipboard() {
+    return _(
+      "web_app_read_text_from_clipboard",
+      { req_id: this.createRequestId() },
+      "clipboard_text_received",
+      { postEvent: this.postEvent }
+    ).then(({ data: t = null }) => t);
+  }
+}
+function ar(r) {
+  const {
+    async: t = !1,
+    cssVars: e = !1,
+    acceptCustomStyles: n = !1
+  } = r;
+  try {
+    const {
+      launchParams: {
+        initData: s,
+        initDataRaw: i,
+        version: a,
+        platform: c,
+        themeParams: u,
+        botInline: l = !1
+      },
+      isPageReload: p
+    } = Et(), m = De(), d = Ee(a);
+    Ct() && (n && Le(), d("iframe_ready", { reload_supported: !0 }), k("reload_iframe", () => window.location.reload()));
+    const y = {
+      backButton: $e(p, a, d),
+      closingBehavior: Ve(p, d),
+      cloudStorage: new Ae(a, m, d),
+      createRequestId: m,
+      hapticFeedback: new qe(a, d),
+      invoice: new Ge(a, d),
+      mainButton: Ie(
+        p,
+        u.buttonColor || "#000000",
+        u.buttonTextColor || "#ffffff",
+        d
+      ),
+      miniApp: Be(
+        p,
+        u.backgroundColor || "#ffffff",
+        a,
+        l,
+        d
+      ),
+      popup: new ze(a, d),
+      postEvent: d,
+      qrScanner: new Je(a, d),
+      themeParams: He(u),
+      utils: new Qe(a, m, d),
+      ...s ? {
+        initData: new Mt(s),
+        initDataRaw: i
+      } : {}
+    }, x = t ? Oe(p, c, d) : Ne(p, c, d);
+    return x instanceof Promise ? x.then((V) => (ot(
+      e,
+      y.miniApp,
+      y.themeParams,
+      V
+    ), {
+      ...y,
+      viewport: V
+    })) : (ot(
+      e,
+      y.miniApp,
+      y.themeParams,
+      x
+    ), { ...y, viewport: x });
+  } catch (s) {
+    if (t)
+      return Promise.reject(s);
+    throw s;
+  }
+}
+function R(r, t) {
+  return r.startsWith(t) ? r : `${t}${r}`;
+}
+function cr(r) {
+  const t = r.match(/#(.+)/);
+  return t ? t[1] : null;
+}
+async function B(r) {
+  return r === 0 ? !0 : Promise.race([
+    new Promise((t) => {
+      window.addEventListener("popstate", function e() {
+        window.removeEventListener("popstate", e), t(!0);
+      }), window.history.go(r);
+    }),
+    // Usually, it takes about 1ms to emit this event, but we use some buffer.
+    new Promise((t) => {
+      setTimeout(t, 50, !1);
+    })
+  ]);
+}
+async function Ze() {
+  if (window.history.length <= 1 || (window.history.pushState(null, ""), await B(1 - window.history.length)))
+    return;
+  let t = await B(-1);
+  for (; t; )
+    t = await B(-1);
+}
+class Ke {
+  constructor(t, e, {
+    debug: n = !1,
+    loggerPrefix: s = "Navigator"
+  }) {
+    o(this, "logger");
+    o(this, "entries");
+    if (this.entriesCursor = e, t.length === 0)
+      throw new Error("Entries list should not be empty.");
+    if (e >= t.length)
+      throw new Error("Cursor should be less than entries count.");
+    this.entries = t.map(({ pathname: i = "", search: a, hash: c }) => {
+      if (!i.startsWith("/") && i.length > 0)
+        throw new Error('Pathname should start with "/"');
+      return {
+        pathname: R(i, "/"),
+        search: a ? R(a, "?") : "",
+        hash: c ? R(c, "#") : ""
+      };
+    }), this.logger = new vt(`[${s}]`, n);
+  }
+  /**
+   * Converts entry to the navigation entry.
+   * @param entry - entry data
+   */
+  formatEntry(t) {
+    let e;
+    if (typeof t == "string")
+      e = t;
+    else {
+      const {
+        pathname: a = "",
+        search: c,
+        hash: u
+      } = t;
+      e = a + (c ? R(c, "?") : "") + (u ? R(u, "#") : "");
+    }
+    const {
+      pathname: n,
+      search: s,
+      hash: i
+    } = new URL(e, `https://localhost${this.path}`);
+    return {
+      pathname: n,
+      search: s,
+      hash: i
+    };
   }
   /**
-   * Returns current Mini App platform.
+   * Current entry.
    */
-  get platform() {
-    return this.currentPlatform;
+  get entry() {
+    return this.entries[this.entriesCursor];
   }
   /**
-   * Informs the Telegram app that the Mini App is ready to be displayed.
-   *
-   * It is recommended to call this method as early as possible, as soon as
-   * all essential interface elements loaded. Once this method called,
-   * the loading placeholder is hidden and the Mini App shown.
-   *
-   * If the method not called, the placeholder will be hidden only when
-   * the page fully loaded.
+   * Goes back in history.
    */
-  ready() {
-    this.postEvent("web_app_ready");
+  back() {
+    return this.go(-1);
   }
   /**
-   * Reads text from clipboard and returns string or null. null is returned
-   * in cases:
-   * - Value in clipboard is not text
-   * - Access to clipboard is not allowed
+   * Current entries cursor.
    */
-  async readTextFromClipboard() {
-    const { data: t = null } = await _(
-      "web_app_read_text_from_clipboard",
-      { req_id: this.createRequestId() },
-      "clipboard_text_received",
-      { postEvent: this.postEvent }
-    );
-    return t;
+  get cursor() {
+    return this.entriesCursor;
   }
   /**
-   * Requests current user phone access.
+   * True if navigator can go back.
    */
-  async requestPhoneAccess() {
-    const { status: t } = await _("web_app_request_phone", "phone_requested", {
-      postEvent: this.postEvent
-    });
-    return t;
+  get canGoBack() {
+    return this.entriesCursor > 0;
   }
   /**
-   * Requests write message access to current user.
+   * True if navigator can go forward.
+   */
+  get canGoForward() {
+    return this.entriesCursor !== this.entries.length - 1;
+  }
+  /**
+   * Goes forward in history.
+   */
+  forward() {
+    return this.go(1);
+  }
+  /**
+   * Moves entries cursor by specified delta.
+   * @param delta - cursor delta.
    */
-  async requestWriteAccess() {
-    const { status: t } = await _("web_app_request_write_access", "write_access_requested", {
-      postEvent: this.postEvent
+  go(t) {
+    this.logger.log(`called go(${t})`);
+    const e = Math.min(
+      this.entries.length - 1,
+      Math.max(this.entriesCursor + t, 0)
+    );
+    if (this.entriesCursor === e)
+      return this.performGo({
+        updated: !1,
+        delta: t
+      });
+    const n = this.entry;
+    this.entriesCursor = e;
+    const s = this.entry;
+    return this.logger.log("State changed", { before: n, after: s }), this.performGo({
+      updated: !0,
+      delta: t,
+      before: n,
+      after: s
     });
-    return t;
   }
   /**
-   * A method used to send data to the bot. When this method called, a
-   * service message sent to the bot containing the data of the
-   * length up to 4096 bytes, and the Mini App closed. See the field
-   * `web_app_data` in the class Message.
+   * Returns copy of navigator entries.
+   */
+  getEntries() {
+    return this.entries.map((t) => ({ ...t }));
+  }
+  /**
+   * Current hash.
+   * @example
+   * "", "#", "#hash"
+   */
+  get hash() {
+    return this.entry.hash;
+  }
+  /**
+   * Pushes new entry. Method replaces all entries after the current one with the inserted.
+   * @param entry - entry data.
    *
-   * This method is only available for Mini Apps launched via a Keyboard button.
-   * @param data - data to send to bot.
-   * @throws {Error} data has incorrect size.
+   * @example Pushing absolute pathname.
+   * push("/absolute-path"); // "/absolute-path"
+   *
+   * @example Pushing relative pathname.
+   * // Pushing relative path replaces N last path parts, where N is pushed pathname parts count.
+   * // Pushing empty path is recognized as relative, but not replacing the last pathname part.
+   * push("relative"); // "/home/root" -> "/home/relative"
+   *
+   * @example Pushing query parameters.
+   * push("/absolute?my-param=1"); // "/home" -> "/absolute?my-param=1"
+   * push("relative?my-param=1"); // "/home/root" -> "/home/relative?my-param=1"
+   * push("?my-param=1"); // "/home" -> "/home?my-param=1"
+   *
+   * @example Pushing hash.
+   * push("#my-hash"); // "/home" -> "/home#my-hash"
+   * push("johny#my-hash"); // "/home/root" -> "/home/johny#my-hash"
+   */
+  push(t) {
+    this.entriesCursor !== this.entries.length - 1 && this.entries.splice(this.entriesCursor + 1);
+    const e = this.formatEntry(t), n = this.entry;
+    this.entriesCursor += 1, this.entries[this.entriesCursor] = e;
+    const s = this.entry;
+    return this.logger.log("State changed", { before: n, after: s }), this.performPush({
+      before: n,
+      after: s
+    });
+  }
+  /**
+   * Current full path including pathname, query parameters and hash.
    */
-  sendData(t) {
-    const { size: e } = new Blob([t]);
-    if (e === 0 || e > 4096)
-      throw new Error(`Passed data has incorrect size: ${e}`);
-    this.postEvent("web_app_data_send", { data: t });
+  get path() {
+    return `${this.pathname}${this.search}${this.hash}`;
   }
   /**
-   * Updates current application header color.
-   * FIXME: Has no effect on desktop, works incorrectly on Android.
-   *  Issues:
-   *  https://github.com/Telegram-Mini-Apps/tma.js/issues/9
-   *  https://github.com/Telegram-Mini-Apps/tma.js/issues/8
-   * @param color - color key or RGB color.
+   * Current pathname.
+   * @example
+   * "/", "/abc"
    */
-  setHeaderColor(t) {
-    this.postEvent("web_app_set_header_color", pt(t) ? { color: t } : { color_key: t }), this.state.set("headerColor", t);
+  get pathname() {
+    return this.entry.pathname;
   }
   /**
-   * Updates current application background color.
-   * FIXME: Has no effect on desktop, works incorrectly in Android.
-   *  Issues:
-   *  https://github.com/Telegram-Mini-Apps/tma.js/issues/9
-   *  https://github.com/Telegram-Mini-Apps/tma.js/issues/8
-   * @param color - RGB color.
+   * Replaces current entry. Has the same logic as `push` method.
+   * @param entry - entry data.
+   * @see push
+   * @returns True if changes were done.
    */
-  setBackgroundColor(t) {
-    this.postEvent("web_app_set_background_color", { color: t }), this.state.set("backgroundColor", t);
+  replace(t) {
+    const e = this.formatEntry(t);
+    if (this.search === e.search && this.pathname === e.pathname && this.hash === e.hash)
+      return this.performReplace({
+        updated: !1,
+        entry: e
+      });
+    const n = this.entry;
+    this.entries[this.entriesCursor] = e;
+    const s = this.entry;
+    return this.logger.log("State changed", { before: n, after: s }), this.performReplace({
+      updated: !0,
+      before: n,
+      after: s
+    });
   }
   /**
-   * Current Mini App version. This property is used by other components to check if
-   * some functionality is available on current device.
+   * Current query parameters.
+   * @example
+   * "", "?", "?a=1"
    */
-  get version() {
-    return this.currentVersion;
+  get search() {
+    return this.entry.search;
   }
 }
-class K extends Error {
-  constructor(t, e) {
-    super(`Method "${t}" is not supported in the Mini Apps version ${e}.`), Object.setPrototypeOf(this, K.prototype);
+const at = 0, J = 1, Q = 2;
+class Lt extends Ke {
+  constructor(e, n, s = {}) {
+    super(e, n, {
+      ...s,
+      loggerPrefix: "HashNavigator"
+    });
+    o(this, "ee", new w());
+    o(this, "attached", !1);
+    /**
+     * Handles window "popstate" event.
+     * @param state - event state.
+     */
+    o(this, "onPopState", async ({ state: e }) => {
+      if (this.logger.log('"popstate" event received. State:', e), e === null)
+        return this.push(window.location.hash.slice(1));
+      if (e === at) {
+        this.logger.log("Void reached. Moving history forward"), window.history.forward();
+        return;
+      }
+      if (e === J)
+        return this.back();
+      if (e === Q)
+        return this.forward();
+    });
+    o(this, "back", () => super.back());
+    /**
+     * Adds new event listener.
+     */
+    o(this, "on", this.ee.on.bind(this.ee));
+    /**
+     * Removes event listener.
+     */
+    o(this, "off", this.ee.off.bind(this.ee));
   }
-}
-class j extends Error {
-  constructor(t, e, r) {
-    super(`Parameter "${e}" in method "${t}" is not supported in the Mini Apps version ${r}.`), Object.setPrototypeOf(this, j.prototype);
+  /**
+   * Creates navigator from current window location hash.
+   * @param options - options passed to constructor.
+   */
+  static fromLocation(e) {
+    const {
+      search: n,
+      pathname: s,
+      hash: i
+    } = new URL(
+      window.location.hash.slice(1),
+      window.location.href
+    );
+    return new Lt([{ search: n, pathname: s, hash: i }], 0, e);
   }
-}
-function F(s, t) {
-  document.documentElement.style.setProperty(s, t);
-}
-function B(s, t) {
-  t !== null && F(s, t);
-}
-function M(s, t) {
-  F(s, `${t}px`);
-}
-function St(s, t) {
-  const { backgroundColor: e, secondaryBackgroundColor: r } = t, { backgroundColor: o, headerColor: n } = s;
-  B("--tg-bg-color", o), B("--tg-header-color", n === "bg_color" ? e : r);
-}
-function Vt(s) {
-  const t = () => {
-    const e = s.getState();
-    Object.entries(e).forEach(([r, o]) => {
-      const n = r.replace(/[A-Z]/g, (a) => `-${a.toLowerCase()}`);
-      B(`--tg-theme-${n}`, o || null);
+  async performGo(e) {
+    e.updated && (this.attached && await this.syncHistory(), this.emitChanged(e.before, e.after));
+  }
+  async performPush({ before: e, after: n }) {
+    this.attached && await this.syncHistory(), this.emitChanged(e, n);
+  }
+  async performReplace(e) {
+    e.updated && (this.attached && window.history.replaceState(null, "", `#${this.path}`), this.emitChanged(e.before, e.after));
+  }
+  /**
+   * Synchronizes current navigator state with browser history.
+   */
+  async syncHistory() {
+    window.removeEventListener("popstate", this.onPopState);
+    const e = `#${this.path}`;
+    await Ze(), f("web_app_setup_back_button", { is_visible: this.canGoBack }), this.canGoBack && this.canGoForward ? (this.logger.log("Setting up history: [<-, *, ->]"), window.history.replaceState(J, ""), window.history.pushState(null, "", e), window.history.pushState(Q, ""), await B(-1)) : this.canGoBack ? (this.logger.log("Setting up history: [<-, *]"), window.history.replaceState(J, ""), window.history.pushState(null, "", e)) : this.canGoForward ? (this.logger.log("Setting up history: [*, ->]"), window.history.replaceState(null, e), window.history.pushState(Q, ""), await B(-1)) : (this.logger.log("Setting up history: [~, *]"), window.history.replaceState(at, ""), window.history.pushState(null, "", e)), window.addEventListener("popstate", this.onPopState);
+  }
+  emitChanged(e, n) {
+    this.ee.emit("change", {
+      navigator: this,
+      from: e,
+      to: n
     });
-  };
-  s.on("changed", t), t();
-}
-function Pt(s, t) {
-  const e = () => St(s, t);
-  t.on("changed", e), s.on("backgroundColorChanged", e), s.on("headerColorChanged", e), e();
-}
-function qt(s) {
-  const t = () => {
-    M("--tg-viewport-height", s.height);
-  }, e = () => {
-    M("--tg-viewport-stable-height", s.stableHeight);
-  };
-  s.on("heightChanged", t), s.on("stableHeightChanged", e), t(), e();
-}
-function Ot(s) {
-  return typeof s == "boolean" ? s ? { themeParams: !0, viewport: !0, webApp: !0 } : {} : s;
-}
-function J(s) {
-  return `telegram-mini-apps-${s}`;
-}
-function k(s, t) {
-  sessionStorage.setItem(J(s), JSON.stringify(t));
-}
-function x(s) {
-  const t = sessionStorage.getItem(J(s));
-  return t ? JSON.parse(t) : null;
-}
-function Tt(s, t, e) {
-  const { isVisible: r = !1 } = s ? x("back-button") || {} : {}, o = new _t(r, t, e);
-  return o.on("isVisibleChanged", () => {
-    k("back-button", { isVisible: o.isVisible });
-  }), o;
-}
-function Bt(s, t) {
-  const { isConfirmationNeeded: e = !1 } = s ? x("closing-behavior") || {} : {}, r = new bt(e, t);
-  return r.on("isConfirmationNeededChanged", () => k("closing-behavior", {
-    isConfirmationNeeded: r.isConfirmationNeeded
-  })), r;
-}
-function $t(s, t, e, r) {
-  const {
-    backgroundColor: o = t,
-    isEnabled: n = !1,
-    isVisible: a = !1,
-    isProgressVisible: u = !1,
-    textColor: c = e,
-    text: p = ""
-  } = s ? x("main-button") || {} : {}, h = new vt(
-    o,
-    n,
-    a,
-    u,
-    p,
-    c,
-    r
-  ), d = () => k("main-button", {
-    backgroundColor: h.backgroundColor,
-    isEnabled: h.isEnabled,
-    isVisible: h.isVisible,
-    isProgressVisible: h.isProgressVisible,
-    text: h.text,
-    textColor: h.textColor
-  });
-  return h.on("backgroundColorChanged", d), h.on("isEnabledChanged", d), h.on("isVisibleChanged", d), h.on("isProgressVisibleChanged", d), h.on("textColorChanged", d), h.on("textChanged", d), h;
-}
-function It() {
-  let s = 0;
-  return () => (s += 1, s.toString());
-}
-function At(s) {
-  const t = new V(s);
-  return V.sync(t), t;
-}
-async function Ht(s, t, e) {
-  const {
-    height: r = window.innerHeight,
-    stableHeight: o = window.innerHeight,
-    width: n = window.innerWidth,
-    isExpanded: a = !1
-  } = s ? x("viewport") || {} : {}, c = t === "macos" || t === "web" ? (() => {
-    const h = new y(r, n, o, a, e);
-    return y.sync(h), h;
-  })() : await y.synced({ postEvent: e }), p = () => k("viewport", {
-    height: c.height,
-    isExpanded: c.isExpanded,
-    stableHeight: c.stableHeight,
-    width: c.width
-  });
-  return c.on("heightChanged", p), c.on("isExpandedChanged", p), c.on("stableHeightChanged", p), c.on("widthChanged", p), c;
-}
-function Rt(s, t, e, r, o, n) {
-  const {
-    backgroundColor: a = t,
-    headerColor: u = "bg_color"
-  } = s ? x("web-app") || {} : {}, c = new xt(
-    u,
-    a,
-    e,
-    r,
-    o,
-    n
-  ), p = () => k("web-app", {
-    backgroundColor: c.backgroundColor,
-    headerColor: c.headerColor
-  });
-  return c.on("backgroundColorChanged", p), c.on("headerColorChanged", p), c;
-}
-async function Dt(s = {}) {
-  const {
-    checkCompat: t = !0,
-    cssVars: e = !1,
-    acceptScrollbarStyle: r = !0,
-    acceptCustomStyles: o = r,
-    targetOrigin: n,
-    launchParams: a,
-    debug: u = !1
-  } = s;
-  u && nt(u), typeof n == "string" && it(n);
-  const { launchParams: c, isPageReload: p } = N({
-    currentLaunchParams: typeof a == "string" || a instanceof URLSearchParams ? ot(a) : a
-  }), {
-    initData: h,
-    initDataRaw: d,
-    version: w,
-    platform: $,
-    themeParams: I
-  } = c, {
-    backgroundColor: G = "#ffffff",
-    buttonColor: Q = "#000000",
-    buttonTextColor: Z = "#ffffff"
-  } = I, A = It(), l = t ? at(w) : g, P = At(I), H = Rt(
-    p,
-    G,
-    w,
-    $,
-    A,
-    l
-  ), {
-    themeParams: X,
-    viewport: Y,
-    webApp: tt
-  } = Ot(e);
-  tt && Pt(H, P), X && Vt(P);
-  const R = await Ht(p, $, l);
-  if (Y && qt(R), o && ct()) {
-    const C = document.createElement("style");
-    C.id = "telegram-custom-styles", document.head.appendChild(C), E("set_custom_style", (O) => {
-      C.innerHTML = O;
-    }), l("iframe_ready");
-  }
-  const q = {
-    backButton: Tt(p, w, l),
-    closingBehavior: Bt(p, l),
-    cloudStorage: new wt(w, A, l),
-    haptic: new mt(w, l),
-    mainButton: $t(p, Q, Z, l),
-    popup: new Et(w, l),
-    postEvent: l,
-    qrScanner: new kt(w, l),
-    themeParams: P,
-    viewport: R,
-    webApp: H
-  };
-  if (h !== void 0) {
-    const { authDate: C, hash: O, ...et } = h;
-    q.initData = new Ct(C, O, et), q.initDataRaw = d;
   }
-  return q;
-}
-function Jt(s = {}) {
-  return dt(Dt(s), s.timeout || 1e3);
-}
-function Lt() {
-  try {
-    return N(), !0;
-  } catch {
-    return !1;
+  /**
+   * Attaches current navigator to the browser history allowing navigator to manipulate it.
+   */
+  async attach() {
+    if (!this.attached)
+      return this.logger.log("Attaching", this), this.attached = !0, k("back_button_pressed", this.back), this.syncHistory();
+  }
+  /**
+   * Detaches current navigator from the browser history.
+   */
+  detach() {
+    this.attached && (this.logger.log("Detaching", this), this.attached = !1, window.removeEventListener("popstate", this.onPopState), N("back_button_pressed", this.back));
   }
-}
-function Gt() {
-  return Lt();
 }
 export {
-  _t as BackButton,
-  bt as ClosingBehaviour,
-  wt as CloudStorage,
-  mt as HapticFeedback,
-  Ct as InitData,
-  vt as MainButton,
-  K as MethodNotSupportedError,
-  j as ParameterUnsupportedError,
-  Et as Popup,
-  kt as QRScanner,
-  V as ThemeParams,
-  y as Viewport,
-  xt as WebApp,
-  T as formatURL,
-  Jt as init,
-  Lt as isTMA,
-  Gt as isTWA
+  ve as BackButton,
+  xe as ClosingBehavior,
+  Ae as CloudStorage,
+  qe as HapticFeedback,
+  Lt as HashNavigator,
+  Mt as InitData,
+  Ge as Invoice,
+  Te as MainButton,
+  K as MethodUnsupportedError,
+  Re as MiniApp,
+  Ke as Navigator,
+  Y as ParameterUnsupportedError,
+  ze as Popup,
+  Je as QRScanner,
+  zt as ThemeParams,
+  Qe as Utils,
+  j as Viewport,
+  Wt as chatParser,
+  ke as classNames,
+  ye as compareVersions,
+  Ee as createPostEvent,
+  cr as getHash,
+  ar as init,
+  gt as initDataParser,
+  lt as isColorDark,
+  Ct as isIframe,
+  ut as isRGB,
+  Nt as isRGBShort,
+  D as isRecord,
+  er as isTMA,
+  bt as launchParamsParser,
+  or as mergeClassNames,
+  N as off,
+  k as on,
+  sr as once,
+  Xe as parseInitData,
+  mt as parseLaunchParams,
+  _t as parseThemeParams,
+  f as postEvent,
+  _ as request,
+  tr as requestThemeParams,
+  Pt as requestViewport,
+  Et as retrieveLaunchData,
+  Kt as serializeLaunchParams,
+  Ft as serializeThemeParams,
+  rr as setDebug,
+  nr as setTargetOrigin,
+  ir as subscribe,
+  q as supports,
+  wt as themeParamsParser,
+  pt as toRGB,
+  me as unsubscribe,
+  tt as userParser
 };
 //# sourceMappingURL=index.mjs.map