@beamimpact/web-sdk
Version:
The Beam SDK enables brands to connect with their customers over shared values, not transactional discounts, to build stronger loyalty. Our integration achieves this by allowing customers to (a) choose a nonprofit where the brand will donate part of their
195 lines (192 loc) • 7.24 kB
TypeScript
import * as lit from 'lit';
import { LitElement, PropertyValues } from 'lit';
import * as lit_html from 'lit-html';
import * as lodash from 'lodash';
import { T as TUrl, L as LANGUAGES } from '../chunks/types-DfRc36jU.esm.js';
import '../chunks/progress-bar-CveZ8E6Q.esm.js';
import { T as TNumericId, a as TId } from '../chunks/types-CPxMwnoR.esm.js';
import './beam-partner-logos.js';
import '../chunks/share-button-CDVVaxEc.esm.js';
type RequiredConfig = {
apiKey: string;
nonprofitId: TNumericId;
userId: TId;
};
declare class BeamImpactOverview extends LitElement {
static tagName: string;
baseUrl: TUrl;
apiKey?: RequiredConfig["apiKey"];
storeId?: number;
nonprofitId?: RequiredConfig["nonprofitId"];
userId?: RequiredConfig["userId"];
lang: LANGUAGES;
debug: boolean;
draftConfig: boolean;
transactionId?: string;
/**
* @deprecated (v1.49.0) promoCodes and discountCodes will now be retrieved on the backend using transactionId
*/
discountCodes?: string[];
get configLang(): LANGUAGES;
getImpactData: () => Promise<{
chain: {
name: string;
logoUrl: string | null;
logoLockupUrl?: string | null | undefined;
communityImpactUrl: string | null;
donationTypeName: string | null;
matchDonationTypeName: string | null;
};
store: {
name: string | null;
displayName: string | null;
communityPageURL: string | null;
};
config: {
web: {
title: string;
description: string;
promoDescriptionPrefix?: string | undefined;
promoDescription?: string | undefined;
confirmButton?: string | undefined;
confirmedButton?: string | undefined;
collapsedButton?: string | undefined;
theme?: {
[key: string]: unknown;
} | null | undefined;
nonprofitSelectedHeader?: string | undefined;
nonprofitUnselectedHeader?: string | undefined;
dynamicStrings?: {
[key: string]: string;
} | null | undefined;
additionalStrings?: {
[key: string]: string;
} | null | undefined;
disableAnimation?: boolean | undefined;
promo?: {
"promo-text-long": string;
"promo-text-short": string;
"promo-cause-alt-text": string;
} | undefined;
};
mobileWeb?: {
title: string;
description: string;
nonprofitSelectedHeader?: string | undefined;
nonprofitUnselectedHeader?: string | undefined;
} | undefined;
mobile: {
title: string;
description: string;
nonprofitSelectedHeader?: string | undefined;
nonprofitUnselectedHeader?: string | undefined;
};
enableNonprofitDeselection?: boolean | undefined;
};
personal: {
imageUrl: string | null;
nonprofit: {
id: number;
name: string;
cause: string | null;
causeIconUrl: string | null;
causeIconSelectedUrl: string | null;
causeColor: string | null;
extensibility?: {
causeIconUrl?: string | null | undefined;
causeIconSelectedUrl?: string | null | undefined;
causeIconAndBackgroundUrl?: string | null | undefined;
} | undefined;
website: string | null;
websiteLinkText: string;
badge?: string | undefined;
includeInPersonalImpact?: boolean | undefined;
};
impact: {
description: string | null;
goalCompletionText: string;
goalProgressText: string;
goalProgressPercentage: number;
};
share: {
imageUrl: string | null;
};
filters?: string[] | undefined;
}[];
community: {
imageUrl: string | null;
nonprofit: {
id: number;
name: string;
cause: string | null;
causeIconUrl: string | null;
causeIconSelectedUrl: string | null;
causeColor: string | null;
extensibility?: {
causeIconUrl?: string | null | undefined;
causeIconSelectedUrl?: string | null | undefined;
causeIconAndBackgroundUrl?: string | null | undefined;
} | undefined;
website: string | null;
websiteLinkText: string;
badge?: string | undefined;
includeInPersonalImpact?: boolean | undefined;
};
impact: {
description: string | null;
goalCompletionText: string;
goalProgressText: string;
goalProgressPercentage: number;
};
share: {
imageUrl: string | null;
};
filters?: string[] | undefined;
}[];
promo: {
type?: string | undefined;
isActive: boolean;
multiplier: number | null;
} | null;
promoAssetUrl: string | null;
personalImpactAssetUrl: string | null;
settings?: {
excludeDonationsForRecurringTransactions: boolean;
} | undefined;
}>;
private impactDataController;
impactTitleRefs: HTMLElement[];
impactDescriptionRefs: HTMLElement[];
impactLinkRefs: HTMLElement[];
goalCompletionTextRefs: HTMLElement[];
connectedCallback(): void;
updated(changedProperties: PropertyValues): Promise<void>;
disconnectedCallback(): void;
/**
* Safari does not fire loading events on the document FontFaceSet, but it does implement the .ready Promise
* Call this method to wait for font loads that may be triggered by content changes
*/
handleFontLoad<T = any>(callback: () => T | void): Promise<void | T>;
resizeElements: lodash.DebouncedFuncLeading<() => void>;
renderCard({ imageUrl, title, percentFunded, goalProgressText, description, urlCopy, impactUrl, isImage, cardType, goalCompletionText, }: {
imageUrl: TUrl;
title: string;
percentFunded: number;
goalProgressText: string;
description: string;
urlCopy?: string;
impactUrl: TUrl;
isImage: boolean;
cardType: string;
goalCompletionText?: string;
}): lit_html.TemplateResult<1>;
render(): "" | lit_html.TemplateResult<1>;
get cssVariables(): any;
static styles: lit.CSSResult[];
}
declare global {
interface HTMLElementTagNameMap {
"beam-impact-overview": BeamImpactOverview;
}
}
export { BeamImpactOverview };