Function useCustomWidgets

useCustomWidgets(): object

Vue composable function for working with custom widgets

Returns

hasCustomWidget

hasCustomWidget: (customWidgetType) => boolean

Checks if a custom widget is registered.

Parameters

Parameter	Type	Description
customWidgetType	string	The type of the custom widget.

Returns

boolean

True if the custom widget is registered, false otherwise.

registerCustomWidget

registerCustomWidget: <Props>(customWidgetType, customWidget) => void

Registers a new custom widget.

Type parameters

Parameter	Default
Props extends CustomWidgetComponentProps< GenericDataOptions, CustomWidgetStyleOptions, AbstractDataPointWithEntries, Props >	CustomWidgetComponentProps< GenericDataOptions, CustomWidgetStyleOptions, AbstractDataPointWithEntries >

Parameters

Parameter	Type	Description
customWidgetType	string	The unique identifier for the custom widget type.
customWidget	CustomWidgetComponent< Props >	The custom widget component to register.

Returns

void

unregisterCustomWidget

unregisterCustomWidget: (customWidgetType) => void

Unregisters a custom widget for the given type name.

Parameters

Parameter	Type	Description
customWidgetType	string	The unique identifier for the custom widget type.

Returns

void

Example

How to use useCustomWidgets to register a custom widget in a dashboard:

<script setup lang="ts">
import { onUnmounted } from 'vue';
import { useCustomWidgets, DashboardById } from '@sisense/sdk-ui-vue';
import CustomHistogramWidget from './custom-histogram-widget';

const { registerCustomWidget, unregisterCustomWidget } = useCustomWidgets();
registerCustomWidget('histogramwidget', CustomHistogramWidget);
// Optionally unregister on unmount (e.g. if the widget should only be available within this component)
onUnmounted(() => unregisterCustomWidget('histogramwidget'));

</script>
<template>
 <DashboardById dashboardOid="your-dashboard-oid" />
</template>