@reevit/react 0.4.6 → 0.4.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -117,6 +117,8 @@ interface ReevitTheme {
117
117
  darkMode?: boolean;
118
118
  /** Custom logo URL to display in checkout header */
119
119
  logoUrl?: string;
120
+ /** Company or organization name to display in checkout header */
121
+ companyName?: string;
120
122
  /** PSP selector background color */
121
123
  pspSelectorBgColor?: string;
122
124
  /** PSP selector text color */
package/dist/index.d.ts CHANGED
@@ -117,6 +117,8 @@ interface ReevitTheme {
117
117
  darkMode?: boolean;
118
118
  /** Custom logo URL to display in checkout header */
119
119
  logoUrl?: string;
120
+ /** Company or organization name to display in checkout header */
121
+ companyName?: string;
120
122
  /** PSP selector background color */
121
123
  pspSelectorBgColor?: string;
122
124
  /** PSP selector text color */
package/dist/index.js CHANGED
@@ -366,6 +366,36 @@ function mapAvailableProviders(providers) {
366
366
  };
367
367
  }).filter((provider) => provider.methods.length > 0);
368
368
  }
369
+ function normalizeBranding(branding) {
370
+ if (!branding) {
371
+ return {};
372
+ }
373
+ const raw = branding;
374
+ const theme = { ...raw };
375
+ const getString = (value) => typeof value === "string" ? value : void 0;
376
+ const getBoolean = (value) => typeof value === "boolean" ? value : void 0;
377
+ const setIf = (key, value) => {
378
+ if (value !== void 0) {
379
+ theme[key] = value;
380
+ }
381
+ };
382
+ setIf("logoUrl", getString(raw.logoUrl ?? raw.logo_url));
383
+ setIf("companyName", getString(raw.companyName ?? raw.company_name));
384
+ setIf("primaryColor", getString(raw.primaryColor ?? raw.primary_color));
385
+ setIf("primaryForegroundColor", getString(raw.primaryForegroundColor ?? raw.primary_foreground_color));
386
+ setIf("backgroundColor", getString(raw.backgroundColor ?? raw.background_color));
387
+ setIf("surfaceColor", getString(raw.surfaceColor ?? raw.surface_color));
388
+ setIf("textColor", getString(raw.textColor ?? raw.text_color));
389
+ setIf("mutedTextColor", getString(raw.mutedTextColor ?? raw.muted_text_color));
390
+ setIf("borderRadius", getString(raw.borderRadius ?? raw.border_radius));
391
+ setIf("fontFamily", getString(raw.fontFamily ?? raw.font_family));
392
+ setIf("darkMode", getBoolean(raw.darkMode ?? raw.dark_mode));
393
+ setIf("pspSelectorBgColor", getString(raw.pspSelectorBgColor ?? raw.psp_selector_bg_color));
394
+ setIf("pspSelectorTextColor", getString(raw.pspSelectorTextColor ?? raw.psp_selector_text_color));
395
+ setIf("pspSelectorBorderColor", getString(raw.pspSelectorBorderColor ?? raw.psp_selector_border_color));
396
+ setIf("pspSelectorUseBorder", getBoolean(raw.pspSelectorUseBorder ?? raw.psp_selector_use_border));
397
+ return theme;
398
+ }
369
399
  function mapToPaymentIntent(response, config) {
370
400
  return {
371
401
  id: response.id,
@@ -385,7 +415,7 @@ function mapToPaymentIntent(response, config) {
385
415
  netAmount: response.net_amount,
386
416
  metadata: config.metadata,
387
417
  availableProviders: mapAvailableProviders(response.available_psps),
388
- branding: response.branding
418
+ branding: normalizeBranding(response.branding)
389
419
  };
390
420
  }
391
421
  function useReevit(options) {
@@ -2184,6 +2214,7 @@ function ReevitCheckout({
2184
2214
  };
2185
2215
  }, [paymentIntent?.branding, theme]);
2186
2216
  const themeStyles = resolvedTheme ? createThemeVariables(resolvedTheme) : {};
2217
+ const brandName = resolvedTheme?.companyName;
2187
2218
  const themeMode = resolvedTheme?.darkMode;
2188
2219
  const dataTheme = react.useMemo(() => {
2189
2220
  if (typeof themeMode === "boolean") {
@@ -2426,7 +2457,17 @@ function ReevitCheckout({
2426
2457
  "aria-modal": "true",
2427
2458
  children: [
2428
2459
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "reevit-modal__header", children: [
2429
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "reevit-modal__branding", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: resolvedTheme?.logoUrl || "https://i.imgur.com/bzUR5Lm.png", alt: "Checkout", className: "reevit-modal__logo" }) }),
2460
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "reevit-modal__branding", children: [
2461
+ /* @__PURE__ */ jsxRuntime.jsx(
2462
+ "img",
2463
+ {
2464
+ src: resolvedTheme?.logoUrl || "https://i.imgur.com/bzUR5Lm.png",
2465
+ alt: brandName || "Reevit",
2466
+ className: "reevit-modal__logo"
2467
+ }
2468
+ ),
2469
+ brandName && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "reevit-modal__brand-name", children: brandName })
2470
+ ] }),
2430
2471
  /* @__PURE__ */ jsxRuntime.jsx("button", { className: "reevit-modal__close", onClick: handleClose, "aria-label": "Close", children: "\u2715" })
2431
2472
  ] }),
2432
2473
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "reevit-modal__amount", children: [