@tabula/ui-analytics

Allows to provide tracking ids to components.

Installation

Use the package manager pnpm to install @tabula/ui-analytics.

pnpm add @tabula/ui-analytics

You can use npm or yarn too.

Usage

UiAnalytics

This component provides trackId property through context to the children component.

import { UiAnalytics } from "@tabula/ui-analytics";

// ...
<UiAnalytics trackId="awesome-id">
  {/* ... */}
</UiAnalytics>
// ...

useUiTrackId

This hook allows to fetch track id from context.

Type

function useUiTrackId(id?: string): string | null

Usage

import { useUiTrackId } from "@tabula/ui-analytics";

| Track Id | Id | Result | |-----------|---------------|-------------------| | undefined | undefined | undefined | | undefined | null | undefined | | undefined | false | undefined | | undefined | "" | undefined | | undefined | "child" | undefined | | null | undefined | undefined | | null | null | undefined | | null | false | undefined | | null | "" | undefined | | null | "child" | undefined | | "" | undefined | undefined | | "" | null | undefined | | "" | false | undefined | | "" | "" | undefined | | "" | "child" | undefined | | "parent" | undefined | "parent" | | "parent" | null | "parent" | | "parent" | false | undefined | | "parent" | "" | undefined | | "parent" | "child" | "parent--child" |

useUiTrackIds

This hook allows to fetch track id from context and build ids map.

Type

function useUiTrackId(ids: Record<string, string | null | false>): Record<string, string> | Record<string, null>

Usage

import { useUiTrackIds } from "@tabula/ui-analytics";

| Track Id | Ids | | |-------------|--------------------------------------------------------------------------------------------|---------------------------------| | undefined | { isUndefined: undefined, isNull: null, isFalse: false, isEmpty: "", isString: "child" } | { } | | null | { isUndefined: undefined, isNull: null, isFalse: false, isEmpty: "", isString: "child" } | { } | | "" | { isUndefined: undefined, isNull: null, isFalse: false, isEmpty: "", isString: "child" } | { } | | "parent" | { isUndefined: undefined, isNull: null, isFalse: false, isEmpty: "", isString: "child" } | { isString: "parent--child" } |

License

This project is ISC licensed.