@bagisto-native/core 1.0.0

package/dist/index.cjs

@@ -0,0 +1,211 @@
+'use strict';
+
+// src/components/hotwire-toast.ts
+exports.HotwireToast = void 0;
+if (typeof window !== "undefined") {
+  class ToastClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--toast");
+      this.setAttribute("data-action", "click->bridge--toast#show");
+      this.addEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+      this.removeEventListener("click", this.handleClick);
+    }
+  }
+  if (!customElements.get("hotwire-toast")) {
+    customElements.define("hotwire-toast", ToastClass);
+  }
+  exports.HotwireToast = ToastClass;
+}
+
+// src/components/dynamic-button.ts
+exports.DynamicButton = void 0;
+if (typeof window !== "undefined") {
+  class DynamicButtonClass extends HTMLElement {
+    static get observedAttributes() {
+      return ["data-page-type"];
+    }
+    constructor() {
+      super();
+    }
+    connectedCallback() {
+      this.type = "button";
+      this.setAttribute("data-controller", "bridge--dynamicbutton");
+    }
+    attributeChangedCallback(name, oldVal, newVal) {
+    }
+    disconnectedCallback() {
+    }
+  }
+  if (typeof window !== "undefined" && !customElements.get("dynamic-button")) {
+    customElements.define("dynamic-button", DynamicButtonClass);
+  }
+  exports.DynamicButton = DynamicButtonClass;
+}
+
+// src/components/hotwire-location.ts
+exports.HotwireLocation = void 0;
+if (typeof window !== "undefined") {
+  class LocationClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--location");
+      this.addEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+      this.removeEventListener("click", this.handleClick);
+    }
+  }
+  if (!customElements.get("hotwire-location")) {
+    customElements.define("hotwire-location", LocationClass);
+  }
+  exports.HotwireLocation = LocationClass;
+}
+
+// src/components/hotwire-search.ts
+exports.HotwireSearch = void 0;
+if (typeof window !== "undefined") {
+  class HotwireSearchClass extends HTMLElement {
+    constructor() {
+      super();
+    }
+    connectedCallback() {
+      this.innerHTML = "";
+      const p = document.createElement("p");
+      p.setAttribute("data-controller", "bridge--search");
+      p.setAttribute("data-action", "input->bridge--search#handleInput");
+      p.style.display = "none";
+      p.appendChild(document.createTextNode("Search Form"));
+      const resultsDiv = document.createElement("div");
+      resultsDiv.setAttribute("data-bridge--search-target", "results");
+      p.appendChild(resultsDiv);
+      this.appendChild(p);
+    }
+    disconnectedCallback() {
+    }
+  }
+  if (!customElements.get("hotwire-search")) {
+    customElements.define("hotwire-search", HotwireSearchClass);
+  }
+  exports.HotwireSearch = HotwireSearchClass;
+}
+
+// src/components/hotwire-history-sync.ts
+exports.HotwireHistorySync = void 0;
+if (typeof window !== "undefined") {
+  class HistorySyncClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--historysync");
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+    }
+  }
+  if (!customElements.get("hotwire-history-sync")) {
+    customElements.define("hotwire-history-sync", HistorySyncClass);
+  }
+  exports.HotwireHistorySync = HistorySyncClass;
+}
+
+// src/components/hotwire-theme-mode.ts
+exports.HotwireThemeMode = void 0;
+if (typeof window !== "undefined") {
+  class ThemeModeClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--thememode");
+      this.setAttribute("data-action", "click->bridge--thememode#handleClick");
+      this.addEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+      this.removeEventListener("click", this.handleClick);
+    }
+  }
+  if (!customElements.get("hotwire-theme-mode")) {
+    customElements.define("hotwire-theme-mode", ThemeModeClass);
+  }
+  exports.HotwireThemeMode = ThemeModeClass;
+}
+
+// src/utils/utils.ts
+function isTurboNativeUserAgent(userAgent) {
+  if (!userAgent && typeof navigator !== "undefined") {
+    userAgent = navigator.userAgent;
+  }
+  userAgent = userAgent || "";
+  return userAgent.includes("Turbo Native");
+}
+function triggerHotwireNativeToast(message) {
+  if (typeof document === "undefined") return;
+  const nativeToasts = document.querySelectorAll(
+    "[data-controller='bridge--toast']"
+  );
+  if (nativeToasts.length > 0) {
+    nativeToasts[0].setAttribute("data-bridge-message", message);
+    nativeToasts[0].click();
+  }
+}
+function triggerHistorySyncEvent(url) {
+  if (typeof document === "undefined") return;
+  const hotwireElements = document.querySelectorAll(
+    "[data-controller='bridge--historysync']"
+  );
+  if (hotwireElements.length > 0) {
+    hotwireElements[0].dispatchEvent(new CustomEvent("turbo:next-history-sync", {
+      detail: url,
+      bubbles: true
+    }));
+  }
+}
+function triggerThemeModeEvent(theme) {
+  if (typeof document === "undefined") return;
+  const themeModeBtns = document.querySelectorAll(
+    '[data-controller="bridge--thememode"]'
+  );
+  if (themeModeBtns.length > 0) {
+    themeModeBtns[0].dataset.bridgeMode = theme;
+    themeModeBtns[0].click();
+  }
+}
+function triggerCartCountValue(cartcount) {
+  if (typeof document === "undefined") return;
+  const nativeButton = document.querySelectorAll(
+    "[data-controller='bridge--dynamicbutton'][data-action='click->bridge--dynamicbutton#sendCartCount']"
+  );
+  if (nativeButton.length > 0) {
+    nativeButton[0].setAttribute("data-bridge-cartcount", cartcount.toString());
+    nativeButton[0].click();
+  }
+}
+
+exports.isTurboNativeUserAgent = isTurboNativeUserAgent;
+exports.triggerCartCountValue = triggerCartCountValue;
+exports.triggerHistorySyncEvent = triggerHistorySyncEvent;
+exports.triggerHotwireNativeToast = triggerHotwireNativeToast;
+exports.triggerThemeModeEvent = triggerThemeModeEvent;

package/dist/index.d.cts

@@ -0,0 +1,127 @@
+declare let HotwireToast: typeof HTMLElement | undefined;
+
+declare let DynamicButton: typeof HTMLElement | undefined;
+
+declare let HotwireLocation: typeof HTMLElement | undefined;
+
+declare let HotwireSearch: typeof HTMLElement | undefined;
+
+declare let HotwireHistorySync: typeof HTMLElement | undefined;
+
+declare let HotwireThemeMode: typeof HTMLElement | undefined;
+
+interface FrameworkDelegate {
+  attachViewToDom(
+    container: any,
+    component: any,
+    propsOrDataObj?: any,
+    cssClasses?: string[]
+  ): Promise<HTMLElement>;
+  removeViewFromDom(container: any, component: any): Promise<void>;
+}
+
+declare global {
+  namespace JSX {
+    interface IntrinsicElements {
+      'dynamic-button': Partial<HTMLElementTagNameMap['button']> & {
+        'data-action'?: string;
+        'data-page-type'?: string;
+      };
+      'hotwire-toast': Partial<HTMLElementTagNameMap['button']> & {
+        'data-bridge-message'?: string;
+      };
+      'hotwire-location': Partial<HTMLElementTagNameMap['button']>;
+      'hotwire-search': Partial<HTMLElementTagNameMap['p']> & {
+        'data-controller'?: string;
+        'data-action'?: string;
+        'data-bridge--search-target'?: string;
+      };
+      'hotwire-history-sync': Partial<HTMLElementTagNameMap['button']>;
+      'hotwire-theme-mode': Partial<HTMLElementTagNameMap['button']> & {
+        'data-bridge-mode'?: string;
+      };
+    }
+  }
+
+  interface HTMLElementTagNameMap {
+    'dynamic-button': HTMLElement;
+    'hotwire-toast': HTMLElement;
+    'hotwire-location': HTMLElement;
+    'hotwire-search': HTMLElement;
+    'hotwire-history-sync': HTMLElement;
+    'hotwire-theme-mode': HTMLElement;
+  }
+}
+
+/**
+ * Check the turbo native user agent is present or not. (Hotwire)
+ * Function call from server components : isTurboNativeUserAgent(req.headers['user-agent']) or isTurboNativeUserAgent(useragent) where you have to find and send the useragent manually (ex. Next js Server Component);
+ * Function call from client components : isTurboNativeUserAgent();
+ * @param userAgent
+ * @returns
+ */
+declare function isTurboNativeUserAgent(userAgent?: string): boolean;
+/**
+ * Triggers a native Hotwire toast message in the DOM.
+ *
+ * This function searches for the first element in the document
+ * that uses the Stimulus controller `bridge--toast`. If found,
+ * it updates its `data-bridge-message` attribute with the provided
+ * message and simulates a click event to display the toast.
+ *
+ * This utility is useful for programmatically invoking toasts from
+ * anywhere in your application (e.g., after form submissions or API actions).
+ *
+ * @function triggerHotwireNativeToast
+ * @param {string} message - The message text to display in the toast.
+ * @example
+ * // Trigger a simple toast notification
+ * TriggerHotwireNativeToast("Profile updated successfully!");
+ *
+ * @remarks
+ * The function safely checks for the presence of the `document` object,
+ * so it can be called in both browser and server environments.
+ */
+declare function triggerHotwireNativeToast(message: string): void;
+/**
+ * Dispatches a custom Turbo history sync event to the first
+ * `bridge--historysync` controller found in the DOM.
+ *
+ * This is used to notify the native / Hotwire bridge that the
+ * browser history should be synchronized with the given URL.
+ *
+ * The event name dispatched is `turbo:next-history-sync` and it
+ * bubbles up the DOM tree.
+ *
+ * @param url - A `URL` object representing the next location
+ * to be synced with Turbo / native navigation.
+ */
+declare function triggerHistorySyncEvent(url: URL): void;
+/**
+ * Triggers the Theme Mode bridge event by programmatically clicking
+ * the hidden theme mode button in the DOM.
+ *
+ * This function updates the `data-bridge-mode` attribute on the button
+ * and dispatches a click event so the native bridge can react.
+ *
+* @param theme - The theme mode to apply.
+ * Must be either `"dark"` or `"light"`.
+ */
+declare function triggerThemeModeEvent(theme: string): void;
+/**
+ * Triggers a native cart count update via the Hotwire bridge.
+ *
+ * This function:
+ * - Finds the first DOM element wired with the Hotwire Dynamic Button controller
+ *   responsible for sending cart count data to the native app.
+ * - Sets the `data-bridge-cartcount` attribute with the provided cart count.
+ * - Programmatically triggers a click event to notify the native layer.
+ *
+ * The function safely exits when executed in a non-browser environment
+ * (e.g., during server-side rendering).
+ *
+ * @param {number} cartcount - The total number of items in the cart
+ */
+declare function triggerCartCountValue(cartcount: number): void;
+
+export { DynamicButton, type FrameworkDelegate, HotwireHistorySync, HotwireLocation, HotwireSearch, HotwireThemeMode, HotwireToast, isTurboNativeUserAgent, triggerCartCountValue, triggerHistorySyncEvent, triggerHotwireNativeToast, triggerThemeModeEvent };

package/dist/index.d.ts

@@ -0,0 +1,127 @@
+declare let HotwireToast: typeof HTMLElement | undefined;
+
+declare let DynamicButton: typeof HTMLElement | undefined;
+
+declare let HotwireLocation: typeof HTMLElement | undefined;
+
+declare let HotwireSearch: typeof HTMLElement | undefined;
+
+declare let HotwireHistorySync: typeof HTMLElement | undefined;
+
+declare let HotwireThemeMode: typeof HTMLElement | undefined;
+
+interface FrameworkDelegate {
+  attachViewToDom(
+    container: any,
+    component: any,
+    propsOrDataObj?: any,
+    cssClasses?: string[]
+  ): Promise<HTMLElement>;
+  removeViewFromDom(container: any, component: any): Promise<void>;
+}
+
+declare global {
+  namespace JSX {
+    interface IntrinsicElements {
+      'dynamic-button': Partial<HTMLElementTagNameMap['button']> & {
+        'data-action'?: string;
+        'data-page-type'?: string;
+      };
+      'hotwire-toast': Partial<HTMLElementTagNameMap['button']> & {
+        'data-bridge-message'?: string;
+      };
+      'hotwire-location': Partial<HTMLElementTagNameMap['button']>;
+      'hotwire-search': Partial<HTMLElementTagNameMap['p']> & {
+        'data-controller'?: string;
+        'data-action'?: string;
+        'data-bridge--search-target'?: string;
+      };
+      'hotwire-history-sync': Partial<HTMLElementTagNameMap['button']>;
+      'hotwire-theme-mode': Partial<HTMLElementTagNameMap['button']> & {
+        'data-bridge-mode'?: string;
+      };
+    }
+  }
+
+  interface HTMLElementTagNameMap {
+    'dynamic-button': HTMLElement;
+    'hotwire-toast': HTMLElement;
+    'hotwire-location': HTMLElement;
+    'hotwire-search': HTMLElement;
+    'hotwire-history-sync': HTMLElement;
+    'hotwire-theme-mode': HTMLElement;
+  }
+}
+
+/**
+ * Check the turbo native user agent is present or not. (Hotwire)
+ * Function call from server components : isTurboNativeUserAgent(req.headers['user-agent']) or isTurboNativeUserAgent(useragent) where you have to find and send the useragent manually (ex. Next js Server Component);
+ * Function call from client components : isTurboNativeUserAgent();
+ * @param userAgent
+ * @returns
+ */
+declare function isTurboNativeUserAgent(userAgent?: string): boolean;
+/**
+ * Triggers a native Hotwire toast message in the DOM.
+ *
+ * This function searches for the first element in the document
+ * that uses the Stimulus controller `bridge--toast`. If found,
+ * it updates its `data-bridge-message` attribute with the provided
+ * message and simulates a click event to display the toast.
+ *
+ * This utility is useful for programmatically invoking toasts from
+ * anywhere in your application (e.g., after form submissions or API actions).
+ *
+ * @function triggerHotwireNativeToast
+ * @param {string} message - The message text to display in the toast.
+ * @example
+ * // Trigger a simple toast notification
+ * TriggerHotwireNativeToast("Profile updated successfully!");
+ *
+ * @remarks
+ * The function safely checks for the presence of the `document` object,
+ * so it can be called in both browser and server environments.
+ */
+declare function triggerHotwireNativeToast(message: string): void;
+/**
+ * Dispatches a custom Turbo history sync event to the first
+ * `bridge--historysync` controller found in the DOM.
+ *
+ * This is used to notify the native / Hotwire bridge that the
+ * browser history should be synchronized with the given URL.
+ *
+ * The event name dispatched is `turbo:next-history-sync` and it
+ * bubbles up the DOM tree.
+ *
+ * @param url - A `URL` object representing the next location
+ * to be synced with Turbo / native navigation.
+ */
+declare function triggerHistorySyncEvent(url: URL): void;
+/**
+ * Triggers the Theme Mode bridge event by programmatically clicking
+ * the hidden theme mode button in the DOM.
+ *
+ * This function updates the `data-bridge-mode` attribute on the button
+ * and dispatches a click event so the native bridge can react.
+ *
+* @param theme - The theme mode to apply.
+ * Must be either `"dark"` or `"light"`.
+ */
+declare function triggerThemeModeEvent(theme: string): void;
+/**
+ * Triggers a native cart count update via the Hotwire bridge.
+ *
+ * This function:
+ * - Finds the first DOM element wired with the Hotwire Dynamic Button controller
+ *   responsible for sending cart count data to the native app.
+ * - Sets the `data-bridge-cartcount` attribute with the provided cart count.
+ * - Programmatically triggers a click event to notify the native layer.
+ *
+ * The function safely exits when executed in a non-browser environment
+ * (e.g., during server-side rendering).
+ *
+ * @param {number} cartcount - The total number of items in the cart
+ */
+declare function triggerCartCountValue(cartcount: number): void;
+
+export { DynamicButton, type FrameworkDelegate, HotwireHistorySync, HotwireLocation, HotwireSearch, HotwireThemeMode, HotwireToast, isTurboNativeUserAgent, triggerCartCountValue, triggerHistorySyncEvent, triggerHotwireNativeToast, triggerThemeModeEvent };

package/dist/index.js

@@ -0,0 +1,205 @@
+// src/components/hotwire-toast.ts
+var HotwireToast;
+if (typeof window !== "undefined") {
+  class ToastClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--toast");
+      this.setAttribute("data-action", "click->bridge--toast#show");
+      this.addEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+      this.removeEventListener("click", this.handleClick);
+    }
+  }
+  if (!customElements.get("hotwire-toast")) {
+    customElements.define("hotwire-toast", ToastClass);
+  }
+  HotwireToast = ToastClass;
+}
+
+// src/components/dynamic-button.ts
+var DynamicButton;
+if (typeof window !== "undefined") {
+  class DynamicButtonClass extends HTMLElement {
+    static get observedAttributes() {
+      return ["data-page-type"];
+    }
+    constructor() {
+      super();
+    }
+    connectedCallback() {
+      this.type = "button";
+      this.setAttribute("data-controller", "bridge--dynamicbutton");
+    }
+    attributeChangedCallback(name, oldVal, newVal) {
+    }
+    disconnectedCallback() {
+    }
+  }
+  if (typeof window !== "undefined" && !customElements.get("dynamic-button")) {
+    customElements.define("dynamic-button", DynamicButtonClass);
+  }
+  DynamicButton = DynamicButtonClass;
+}
+
+// src/components/hotwire-location.ts
+var HotwireLocation;
+if (typeof window !== "undefined") {
+  class LocationClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--location");
+      this.addEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+      this.removeEventListener("click", this.handleClick);
+    }
+  }
+  if (!customElements.get("hotwire-location")) {
+    customElements.define("hotwire-location", LocationClass);
+  }
+  HotwireLocation = LocationClass;
+}
+
+// src/components/hotwire-search.ts
+var HotwireSearch;
+if (typeof window !== "undefined") {
+  class HotwireSearchClass extends HTMLElement {
+    constructor() {
+      super();
+    }
+    connectedCallback() {
+      this.innerHTML = "";
+      const p = document.createElement("p");
+      p.setAttribute("data-controller", "bridge--search");
+      p.setAttribute("data-action", "input->bridge--search#handleInput");
+      p.style.display = "none";
+      p.appendChild(document.createTextNode("Search Form"));
+      const resultsDiv = document.createElement("div");
+      resultsDiv.setAttribute("data-bridge--search-target", "results");
+      p.appendChild(resultsDiv);
+      this.appendChild(p);
+    }
+    disconnectedCallback() {
+    }
+  }
+  if (!customElements.get("hotwire-search")) {
+    customElements.define("hotwire-search", HotwireSearchClass);
+  }
+  HotwireSearch = HotwireSearchClass;
+}
+
+// src/components/hotwire-history-sync.ts
+var HotwireHistorySync;
+if (typeof window !== "undefined") {
+  class HistorySyncClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--historysync");
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+    }
+  }
+  if (!customElements.get("hotwire-history-sync")) {
+    customElements.define("hotwire-history-sync", HistorySyncClass);
+  }
+  HotwireHistorySync = HistorySyncClass;
+}
+
+// src/components/hotwire-theme-mode.ts
+var HotwireThemeMode;
+if (typeof window !== "undefined") {
+  class ThemeModeClass extends HTMLElement {
+    constructor() {
+      super();
+      this.handleClick = this.handleClick.bind(this);
+    }
+    connectedCallback() {
+      this.setAttribute("role", "button");
+      this.setAttribute("data-controller", "bridge--thememode");
+      this.setAttribute("data-action", "click->bridge--thememode#handleClick");
+      this.addEventListener("click", this.handleClick);
+    }
+    handleClick(e) {
+    }
+    disconnectedCallback() {
+      this.removeEventListener("click", this.handleClick);
+    }
+  }
+  if (!customElements.get("hotwire-theme-mode")) {
+    customElements.define("hotwire-theme-mode", ThemeModeClass);
+  }
+  HotwireThemeMode = ThemeModeClass;
+}
+
+// src/utils/utils.ts
+function isTurboNativeUserAgent(userAgent) {
+  if (!userAgent && typeof navigator !== "undefined") {
+    userAgent = navigator.userAgent;
+  }
+  userAgent = userAgent || "";
+  return userAgent.includes("Turbo Native");
+}
+function triggerHotwireNativeToast(message) {
+  if (typeof document === "undefined") return;
+  const nativeToasts = document.querySelectorAll(
+    "[data-controller='bridge--toast']"
+  );
+  if (nativeToasts.length > 0) {
+    nativeToasts[0].setAttribute("data-bridge-message", message);
+    nativeToasts[0].click();
+  }
+}
+function triggerHistorySyncEvent(url) {
+  if (typeof document === "undefined") return;
+  const hotwireElements = document.querySelectorAll(
+    "[data-controller='bridge--historysync']"
+  );
+  if (hotwireElements.length > 0) {
+    hotwireElements[0].dispatchEvent(new CustomEvent("turbo:next-history-sync", {
+      detail: url,
+      bubbles: true
+    }));
+  }
+}
+function triggerThemeModeEvent(theme) {
+  if (typeof document === "undefined") return;
+  const themeModeBtns = document.querySelectorAll(
+    '[data-controller="bridge--thememode"]'
+  );
+  if (themeModeBtns.length > 0) {
+    themeModeBtns[0].dataset.bridgeMode = theme;
+    themeModeBtns[0].click();
+  }
+}
+function triggerCartCountValue(cartcount) {
+  if (typeof document === "undefined") return;
+  const nativeButton = document.querySelectorAll(
+    "[data-controller='bridge--dynamicbutton'][data-action='click->bridge--dynamicbutton#sendCartCount']"
+  );
+  if (nativeButton.length > 0) {
+    nativeButton[0].setAttribute("data-bridge-cartcount", cartcount.toString());
+    nativeButton[0].click();
+  }
+}
+
+export { DynamicButton, HotwireHistorySync, HotwireLocation, HotwireSearch, HotwireThemeMode, HotwireToast, isTurboNativeUserAgent, triggerCartCountValue, triggerHistorySyncEvent, triggerHotwireNativeToast, triggerThemeModeEvent };