How to use the @microsoft/fast-web-utilities.Direction.rtl function in @microsoft/fast-web-utilities

private handleUpdateDirection = (direction: Direction): void => {
        const newDir: Direction =
            direction === Direction.ltr ? Direction.ltr : Direction.rtl;

        if (this.state.designSystem.direction === newDir) {
            return;
        }

        this.setState({
            designSystem: Object.assign({}, this.state.designSystem, {
                direction: newDir,
            }),
        });
    };

private getLTR(): Direction {
        return !this.horizontalOverflowItemsRef.current
            ? Direction.ltr
            : getComputedStyle(this.horizontalOverflowItemsRef.current).direction ===
              Direction.rtl
                ? Direction.rtl
                : Direction.ltr;
    }

private getLTR(): Direction {
        if (canUseDOM()) {
            const tabElement: HTMLElement = ReactDOM.findDOMNode(
                this.tabsRef.current
            ) as HTMLElement;

            return !tabElement
                ? Direction.ltr
                : getComputedStyle(tabElement).direction === Direction.rtl
                    ? Direction.rtl
                    : Direction.ltr;
        }
    }
}

import ComponentView, { ComponentViewTypes } from "./component-view";
import {
    Canvas,
    Container,
    ContainerClassNamesContract,
    Pane,
    PaneClassNamesContract,
    PaneResizeDirection,
    Row,
    RowResizeDirection,
} from "@microsoft/fast-layouts-react";
import { Direction } from "@microsoft/fast-web-utilities";

export const localeDirectionMapping: { [key: string]: Direction } = {
    en: Direction.ltr,
    "en-rtl": Direction.rtl,
};

export function isRTL(locale: string): boolean {
    if (localeDirectionMapping[locale]) {
        return localeDirectionMapping[locale] === Direction.rtl;
    }

    return false;
}

export enum ComponentViewSlot {
    example = "canvas-example-view",
    detailExample = "canvas-detail-view-example",
    detailDocumentation = "canvas-detail-view-documentation",
}

private isMovingNext(direction: ButtonDirection, ltr: Direction): boolean {
        return (
            (direction === ButtonDirection.next && ltr === Direction.ltr) ||
            (direction === ButtonDirection.previous && ltr === Direction.rtl)
        );
    }

private getLTR(): Direction {
        if (canUseDOM()) {
            const tabElement: HTMLElement = ReactDOM.findDOMNode(
                this.tabsRef.current
            ) as HTMLElement;

            return !tabElement
                ? Direction.ltr
                : getComputedStyle(tabElement).direction === Direction.rtl
                    ? Direction.rtl
                    : Direction.ltr;
        }
    }
}