useTextDirection

Hook that can get and set the direction of the element

elements

medium

test coverage

Last changed: 1 minute ago

Installation

Library

CLI

Manual

import { useTextDirection } from '@siberiacancode/reactuse';

Usage

const { value, set, remove } = useTextDirection(ref);
// or
const { ref, value, set, remove } = useTextDirection();

Demo

source

Api

Parameters

Name	Type	Default	Note
target?	HookTarget	document.querySelector('html')	The target element to observe
initialValue?	UseTextDirectionValue	'ltr'	The initial direction of the element

Returns

UseTextDirectionReturn

Parameters

Name	Type	Default	Note
initialValue?	UseTextDirectionValue	'ltr'	The initial direction of the element

Returns

{ ref: StateRef<Target> } & UseTextDirectionReturn

Type declaration

import type { HookTarget } from '@/utils/helpers';

import type { StateRef } from '../useRefState/useRefState';

export type UseTextDirectionValue = 'auto' | 'ltr' | 'rtl';

export interface UseTextDirectionReturn {
  /** The current direction */
  value: UseTextDirectionValue;
  /*** The function to remove the direction */
  remove: () => void;
  /*** The function to set the direction */
  set: (value: UseTextDirectionValue | null) => void;
}

export interface UseTextDirection {
  (target: HookTarget, initialValue?: UseTextDirectionValue): UseTextDirectionReturn;

  <Target extends Element>(
    initialValue?: UseTextDirectionValue,
    target?: never
  ): UseTextDirectionReturn & { ref: StateRef<Target> };
}

Source

Source • Demo

Contributors

D

debabin