@developer_tribe/react-builder 1.2.27 → 1.2.29

package/dist/logger.d.ts

@@ -0,0 +1,18 @@
+/**
+ * IAP logger shim — delegates to console.
+ *
+ * The core project replaces this with a richer logger (Bugsnag remote, etc.).
+ * This minimal version keeps product-base compilable in the builder context.
+ */
+type LogPayload = Record<string, unknown>;
+type LogOptions = {
+    remote?: boolean;
+};
+declare function noop(): void;
+export declare const iapLogger: {
+    error(_tags: string[], message: string, payload?: LogPayload, _opts?: LogOptions): void;
+    warn(_tags: string[], message: string, payload?: LogPayload, _opts?: LogOptions): void;
+    info(_tags: string[], message: string, payload?: LogPayload, _opts?: LogOptions): void;
+    debug: typeof noop;
+};
+export {};

package/dist/modals/InspectModal.d.ts

@@ -0,0 +1,5 @@
+type InspectModalProps = {
+    onClose: () => void;
+};
+export declare function InspectModal({ onClose }: InspectModalProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/modals/index.d.ts

@@ -4,9 +4,9 @@ export { DeviceSelectorModal } from './DeviceSelectorModal';
 export { ColorModal } from './ColorModal';
 export { IconPickerModal } from './IconPickerModal';
 export { LocalicationModal } from './LocalicationModal';
-export { ScreenColorsModal } from './ScreenColorsModal';
 export { MockableFeatureModal } from './MockableFeatureModal';
 export { ProductEditModal } from './ProductEditModal';
 export { ProductPresetsModal } from './ProductPresetsModal';
 export { BenefitEditModal } from './BenefitEditModal';
 export { BenefitPresetsModal } from './BenefitPresetsModal';
+export { InspectModal } from './InspectModal';

package/dist/pages/ProjectPage.d.ts

@@ -1,11 +1,11 @@
 import type { Project, ProjectColors, ProjectMeta } from '../types/Project';
-import { AppConfig } from '../types/PreviewConfig';
+import { type Localication } from '../types/PreviewConfig';
 import type { LogLevel } from '../types/Project';
 import type { Fonts } from '../types/Fonts';
 export type ProjectPageProps = {
     project: Project;
     onSaveProject: (project: ProjectMeta) => void;
-    appConfig?: AppConfig;
+    localization?: Localication;
     logLevel?: LogLevel;
     projectColors?: ProjectColors;
     onSaveProjectColors?: (colors: ProjectColors) => void;
@@ -20,4 +20,4 @@ export type ProjectPageProps = {
      */
     appFont?: string | undefined;
 };
-export declare function ProjectPage({ project, appConfig, onSaveProject, logLevel, projectColors, onSaveProjectColors, name, typography, appFont, }: ProjectPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function ProjectPage({ project, localization, onSaveProject, logLevel, projectColors, onSaveProjectColors, name, typography, appFont, }: ProjectPageProps): import("react/jsx-runtime").JSX.Element;

package/dist/paywall/hooks/useCalculateLocalizedPrice.d.ts

@@ -1,4 +1,6 @@
 /**
- * Placeholder hook — will be implemented later.
+ * Extracts a numeric price string from a localized/formatted price.
+ * @param formattedPrice e.g. "$9.99", "€4,99"
+ * @returns Numeric string e.g. "9.99", "4.99"
  */
-export declare function useCalculateLocalizedPrice(): string;
+export declare function useCalculateLocalizedPrice(formattedPrice?: string): string;

package/dist/paywall/hooks/useDiscountRate.d.ts

@@ -1,4 +1,5 @@
 /**
- * Placeholder hook — will be implemented later.
+ * Calculates the discount percentage between a regular and promo price.
+ * @returns Discount as integer (e.g. 50 for 50%), or 0 if not calculable.
  */
-export declare function useDiscountRate(): number;
+export declare function useDiscountRate(regularPrice?: string, promoPrice?: string): number;

package/dist/paywall/types/paywall-types.d.ts

@@ -1,43 +1,18 @@
 /**
- * Simple paywall-related types.
+ * Paywall-related types.
  *
- * We keep this intentionally small and runtime-agnostic.
+ * Product is now re-exported from product-base (the unified type with all
+ * platform-specific fields). This keeps every consumer compatible while
+ * gaining access to subscriptionOffers, pricingPhases, introductoryPrice, etc.
  *
- * Product fields are based on the common shape returned by `react-native-iap`
- * calls like `getProducts()` / `getSubscriptions()`.
- * See: `https://www.npmjs.com/package/react-native-iap`
+ * See: product-base/types.ts for the full definition.
  */
 export type { PaywallBenefits, PaywallBenefitValue } from './benefits';
-/**
- * Minimal "product" representation (compatible with `react-native-iap` product-ish objects).
- *
- * Note: `react-native-iap` has slightly different fields per platform/product type.
- * This is the common subset most paywalls need.
- */
-export interface Product {
-    /** iOS: `productId`, Android: `productId` */
-    productId: string;
-    /** Display name / title from the store (when available). */
-    title?: string;
-    /** Description from the store (when available). */
-    description?: string;
-    /**
-     * Localized formatted price (e.g. "$4.99", "€9,99").
-     * In `react-native-iap` this is typically `localizedPrice`.
-     */
-    localizedPrice?: string;
-    /**
-     * Raw price string from the store (often numeric string).
-     * In `react-native-iap` this is typically `price`.
-     */
-    price?: string;
-    /** Currency code (e.g. "USD", "EUR"). */
-    currency?: string;
-}
+export type { Product } from '../../product-base/types';
 /**
  * A simple paywall model you can store/serialize.
  */
 export interface PaywallModel {
-    product: Product[];
+    product: import('../../product-base/types').Product[];
     benefits: import('./benefits').PaywallBenefits;
 }

package/dist/product-base/buildPaywallLocalizationParams.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Pure function that extracts all paywall localization params from a product.
+ *
+ * Platform-agnostic: caller provides `platform` to select iOS vs Android extraction.
+ * Optionally accepts a `localize` function for period text translation.
+ */
+import type { Product, ProductParams } from './types';
+/**
+ * Extracts paywall localization params from a product.
+ *
+ * @param product  - The selected product (iOS or Android shape)
+ * @param platform - 'ios' | 'android' — determines which extractor runs
+ * @param offerId  - Optional offer id (for promo/discount matching)
+ * @param localize - Optional function to translate period keys (falls back to identity)
+ */
+export declare function buildPaywallLocalizationParams(product: Product, platform: 'ios' | 'android', offerId?: string, localize?: (key: string) => string): ProductParams;

package/dist/product-base/calculations.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Product calculation utilities
+ * Price, discount, period calculations
+ */
+/**
+ * Fiyat string'inden sadece sayıları extract eder
+ * @example "$9.99" → "9.99"
+ * @example "€4,99" → "4.99"
+ */
+export declare function extractPrice(formattedPrice: string): string;
+/**
+ * İndirim yüzdesini hesaplar
+ * @returns Discount percentage as string (e.g. "50")
+ */
+export declare function calculateDiscount(regularPrice: string, promoPrice: string): string;
+/**
+ * Aylık eşdeğer fiyat hesaplar
+ * @param price - Fiyat (number)
+ * @param unit - Period unit (day/week/month/year)
+ * @returns Monthly price as string (e.g. "3.33")
+ */
+export declare function calculatePricePerMonth(price: number, unit: string): string;
+/**
+ * Yıllık eşdeğer fiyat hesaplar
+ * @param price - Fiyat (number)
+ * @param unit - Period unit (day/week/month/year)
+ * @returns Yearly price as string (e.g. "119.88")
+ */
+export declare function calculatePricePerYear(price: number, unit: string): string;

package/dist/product-base/extractAndroidParams.d.ts

@@ -0,0 +1,24 @@
+import type { Product } from './types';
+export interface AndroidParams {
+    price: string;
+    promoPrice: string;
+    currency: string;
+    localizedPrice: string;
+    period: string;
+    periodValue: string;
+    periodType: string;
+    promoPeriod: string;
+    promoCycles: string;
+    promoPeriodUnit: string;
+    hasTrial: string;
+    trialPeriod: string;
+    trialPeriodUnit: string;
+    discountPercentage: string;
+    pricePerMonth: string;
+    pricePerYear: string;
+}
+/**
+ * Android product'tan params'ları extract eder
+ * pricingPhases'den trial, promo, regular bilgilerini parse eder
+ */
+export declare function extractAndroidParams(product: Product, offerId?: string): AndroidParams;

package/dist/product-base/extractIOSParams.d.ts

@@ -0,0 +1,24 @@
+import type { Product } from './types';
+export interface IOSParams {
+    price: string;
+    promoPrice: string;
+    currency: string;
+    localizedPrice: string;
+    period: string;
+    periodValue: string;
+    periodType: string;
+    promoPeriod: string;
+    promoCycles: string;
+    promoPeriodUnit: string;
+    hasTrial: string;
+    trialPeriod: string;
+    trialPeriodUnit: string;
+    discountPercentage: string;
+    pricePerMonth: string;
+    pricePerYear: string;
+}
+/**
+ * iOS product'tan params'ları extract eder
+ * introductoryPrice ve discounts'tan trial/promo bilgilerini parse eder
+ */
+export declare function extractIOSParams(product: Product, offerId?: string): IOSParams;

package/dist/product-base/index.d.ts

@@ -0,0 +1,51 @@
+/**
+ * Product base — centralized product utilities for paywall.
+ *
+ * This module is the single source of truth for product extraction, calculation
+ * and localization logic. It is consumed by:
+ *   - This library's own web builder (PaywallProvider, ProductPresetsModal)
+ *   - The core React Native project via `@developer_tribe/react-builder` exports
+ *
+ * Everything here is RN-safe (no DOM, no SCSS, no window/document).
+ *
+ * Includes:
+ * - types.ts                           : Product, PricingPhase, SubscriptionOffer, IOSDiscount, etc.
+ * - calculations.ts                    : extractPrice, calculateDiscount, pricePerMonth/Year
+ * - periodLocalizationKeys.ts          : PERIOD_LOCALIZATION_KEYS, parseBillingPeriod, convertIOSPeriodUnit
+ * - extractAndroidParams.ts            : Android pricingPhases extraction (trial, promo, regular)
+ * - extractIOSParams.ts                : iOS introductoryPrice/discounts extraction
+ * - buildPaywallLocalizationParams.ts  : Pure function — platform injected from outside
+ * - usePaywallLocalizationParams.ts    : Generic React hook — all deps via config param
+ * - mockProducts.json                  : Mock product data for testing (Android + iOS)
+ */
+export * from './types';
+export * from './calculations';
+export * from './periodLocalizationKeys';
+export * from './extractAndroidParams';
+export * from './extractIOSParams';
+export * from './buildPaywallLocalizationParams';
+export * from './usePaywallLocalizationParams';
+import type { Product } from './types';
+/** Preset map: preset key → product array. */
+export type MockProductPresets = Record<string, Product[]>;
+/**
+ * Returns a deep-copy of all mock product presets.
+ *
+ * Use this instead of importing `mockProducts.json` directly so that:
+ * 1. Consumers don't couple to a JSON file path.
+ * 2. Each call returns a fresh copy (safe to mutate).
+ *
+ * @example
+ * import { getMockProducts } from '@developer_tribe/react-builder';
+ * const presets = getMockProducts(); // { 'preset-1': [...], ... }
+ */
+export declare function getMockProducts(): MockProductPresets;
+/**
+ * Returns the product list for a specific preset key (deep-copied).
+ * Returns an empty array if the key doesn't exist.
+ *
+ * @example
+ * import { getMockProductsByPreset } from '@developer_tribe/react-builder';
+ * const products = getMockProductsByPreset('preset-1');
+ */
+export declare function getMockProductsByPreset(presetKey: string): Product[];

package/dist/product-base/periodLocalizationKeys.d.ts

@@ -0,0 +1,44 @@
+/**
+ * Period localization key'leri ve utility fonksiyonları
+ * Backend'den gelen localization key'leri ile çeviri yapılır
+ */
+/**
+ * Period localization key'leri
+ * Backend'de bu key'ler tanımlı olmalı
+ */
+export declare const PERIOD_LOCALIZATION_KEYS: {
+    readonly monthly: "base.builder.paywall.period.monthly";
+    readonly annual: "base.builder.paywall.period.annual";
+    readonly weekly: "base.builder.paywall.period.weekly";
+    readonly daily: "base.builder.paywall.period.daily";
+    readonly monthlyPromo: "base.builder.paywall.period.monthlyPromo";
+    readonly annualPromo: "base.builder.paywall.period.annualPromo";
+};
+export declare const PAYWALL_TEXT_KEYS: {
+    readonly pricingDefault: "base.builder.paywall.pricing.default.text";
+    readonly pricingFreeTrial: "base.builder.paywall.pricing.freeTrial.text";
+    readonly pricingRegular: "base.builder.paywall.pricing.regular.text";
+    readonly promoDefault: "base.builder.paywall.promo.default.text";
+    readonly promoFreeTrial: "base.builder.paywall.promo.freeTrial.text";
+    readonly promoRegular: "base.builder.paywall.promo.regular.text";
+};
+/**
+ * Period ve promo durumuna göre doğru localization key'i seçer
+ */
+export declare function getPeriodLocalizationKey(period: 'day' | 'week' | 'month' | 'year', hasPromo: boolean): string;
+/**
+ * ISO 8601 billing period'u parse eder
+ * @example "P1M" → { value: 1, unit: "month" }
+ * @example "P7D" → { value: 7, unit: "day" }
+ * @example "P1Y" → { value: 1, unit: "year" }
+ */
+export declare function parseBillingPeriod(iso8601: string): {
+    value: number;
+    unit: 'day' | 'week' | 'month' | 'year';
+};
+/**
+ * iOS period unit'ini normalize eder
+ * @example "DAY" → "day"
+ * @example "MONTH" → "month"
+ */
+export declare function convertIOSPeriodUnit(iosUnit?: string): 'day' | 'week' | 'month' | 'year';

package/dist/product-base/types.d.ts

@@ -0,0 +1,155 @@
+/**
+ * Product types for IAP.
+ *
+ * All platform-specific fields (iOS/Android) are included.
+ *
+ * See: `https://www.npmjs.com/package/react-native-iap`
+ */
+/** Purchase type: subscription or one-time in-app purchase. */
+export type PurchaseType = 'in-app' | 'subs';
+/** Subscription offer type */
+export type SubscriptionOfferType = 'introductory' | 'promotional';
+/** Payment mode */
+export type PaymentMode = 'pay-as-you-go' | 'pay-up-front' | 'free-trial';
+/** recurrenceMode values from Google Play Billing */
+export type RecurrenceMode = 1 | 2 | 3;
+/** iOS subscription period unit */
+export type IOSPeriodUnit = 'DAY' | 'WEEK' | 'MONTH' | 'YEAR';
+/** Normalized period unit */
+export type PeriodUnit = 'day' | 'week' | 'month' | 'year';
+/** A single billing phase (Google Play Billing) */
+export interface PricingPhase {
+    /** ISO 8601 duration (e.g. "P1M", "P1Y", "P7D") */
+    billingPeriod: string;
+    /** How many times this phase repeats (0 = infinite) */
+    billingCycleCount: number;
+    /** Human-readable price (e.g. "$4.99") */
+    formattedPrice: string;
+    /** Price in micros (e.g. "4990000"). "0" = free (trial) */
+    priceAmountMicros: string;
+    /** Currency code (e.g. "USD") */
+    priceCurrencyCode: string;
+    /** Recurrence mode: 1=infinite, 2=finite/promo, 3=one-time/trial */
+    recurrenceMode: RecurrenceMode;
+}
+/** Android raw offer details (from Google Play Billing API) */
+export interface AndroidOfferDetails {
+    basePlanId: string;
+    offerId?: string;
+    offerToken: string;
+    offerTags: string[];
+    pricingPhases: {
+        pricingPhaseList: PricingPhase[];
+    };
+}
+/** Normalized subscription offer (cross-platform) */
+export interface SubscriptionOffer {
+    id: string;
+    displayPrice: string;
+    price: number;
+    type: SubscriptionOfferType;
+    currency: string;
+    paymentMode?: PaymentMode;
+    periodCount?: number;
+    period?: {
+        unit: PeriodUnit;
+        value: number;
+    };
+    basePlanIdAndroid?: string;
+    offerTokenAndroid?: string;
+    offerTagsAndroid?: string[];
+    pricingPhasesAndroid?: {
+        pricingPhaseList: PricingPhase[];
+    };
+}
+/** iOS introductory price */
+export interface IOSIntroductoryPrice {
+    price: string;
+    priceIOS?: string;
+    type: 'free_trial' | 'pay_as_you_go' | 'pay_up_front';
+    numberOfPeriods: number;
+    subscriptionPeriod?: IOSPeriodUnit;
+    subscriptionPeriodUnitIOS?: IOSPeriodUnit;
+    subscriptionPeriodNumberIOS?: number;
+}
+/** iOS promotional discount */
+export interface IOSDiscount {
+    identifier: string;
+    price: string;
+    numberOfPeriods: number;
+    subscriptionPeriod: IOSPeriodUnit;
+}
+/** Product input coming from builder for membership initialization. */
+export interface ProductInput {
+    store_package_id: string;
+    offer_id?: string;
+    type?: string;
+    is_consumable?: boolean;
+}
+/** Unified product representation for IAP */
+export interface Product {
+    /** iOS: `productId`, Android: `id` (normalized to productId) */
+    productId: string;
+    /** Android raw id */
+    id?: string;
+    title?: string;
+    description?: string;
+    displayName?: string;
+    displayPrice?: string;
+    localizedPrice?: string;
+    price?: string;
+    currency?: string;
+    currencyCode?: string;
+    platform?: 'android' | 'ios';
+    debugDescription?: string | null;
+    /** Offer identifier from builder (Android offer token) */
+    offerId?: string;
+    type?: PurchaseType;
+    isConsumable?: boolean;
+    nameAndroid?: string;
+    productStatusAndroid?: unknown | null;
+    oneTimePurchaseOfferDetailsAndroid?: unknown | null;
+    discountOffers?: unknown | null;
+    /** Raw Google Play offer details */
+    subscriptionOfferDetailsAndroid?: AndroidOfferDetails[];
+    /** Normalized cross-platform offers */
+    subscriptionOffers?: SubscriptionOffer[];
+    introductoryPrice?: IOSIntroductoryPrice;
+    introductoryPriceIOS?: IOSIntroductoryPrice;
+    discounts?: IOSDiscount[];
+    subscriptionPeriodUnitIOS?: IOSPeriodUnit;
+    subscriptionPeriodNumberIOS?: number;
+}
+/** Product params exposed as localization variables (e.g. @price, @promoPrice). */
+export interface ProductParams {
+    price: string;
+    promoPrice: string;
+    currency: string;
+    localizedPrice: string;
+    period: string;
+    promoPeriod: string;
+    promoPeriodUnit: string;
+    hasTrial: string;
+    trialPeriod: string;
+    trialPeriodUnit: string;
+    discountPercentage: string;
+    localizedPeriod: string;
+    localizedPromoPeriod: string;
+    localizedPromoPrice: string;
+    localizedCalculatedPrice: string;
+    localizedCalculatedPeriod: string;
+    baseLocalizedPricingText: string;
+    baseLocalizedPromoText: string;
+    productTitle: string;
+    productDescription: string;
+    productCurreny: string;
+    productId: string;
+    productSelected: string;
+}
+/** Keys excluded from single (per-option) params — these are global/context-level. */
+type SingleExcludedKeys = 'productId' | 'productSelected';
+/** Per-option (single product) params — same keys as ProductParams prefixed with `single`. */
+export type SingleProductParams = {
+    [K in keyof Omit<ProductParams, SingleExcludedKeys> as `single${Capitalize<K>}`]: ProductParams[K];
+};
+export {};

package/dist/product-base/usePaywallLocalizationParams.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Generic React hook for extracting paywall localization params.
+ *
+ * All runtime dependencies (platform, localize, builderProducts) are injected
+ * via the `config` parameter — no hard-coded imports to any specific project.
+ *
+ * Usage (React Native / core):
+ *   usePaywallLocalizationParams(product, productId, {
+ *     platform: Platform.OS,
+ *     localize: (key) => localize(key),
+ *     builderProducts: builder.products,
+ *   })
+ *
+ * Usage (Web builder):
+ *   usePaywallLocalizationParams(product, productId, {
+ *     platform: device.platform,
+ *     localize,
+ *   })
+ */
+import type { Product, ProductInput, ProductParams } from './types';
+export type PaywallLocalizationConfig = {
+    /** 'ios' | 'android' — RN: Platform.OS, Web: device.platform */
+    platform: 'ios' | 'android';
+    /** Translates a localization key to a display string. Falls back to identity. */
+    localize?: (key: string) => string;
+    /** Builder product definitions — used to resolve offer_id for a product. */
+    builderProducts?: ProductInput[];
+};
+export declare function usePaywallLocalizationParams(selectedProduct?: Product, selectedProductId?: string, config?: PaywallLocalizationConfig): Partial<ProductParams>;

package/dist/store.d.ts

@@ -1,5 +1,5 @@
 import type { Device } from './types/Device';
-import { type AppConfig } from './types/PreviewConfig';
+import { type AppConfig, type Theme } from './types/PreviewConfig';
 import { Node } from './types/Node';
 import type { LogEntry, LogLevel, ProjectColors } from './types/Project';
 import type { Product } from './paywall/types/paywall-types';
@@ -20,6 +20,12 @@ type RenderStore = {
     setAppConfig: (appConfig: AppConfig) => void;
     projectColors?: ProjectColors;
     setProjectColors: (projectColors?: ProjectColors) => void;
+    theme: Theme;
+    setTheme: (theme: Theme) => void;
+    defaultLanguage: string;
+    setDefaultLanguage: (lang: string) => void;
+    isRtl: boolean;
+    setIsRtl: (isRtl: boolean) => void;
     previewMode: boolean;
     setPreviewMode: (previewMode: boolean) => void;
     products: Product[];