@kelviq/js-promotions-ui 0.0.1

package/src/utils.ts

@@ -0,0 +1,146 @@
+import { DefaultConfig } from "./types";
+
+export const DEFAULT_CONFIG: DefaultConfig = {
+  showBanner: true,
+  localizePricing: true,
+  currencyDisplay: "symbol",
+  baseCurrencySymbol: "$",
+  baseCurrencyCode: "USD",
+  environment: "production",
+  showDecimal: false,
+  minimumDecimalDigits: 2,
+  maximumDecimalDigits: 2,
+  isOriginalDisplay: false,
+  banner: {},
+};
+
+export type CurrencyFormatStyle = "standard" | "compact";
+
+export type CurrencyDisplay = "symbol" | "code" | "name";
+
+interface FormatCurrencyOptions {
+  amount: number;
+  currency: string;
+  locale?: string;
+  currencyDisplay?: "symbol" | "code" | "name";
+  formatStyle?: CurrencyFormatStyle;
+  minimumFractionDigits?: number;
+  maximumFractionDigits?: number;
+}
+
+interface FormatCurrencyResult {
+  formatted: string;
+  integer: string;
+  decimal: string;
+  decimalSeparator: string;
+  thousandsSeparator: string;
+}
+
+const STRIPE_ZERO_DECIMAL_CURRENCIES = new Set([
+  "BIF",
+  "CLP",
+  "DJF",
+  "GNF",
+  "JPY",
+  "KMF",
+  "KRW",
+  "MGA",
+  "PYG",
+  "RWF",
+  "UGX",
+  "VND",
+  "VUV",
+  "XAF",
+  "XOF",
+  "XPF",
+]);
+
+function clampFractionDigit(value: number): number {
+  return Math.max(0, Math.min(2, Math.round(value)));
+}
+
+/**
+ * Ensures fraction digit values are within safe bounds
+ * and respects Stripe zero-decimal currency rules.
+ */
+export function sanitizeFractionDigits(
+  currency: string,
+  min: number,
+  max: number
+): { minimumFractionDigits: number; maximumFractionDigits: number } {
+  const isZeroDecimal = STRIPE_ZERO_DECIMAL_CURRENCIES.has(
+    currency.toUpperCase()
+  );
+
+  if (isZeroDecimal) {
+    return { minimumFractionDigits: 0, maximumFractionDigits: 0 };
+  }
+
+  const minimumFractionDigits = clampFractionDigit(min);
+  const maximumFractionDigits = Math.max(
+    minimumFractionDigits,
+    clampFractionDigit(max)
+  );
+
+  return { minimumFractionDigits, maximumFractionDigits };
+}
+
+/**
+ * Formats a currency value with locale-aware formatting and fraction digit control.
+ */
+export function pdFormatCurrency({
+  amount,
+  currency,
+  locale = "en-US",
+  formatStyle = "standard",
+  currencyDisplay = "symbol",
+  minimumFractionDigits = 2,
+  maximumFractionDigits = 2,
+}: FormatCurrencyOptions): FormatCurrencyResult {
+  const { minimumFractionDigits: minDigits, maximumFractionDigits: maxDigits } =
+    sanitizeFractionDigits(
+      currency,
+      minimumFractionDigits,
+      maximumFractionDigits
+    );
+
+  const formatter = new Intl.NumberFormat(locale, {
+    style: "currency",
+    currency,
+    notation: formatStyle === "compact" ? "compact" : "standard",
+    currencyDisplay,
+    minimumFractionDigits: minDigits,
+    maximumFractionDigits: maxDigits,
+  });
+
+  const parts = formatter.formatToParts(amount);
+
+  let formatted = "";
+  let integer = "";
+  let decimal = "";
+  let decimalSeparator = "";
+  let thousandsSeparator = "";
+
+  for (const part of parts) {
+    formatted += part.value;
+
+    if (part.type === "integer") {
+      integer += part.value;
+    } else if (part.type === "fraction") {
+      decimal = part.value;
+    } else if (part.type === "decimal") {
+      decimalSeparator = part.value;
+    } else if (part.type === "group") {
+      thousandsSeparator = part.value;
+      integer += part.value;
+    }
+  }
+
+  return {
+    formatted,
+    integer,
+    decimal,
+    decimalSeparator,
+    thousandsSeparator,
+  };
+}

package/src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/test/dom-utils.test.ts

@@ -0,0 +1,49 @@
+import { JSDOM } from "jsdom";
+import { describe, expect, it, beforeEach, afterEach } from "vitest";
+import { findRelatedElements } from "../src/dom-utils";
+
+describe("findRelatedElements", () => {
+  // setup.ts replaces global.document with a mock; restore a real jsdom for these tests
+  const originalDocument = global.document;
+  let dom: JSDOM;
+
+  beforeEach(() => {
+    dom = new JSDOM("<!DOCTYPE html><html><body></body></html>");
+    global.document = dom.window.document as unknown as Document;
+  });
+
+  afterEach(() => {
+    global.document = originalDocument;
+  });
+
+  it("should return null when element has no data-kq-rel attribute", () => {
+    const el = document.createElement("div");
+    document.body.appendChild(el);
+    expect(findRelatedElements(el)).toBeNull();
+  });
+
+  it("should return all elements sharing the same data-kq-rel value", () => {
+    document.body.innerHTML = `
+      <div data-kq-rel="price-a" id="el1"></div>
+      <div data-kq-rel="price-a" id="el2"></div>
+      <div data-kq-rel="price-b" id="el3"></div>
+    `;
+    const el = document.getElementById("el1") as HTMLElement;
+    const related = findRelatedElements(el);
+    expect(related).not.toBeNull();
+    expect(related!.length).toBe(2);
+    const ids = Array.from(related!).map(e => e.id);
+    expect(ids).toContain("el1");
+    expect(ids).toContain("el2");
+    expect(ids).not.toContain("el3");
+  });
+
+  it("should return only the element itself when no other element shares the rel value", () => {
+    document.body.innerHTML = `<div data-kq-rel="unique-rel" id="solo"></div>`;
+    const el = document.getElementById("solo") as HTMLElement;
+    const related = findRelatedElements(el);
+    expect(related).not.toBeNull();
+    expect(related!.length).toBe(1);
+    expect((related![0] as HTMLElement).id).toBe("solo");
+  });
+});

package/test/http-utils.test.ts

@@ -0,0 +1,152 @@
+import { describe, expect, it, vi, beforeEach, afterEach } from "vitest";
+import { fetchPricingData, ERROR_MSG } from "../src/http-utils";
+
+// ─── XHR mock helpers ──────────────────────────────────────────────────────
+
+interface MockXHR {
+  open: ReturnType<typeof vi.fn>;
+  send: ReturnType<typeof vi.fn>;
+  setRequestHeader: ReturnType<typeof vi.fn>;
+  onload: (() => void) | null;
+  onerror: (() => void) | null;
+  status: number;
+  response: string;
+}
+
+function makeMockXHR(): MockXHR {
+  return {
+    open: vi.fn(),
+    send: vi.fn(),
+    setRequestHeader: vi.fn(),
+    onload: null,
+    onerror: null,
+    status: 200,
+    response: "{}",
+  };
+}
+
+function installXHR(xhr: MockXHR) {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  (global as any).XMLHttpRequest = vi.fn(() => xhr);
+}
+
+// ─── Tests ─────────────────────────────────────────────────────────────────
+
+describe("fetchPricingData", () => {
+  let mockXHR: MockXHR;
+
+  beforeEach(() => {
+    mockXHR = makeMockXHR();
+    installXHR(mockXHR);
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("should resolve with parsed JSON on a 200 response", async () => {
+    const payload = { country: "India", percentage: 20 };
+    mockXHR.status = 200;
+    mockXHR.response = JSON.stringify(payload);
+
+    const promise = fetchPricingData({ promotionId: "promo-123" });
+    mockXHR.onload!.call(mockXHR);
+
+    const result = await promise;
+    expect(result).toEqual(payload);
+  });
+
+  it("should include promotion_id in the query string", async () => {
+    mockXHR.response = "{}";
+    const promise = fetchPricingData({ promotionId: "promo-abc" });
+    mockXHR.onload!.call(mockXHR);
+    await promise;
+
+    const [, url] = mockXHR.open.mock.calls[0] as [string, string];
+    expect(url).toContain("promotion_id=promo-abc");
+  });
+
+  it("should not include promotion_id when not provided", async () => {
+    mockXHR.response = "{}";
+    const promise = fetchPricingData({});
+    mockXHR.onload!.call(mockXHR);
+    await promise;
+
+    const [, url] = mockXHR.open.mock.calls[0] as [string, string];
+    expect(url).not.toContain("promotion_id");
+  });
+
+  it("should set Authorization header when accessToken is provided", async () => {
+    mockXHR.response = "{}";
+    const promise = fetchPricingData({
+      promotionId: "p1",
+      accessToken: "tok-xyz",
+    });
+    mockXHR.onload!.call(mockXHR);
+    await promise;
+
+    expect(mockXHR.setRequestHeader).toHaveBeenCalledWith(
+      "Authorization",
+      "Bearer tok-xyz"
+    );
+  });
+
+  it("should not set Authorization header when accessToken is absent", async () => {
+    mockXHR.response = "{}";
+    const promise = fetchPricingData({ promotionId: "p1" });
+    mockXHR.onload!.call(mockXHR);
+    await promise;
+
+    expect(mockXHR.setRequestHeader).not.toHaveBeenCalled();
+  });
+
+  it("should use sandbox URL when environment is 'sandbox'", async () => {
+    mockXHR.response = "{}";
+    const promise = fetchPricingData({
+      promotionId: "p1",
+      environment: "sandbox",
+    });
+    mockXHR.onload!.call(mockXHR);
+    await promise;
+
+    const [, url] = mockXHR.open.mock.calls[0] as [string, string];
+    // VITE_SANDBOX_API_URL is undefined in test env — we just confirm it's a different value
+    // than what production would resolve to (both may be undefined in tests, so verify open was called)
+    expect(mockXHR.open).toHaveBeenCalled();
+    expect(url).toBeDefined();
+  });
+
+  it("should reject with an error on HTTP error status", async () => {
+    mockXHR.status = 401;
+    mockXHR.response = "";
+
+    const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => {});
+
+    const promise = fetchPricingData({ promotionId: "p1" });
+    mockXHR.onload!.call(mockXHR);
+
+    await expect(promise).rejects.toThrow("API request failed with status 401");
+    expect(consoleSpy).toHaveBeenCalledWith(ERROR_MSG, 401);
+  });
+
+  it("should reject with a parse error when response is not valid JSON", async () => {
+    mockXHR.status = 200;
+    mockXHR.response = "not-json";
+
+    vi.spyOn(console, "error").mockImplementation(() => {});
+
+    const promise = fetchPricingData({ promotionId: "p1" });
+    mockXHR.onload!.call(mockXHR);
+
+    await expect(promise).rejects.toThrow("Failed to parse API response");
+  });
+
+  it("should reject with a network error on XHR onerror", async () => {
+    vi.spyOn(console, "error").mockImplementation(() => {});
+
+    const promise = fetchPricingData({ promotionId: "p1" });
+    mockXHR.onerror!.call(mockXHR);
+
+    await expect(promise).rejects.toThrow("Network error occurred");
+  });
+});