Widget configuration

Trigger style

The style property is optional, but if you want to customize the look of the floating button, you can provide the following properties:

Position

The position property accepts the following values:

type WidgetStylePosition = "bottom-left" | "bottom-right" | "top-left" | "top-right" | "center-left" | "center-right";

Ad example, to set the button to the bottom right of the screen, you can provide the following configuration:

<bk-floating-widget
        data-trigger='{"position": "bottom-right"}'
     ...

Icon

The icon property accepts the following values:

type Icon = "ticket" | "shopping-bag" | false;

Ad example, to do not show any icon in the button:

<bk-floating-widget
        data-trigger='{"position": "top-right", "icon": "shopping-bag"}'
     ...

Label

The label property accepts the following values:

type Icon = string | false | true;

Widget style

The widget style property is optional, but if you want to customize the look of the widget modal, you can provide the following properties:

Theme

The theme property accepts the following values:

type Theme = "dark" | "light";

Ad example, to set the button and widget modal theme to dark:

<bk-floating-widget
        data-widget-style='{"theme": "dark"}'
     ...