@carbon/react/es/components/Text/TextDirection.js

React components for the Carbon Design System

/**
 * Copyright IBM Corp. 2016, 2023
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

import PropTypes from 'prop-types';
import React, { useRef, useMemo, useEffect } from 'react';
import './index.js';
import { TextDirectionContext } from './TextDirectionContext.js';

const TextDirection = ({
  children,
  dir = 'auto',
  getTextDirection
}) => {
  const savedCallback = useRef(getTextDirection);
  const value = useMemo(() => {
    return {
      direction: dir,
      getTextDirection: savedCallback
    };
  }, [dir]);
  useEffect(() => {
    savedCallback.current = getTextDirection;
    // TODO: Is this `useEffect` supposed to have a dependency on
    // `getTextDirection`?
  });
  return /*#__PURE__*/React.createElement(TextDirectionContext.Provider, {
    value: value
  }, children);
};
TextDirection.propTypes = {
  /**
   * Provide children to be rendered inside of this component
   */
  children: PropTypes.node,
  /**
   * Specify the text direction for rendered children
   */
  dir: PropTypes.oneOf(['ltr', 'rtl', 'auto']),
  /**
   * Optionally provide a custom function to get the text direction for a piece
   * of text. Whatever is returned will become the value of the `dir` attribute
   * on a node of text. Should return one of: 'ltr', 'rtl', or 'auto'
   */
  getTextDirection: PropTypes.func
};

export { TextDirection };