IconChevron() — react Function Reference

Architecture documentation for the IconChevron() function in IconChevron.tsx from the react codebase.

Function tsx PlaygroundApp Stores

Entity Profile

PlaygroundApp→ Stores→ IconChevron() — react Function Reference

Dependency Diagram

graph TD
  797436f0_309d_36b4_90ba_a12f5f622e48["IconChevron()"]
  4e4e5a98_5124_5b44_9988_b087b9a52d93["IconChevron.tsx"]
  797436f0_309d_36b4_90ba_a12f5f622e48 -->|defined in| 4e4e5a98_5124_5b44_9988_b087b9a52d93
  style 797436f0_309d_36b4_90ba_a12f5f622e48 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/apps/playground/components/Icons/IconChevron.tsx lines 17–41

>(function IconChevron({className, displayDirection, ...props}) {
  const rotationClass =
    displayDirection === 'left' ? 'rotate-90' : '-rotate-90';
  const classes = className ? `${rotationClass} ${className}` : rotationClass;

  return (
    <svg
      className={classes}
      xmlns="http://www.w3.org/2000/svg"
      width="20"
      height="20"
      viewBox="0 0 20 20"
      {...props}>
      <g fill="none" fillRule="evenodd" transform="translate(-446 -398)">
        <path
          fill="currentColor"
          fillRule="nonzero"
          d="M95.8838835,240.366117 C95.3957281,239.877961 94.6042719,239.877961 94.1161165,240.366117 C93.6279612,240.854272 93.6279612,241.645728 94.1161165,242.133883 L98.6161165,246.633883 C99.1042719,247.122039 99.8957281,247.122039 100.383883,246.633883 L104.883883,242.133883 C105.372039,241.645728 105.372039,240.854272 104.883883,240.366117 C104.395728,239.877961 103.604272,239.877961 103.116117,240.366117 L99.5,243.982233 L95.8838835,240.366117 Z"
          transform="translate(356.5 164.5)"
        />
        <polygon points="446 418 466 418 466 398 446 398" />
      </g>
    </svg>
  );
});