Reference

Classes

BucketClient

BucketClient lets you interact with the Bucket API.

Constructors

new BucketClient()

new BucketClient(opts: InitOptions): BucketClient

Create a new BucketClient instance.

Parameters

Parameter	Type
opts	InitOptions

Returns

BucketClient

Properties

Property	Modifier	Type
logger	readonly	Logger

Methods

feedback()

feedback(payload: Feedback): Promise<
  | undefined
| Response>

Submit user feedback to Bucket. Must include either score or comment, or both.

Parameters

Parameter	Type	Description
payload	Feedback	The feedback details to submit.

Returns

Promise< | undefined | Response>

The server response.

getConfig()

getConfig(): Config

Get the current configuration.

Returns

Config

getFeature()

getFeature(key: string): Feature

Return a feature. Accessing isEnabled or config will automatically send a check event.

Parameters

Parameter	Type
key	string

Returns

Feature

A feature.

getFeatureOverride()

getFeatureOverride(key: string): null | boolean

Internal

Parameters

Parameter	Type
key	string

Returns

null | boolean

getFeatures()

getFeatures(): RawFeatures

Returns a map of enabled features. Accessing a feature will not send a check event and isEnabled does not take any feature overrides into account.

Returns

RawFeatures

Map of features.

initialize()

initialize(): Promise<void>

Initialize the Bucket SDK.

Must be called before calling other SDK methods.

Returns

Promise<void>

off()

off<THookType>(type: THookType, handler: (args0: HookArgs[THookType]) => void): void

Remove an event listener

Type Parameters

Type Parameter
THookType extends keyof HookArgs

Parameters

Parameter	Type	Description
type	THookType	Type of event to remove.
handler	(args0: HookArgs[THookType]) => void	The same function that was passed to on.

Returns

void

A function to remove the hook.

on()

on<THookType>(type: THookType, handler: (args0: HookArgs[THookType]) => void): () => void

Add an event listener

Type Parameters

Type Parameter
THookType extends keyof HookArgs

Parameters

Parameter	Type	Description
type	THookType	Type of events to listen for
handler	(args0: HookArgs[THookType]) => void	The function to call when the event is triggered.

Returns

Function

A function to remove the hook.

Returns

void

requestFeedback()

requestFeedback(options: RequestFeedbackData): void

Display the Bucket feedback form UI programmatically.

This can be used to collect feedback from users in Bucket in cases where Automated Feedback Surveys isn't appropriate.

Parameters

Parameter	Type
options	RequestFeedbackData

Returns

void

setFeatureOverride()

setFeatureOverride(key: string, isEnabled: null | boolean): void

Internal

Parameters

Parameter	Type
key	string
isEnabled	null | boolean

Returns

void

stop()

stop(): Promise<void>

Stop the SDK. This will stop any automated feedback surveys.

Returns

Promise<void>

track()

track(eventName: string, attributes?: 
  | null
  | Record<string, any>): Promise<
  | undefined
| Response>

Track an event in Bucket.

Parameters

Parameter	Type	Description
eventName	string	The name of the event.
attributes?	| null | Record<string, any>	Any attributes you want to attach to the event.

Returns

Promise< | undefined | Response>

updateCompany()

updateCompany(company: {}): Promise<void>

Update the company context. Performs a shallow merge with the existing company context. Attempting to update the company ID will log a warning and be ignored.

Parameters

Parameter	Type	Description
company	{}	The company details.

Returns

Promise<void>

updateOtherContext()

updateOtherContext(otherContext: {}): Promise<void>

Update the company context. Performs a shallow merge with the existing company context. Updates to the company ID will be ignored.

Parameters

Parameter	Type	Description
otherContext	{}	Additional context.

Returns

Promise<void>

updateUser()

updateUser(user: {}): Promise<void>

Update the user context. Performs a shallow merge with the existing user context. Attempting to update the user ID will log a warning and be ignored.

Parameters

Parameter	Type
user	{}

Returns

Promise<void>

Interfaces

BucketContext

Properties

Property	Type	Description
company?	CompanyContext	Company related context
otherContext?	Record<string, undefined | string | number>	Context which is not related to a user or a company
user?	UserContext	User related context

---

CheckEvent

Event representing checking the feature flag evaluation result

Properties

Property	Type	Description
action	"check-is-enabled" | "check-config"	check-is-enabled means isEnabled was checked, check-config means config was checked.
key	string	Feature key.
missingContextFields?	string[]	Missing context fields.
ruleEvaluationResults?	boolean[]	Rule evaluation results.
value?	| boolean | { key: string; payload: any; }	Result of feature flag or configuration evaluation. If action is check-is-enabled, this is the result of the feature flag evaluation and value is a boolean. If action is check-config, this is the result of the configuration evaluation.
version?	number	Version of targeting rules.

---

CompanyContext

Context is a set of key-value pairs. Id should always be present so that it can be referenced to an existing company.

Indexable

[key: string]: undefined | string | number

Properties

Property	Type	Description
id	undefined | string | number	Company id
name?	string	Company name

---

Config

BucketClient configuration.

Properties

Property	Type	Description
apiBaseUrl	string	Base URL of Bucket servers.
appBaseUrl	string	Base URL of the Bucket web app.
enableTracking	boolean	Whether to enable tracking.
sseBaseUrl	string	Base URL of Bucket servers for SSE connections used by AutoFeedback.

---

Feature

Represents a feature.

Properties

Property	Type	Description
config	FeatureRemoteConfig	‐
isEnabled	boolean	Result of feature flag evaluation.
requestFeedback	(options: Omit<RequestFeedbackData, "featureId" | "featureKey">) => void	Function to request feedback for this feature.
track	() => Promise< | undefined | Response>	Function to send analytics events for this feature.

---

FeedbackScoreSubmission

Properties

Property	Type
feedbackId?	string
question	string
score	number

---

FeedbackSubmission

Properties

Property	Type
comment	string
feedbackId?	string
question	string
score	number

---

HookArgs

Properties

Property	Type	Description
check	CheckEvent	‐
company	CompanyContext	‐
configCheck	CheckEvent	Deprecated: Use check instead. Deprecated
enabledCheck	CheckEvent	Deprecated: Use check instead. Deprecated
featuresUpdated	RawFeatures	‐
track	TrackEvent	‐
user	UserContext	‐

---

Logger

Methods

debug()

debug(message: string, ...args: any[]): void

Parameters

Parameter	Type
message	string
...args	any[]

Returns

void

error()

error(message: string, ...args: any[]): void

Parameters

Parameter	Type
message	string
...args	any[]

Returns

void

info()

info(message: string, ...args: any[]): void

Parameters

Parameter	Type
message	string
...args	any[]

Returns

void

warn()

warn(message: string, ...args: any[]): void

Parameters

Parameter	Type
message	string
...args	any[]

Returns

void

---

OnScoreSubmitResult

Properties

Property	Type
feedbackId	string

---

OpenFeedbackFormOptions

Properties

Property	Type	Description
key	string	‐
onClose?	() => void	‐
onDismiss?	() => void	‐
onScoreSubmit?	(data: FeedbackScoreSubmission) => Promise<OnScoreSubmitResult>	‐
onSubmit	(data: FeedbackSubmission) => | void | Promise<void>	‐
openWithCommentVisible?	boolean	Open the form with both the score and comment fields visible. Defaults to false
position?	Position	Control the placement and behavior of the feedback form.
title?	string	‐
translations?	Partial<FeedbackTranslations>	Add your own custom translations for the feedback form. Undefined translation keys fall back to english defaults.

---

ToolbarPosition

Properties

Property	Type
offset?	Offset
placement	DialogPlacement

---

UserContext

Indexable

[key: string]: undefined | string | number

Properties

Property	Type	Description
email?	string	User email
id	undefined | string | number	User id
name?	string	User name

Type Aliases

DialogPlacement

type DialogPlacement = "bottom-right" | "bottom-left" | "top-right" | "top-left";

---

FallbackFeatureOverride

type FallbackFeatureOverride = 
  | {
  key: string;
  payload: any;
 }
  | true;

---

FeatureRemoteConfig

type FeatureRemoteConfig = 
  | {
  key: string;
  payload: any;
 }
  | {
  key: undefined;
  payload: undefined;
};

A remotely managed configuration value for a feature.

Type declaration

{key: string;payload: any; }

Name	Type	Description
key	string	The key of the matched configuration value.
payload	any	The optional user-supplied payload data.

{key: undefined;payload: undefined; }

Name	Type
key	undefined
payload	undefined

---

Feedback

type Feedback = UnassignedFeedback & {
  companyId: string;
  userId: string;
};

Type declaration

Name	Type	Description
companyId?	string	Company ID from your own application.
userId?	string	User ID from your own application.

---

FeedbackOptions

type FeedbackOptions = {
  autoFeedbackHandler: FeedbackPromptHandler;
  enableAutoFeedback: boolean;
  ui: {
     position: Position;
     translations: Partial<FeedbackTranslations>;
    };
};

Type declaration

Name	Type	Description
autoFeedbackHandler?	FeedbackPromptHandler	‐
enableAutoFeedback?	boolean	Enables automatic feedback prompting if it's set up in Bucket
ui?	{position: Position;translations: Partial<FeedbackTranslations>; }	With these options you can override the look of the feedback prompt
ui.position?	Position	Control the placement and behavior of the feedback form.
ui.translations?	Partial<FeedbackTranslations>	Add your own custom translations for the feedback form. Undefined translation keys fall back to english defaults.

---

FeedbackPrompt

type FeedbackPrompt = {
  featureId: string;
  promptId: string;
  question: string;
  showAfter: Date;
  showBefore: Date;
};

Type declaration

Name	Type	Description
featureId	string	Feature ID from Bucket
promptId	string	Id of the prompt
question	string	Specific question user was asked
showAfter	Date	Feedback prompt should appear only after this time
showBefore	Date	Feedback prompt will not be shown after this time

---

FeedbackPromptHandler()

type FeedbackPromptHandler = (prompt: FeedbackPrompt, handlers: FeedbackPromptHandlerCallbacks) => void;

Parameters

Parameter	Type
prompt	FeedbackPrompt
handlers	FeedbackPromptHandlerCallbacks

Returns

void

---

FeedbackPromptHandlerCallbacks

type FeedbackPromptHandlerCallbacks = {
  openFeedbackForm: (options: FeedbackPromptHandlerOpenFeedbackFormOptions) => void;
  reply: FeedbackPromptReplyHandler;
};

Type declaration

Name	Type
openFeedbackForm	(options: FeedbackPromptHandlerOpenFeedbackFormOptions) => void
reply	FeedbackPromptReplyHandler

---

FeedbackPromptHandlerOpenFeedbackFormOptions

type FeedbackPromptHandlerOpenFeedbackFormOptions = Omit<RequestFeedbackOptions, 
  | "featureId"
  | "featureKey"
  | "userId"
  | "companyId"
  | "onClose"
| "onDismiss">;

---

FeedbackPromptReply

type FeedbackPromptReply = {
  comment: string;
  companyId: string;
  question: string;
  score: number;
};

Type declaration

Name	Type
comment?	string
companyId?	string
question	string
score?	number

---

FeedbackPromptReplyHandler()

type FeedbackPromptReplyHandler = <T>(reply: T) => T extends null ? Promise<void> : Promise<{
  feedbackId: string;
}>;

Type Parameters

Type Parameter
T extends FeedbackPromptReply | null

Parameters

Parameter	Type
reply	T

Returns

T extends null ? Promise<void> : Promise<{feedbackId: string; }>

---

FeedbackTranslations

type FeedbackTranslations = {
  DefaultQuestionLabel: string;
  QuestionPlaceholder: string;
  ScoreDissatisfiedLabel: string;
  ScoreNeutralLabel: string;
  ScoreSatisfiedLabel: string;
  ScoreStatusDescription: string;
  ScoreStatusLoading: string;
  ScoreStatusReceived: string;
  ScoreVeryDissatisfiedLabel: string;
  ScoreVerySatisfiedLabel: string;
  SendButton: string;
  SuccessMessage: string;
};

You can use this to override text values in the feedback form with desired language translation

Type declaration

Name	Type
DefaultQuestionLabel	string
QuestionPlaceholder	string
ScoreDissatisfiedLabel	string
ScoreNeutralLabel	string
ScoreSatisfiedLabel	string
ScoreStatusDescription	string
ScoreStatusLoading	string
ScoreStatusReceived	string
ScoreVeryDissatisfiedLabel	string
ScoreVerySatisfiedLabel	string
SendButton	string
SuccessMessage	string

---

FetchedFeature

type FetchedFeature = {
  config: {
     key: string;
     missingContextFields: string[];
     payload: any;
     ruleEvaluationResults: boolean[];
     version: number;
    };
  isEnabled: boolean;
  key: string;
  missingContextFields: string[];
  ruleEvaluationResults: boolean[];
  targetingVersion: number;
};

A feature fetched from the server.

Type declaration

Name	Type	Description
config?	{key: string;missingContextFields: string[];payload: any;ruleEvaluationResults: boolean[];version: number; }	Optional user-defined dynamic configuration.
config.key	string	The key of the matched configuration value.
config.missingContextFields?	string[]	The missing context fields.
config.payload?	any	The optional user-supplied payload data.
config.ruleEvaluationResults?	boolean[]	The rule evaluation results.
config.version?	number	The version of the matched configuration value.
isEnabled	boolean	Result of feature flag evaluation. Note: does not take local overrides into account.
key	string	Feature key.
missingContextFields?	string[]	Missing context fields.
ruleEvaluationResults?	boolean[]	Rule evaluation results.
targetingVersion?	number	Version of targeting rules.

---

InitOptions

type InitOptions = {
  apiBaseUrl: string;
  appBaseUrl: string;
  company: CompanyContext;
  credentials: "include" | "same-origin" | "omit";
  enableTracking: boolean;
  expireTimeMs: number;
  fallbackFeatures:   | string[]
     | Record<string, FallbackFeatureOverride>;
  feedback: FeedbackOptions;
  logger: Logger;
  otherContext: Record<string, any>;
  publishableKey: string;
  sdkVersion: string;
  sseBaseUrl: string;
  staleTimeMs: number;
  staleWhileRevalidate: boolean;
  timeoutMs: number;
  toolbar: ToolbarOptions;
  user: UserContext;
};

BucketClient initialization options.

Type declaration

Name	Type	Description
apiBaseUrl?	string	Base URL of Bucket servers. You can override this to use your mocked server.
appBaseUrl?	string	Base URL of the Bucket web app. Links open ín this app by default.
company?	CompanyContext	Company related context. If you provide id Bucket will enrich the evaluation context with company attributes on Bucket servers.
credentials?	"include" | "same-origin" | "omit"	When proxying requests, you may want to include credentials like cookies so you can authorize the request in the proxy. This option controls the credentials option of the fetch API.
enableTracking?	boolean	Whether to enable tracking. Defaults to true.
expireTimeMs?	number	If set, features will be cached between page loads for this duration
fallbackFeatures?	| string[] | Record<string, FallbackFeatureOverride>	Feature keys for which isEnabled should fallback to true if SDK fails to fetch features from Bucket servers. If a record is supplied instead of array, the values of each key represent the configuration values and isEnabled is assume true.
feedback?	FeedbackOptions	AutoFeedback specific configuration
logger?	Logger	You can provide a logger to see the logs of the network calls. This is undefined by default. For debugging purposes you can just set the browser console to this property: options.logger = window.console;
otherContext?	Record<string, any>	Context not related to users or companies
publishableKey	string	Publishable key for authentication
sdkVersion?	string	Version of the SDK
sseBaseUrl?	string	Base URL of Bucket servers for SSE connections used by AutoFeedback.
staleTimeMs?	number	Stale features will be returned if staleWhileRevalidate is true if no new features can be fetched
staleWhileRevalidate?	boolean	If set to true stale features will be returned while refetching features
timeoutMs?	number	Timeout in milliseconds when fetching features
toolbar?	ToolbarOptions	Toolbar configuration
user?	UserContext	User related context. If you provide id Bucket will enrich the evaluation context with user attributes on Bucket servers.

---

Offset

type Offset = {
  x: string | number;
  y: string | number;
};

Type declaration

Name	Type	Description
x?	string | number	Offset from the nearest horizontal screen edge after placement is resolved
y?	string | number	Offset from the nearest vertical screen edge after placement is resolved

---

PopoverPlacement

type PopoverPlacement = Placement;

---

Position

type Position = 
  | {
  type: "MODAL";
 }
  | {
  offset: Offset;
  placement: DialogPlacement;
  type: "DIALOG";
 }
  | {
  anchor:   | HTMLElement
     | null;
  placement: PopoverPlacement;
  type: "POPOVER";
};

---

RawFeature

type RawFeature = FetchedFeature & {
  isEnabledOverride: boolean | null;
};

Type declaration

Name	Type	Description
isEnabledOverride	boolean | null	If not null, the result is being overridden locally

---

RawFeatures

type RawFeatures = Record<string, RawFeature>;

---

RequestFeedbackData

type RequestFeedbackData = Omit<OpenFeedbackFormOptions, "key" | "onSubmit"> & {
  companyId: string;
  featureKey: string;
  onAfterSubmit: (data: FeedbackSubmission) => void;
};

Type declaration

Name	Type	Description
companyId?	string	Company ID from your own application.
featureKey	string	Bucket feature key.
onAfterSubmit?	(data: FeedbackSubmission) => void	Allows you to handle a copy of the already submitted feedback. This can be used for side effects, such as storing a copy of the feedback in your own application or CRM.

---

RequestFeedbackOptions

type RequestFeedbackOptions = RequestFeedbackData & {
  userId: string;
};

Type declaration

Name	Type	Description
userId	string	User ID from your own application.

---

ToolbarOptions

type ToolbarOptions = 
  | boolean
  | {
  position: ToolbarPosition;
  show: boolean;
};

Toolbar options.

---

TrackEvent

type TrackEvent = {
  attributes:   | Record<string, any>
     | null;
  company: CompanyContext;
  eventName: string;
  user: UserContext;
};

Type declaration

Name	Type
attributes?	| Record<string, any> | null
company?	CompanyContext
eventName	string
user	UserContext

---

UnassignedFeedback

type UnassignedFeedback = {
  comment: string;
  featureKey: string;
  feedbackId: string;
  promptedQuestion: string;
  promptId: string;
  question: string;
  score: number;
  source: "prompt" | "sdk" | "widget";
};

Type declaration

Name	Type	Description
comment?	string	User supplied comment about your feature.
featureKey	string	Bucket feature key.
feedbackId?	string	Bucket feedback ID
promptedQuestion?	string	The original question. This only needs to be populated if the feedback was submitted through the automated feedback surveys channel.
promptId?	string	Bucket feedback prompt ID. This only exists if the feedback was submitted as part of an automated prompt from Bucket. Used for internal state management of automated feedback.
question?	string	The question that was presented to the user.
score?	number	Customer satisfaction score.
source?	"prompt" | "sdk" | "widget"	Source of the feedback, depending on how the user was asked prompt - Feedback submitted by way of an automated feedback survey (prompted) widget - Feedback submitted via requestFeedback sdk - Feedback submitted via feedback

Variables

DEFAULT_TRANSLATIONS

const DEFAULT_TRANSLATIONS: FeedbackTranslations;

import { FeedbackTranslations } from "../types";
/**
 * {@includeCode ./defaultTranslations.tsx}
 */
export const DEFAULT_TRANSLATIONS: FeedbackTranslations = {
  DefaultQuestionLabel: "How satisfied are you with this feature?",
  QuestionPlaceholder: "Write a comment",
  ScoreStatusDescription: "Pick a score and leave a comment",
  ScoreStatusLoading: "Saving score, please wait...",
  ScoreStatusReceived: "Score has been received!",
  ScoreVeryDissatisfiedLabel: "Very dissatisfied (1/5)",
  ScoreDissatisfiedLabel: "Dissatisfied (2/5)",
  ScoreNeutralLabel: "Neutral (3/5)",
  ScoreSatisfiedLabel: "Satisfied (4/5)",
  ScoreVerySatisfiedLabel: "Very satisfied (5/5)",
  SuccessMessage: "Feedback received, thank you!",
  SendButton: "Send feedback",
};

---

feedbackContainerId

const feedbackContainerId: "bucket-feedback-dialog-container" = "bucket-feedback-dialog-container";

ID of HTML DIV element which contains the feedback dialog

---

propagatedEvents

const propagatedEvents: string[];

These events will be propagated to the feedback dialog

See

https://developer.mozilla.org/en-US/docs/Web/API/Element#events