Configuration

Configure your SDK by providing options.

API Key

Your API Key will be provided to you by the LocalLogic team.

warning

If you are migrating from an old Local Logic SDK product, the API keys from the legacy versions do not work with our existing products.

Please reach out to Local Logic support to get your new key.

Global options

const localLogicClient = localLogicSDK(apiKey, globalOptions)

These options are available accross SDKs. You will also be able to specify SDK specific options depending on the SDK you are implementing. These options will be available in the SDK specific documentation

Name	Required	Type	Default	Description
apiKey	true	string		ApiKey required for making requests to the Local Logic API.
globalOptions.appearance	false	Appearance		The appearance option provides theme and variable support customizing the look and feel of your widgets.
globalOptions.locale	false	"en" or "fr"	"en"	The locale option specifies the language of the scores and the UI interface.
globalOptions.externalId	false	string		For SDKs connected to the Neighborhood Management App in the Local Logic Hub. This field is required for Neighborhood Showcase and Favorite Neighborhoods SDKs to work

Appearance

Local Logic SDKs support visual customization using the Appearance API, which allows you to match the look of the SDK to your brand.

type Appearance = {
  theme?: "day" | "night"; // Defaults to "day"
  variables?: {
    [key: string]: string;
  };
}

Commonly used variables

Variable	Description
--ll-color-primary	The primary brand color.
--ll-color-primary-variant1	A slightly darker version of the primary brand colour. This variable should always be changed in conjunction with --ll-color-primary.
--ll-font-family	Changes the font family used throughout the SDKs. Currently, the SDKs only support system fonts. This value should always include a fallback font family, ex. Inter, sans-serif.
--ll-font-size-base	Used to scale the font size up or down.
--ll-spacing-base-unit	Used to scale the overall padding of the SDKs.

Functions

Once you initialize your SDK client with your API key and global options, several functions are available.

info

Consult the documentation on the SDK you are implementing to see which options are available.

Create

const sdkInstance = localLogicClient.create("sdk-name", container, sdkOptions)

This function creates a new SDK widget based on the name specified.

sdkOptions are specific to each SDK being created.

Name	Required	Type	Default	Description
sdkType	true	string		The SDK you would like to create. "undefined" in this case.
container	true	HTMLElement		The element to render in to.
sdkOptions	true	SDKOptions		Options required for te specified sdkType. Options are detailed below.

SDKOptions

SDK Options are specific key / value objects based on the SDK that is being implemented.

Update

sdkInstance.update(sdkOptions)

This function is used to update the widget with new values. This can be useful when, for example, you want to change the widget location.

The sdkOptions object follows the same structure as on creation.

On

sdkInstance.on(event, callback)

This function takes a callback which is triggered when an event occurs. Currently, there is only one event.

Name	Required	Type	Default	Description
event	true	"change"		The name of the event.
callback	true	CallbackFunction		The callback to be triggered when the specified event occurs.

type CallbackFunction = ({ type: string, data: unknown }) => void;

Destroy

sdkInstance.destroy()

This function is used to teardown the created SDK widget.