DMleadgen
46d973904b
Next.js website for Rocky Mountain Vending company featuring: - Product catalog with Stripe integration - Service areas and parts pages - Admin dashboard with Clerk authentication - SEO optimized pages with JSON-LD structured data Co-authored-by: Cursor <cursoragent@cursor.com>
42 lines
1.2 KiB
Text
42 lines
1.2 KiB
Text
import React from "react";
|
|
|
|
/**
|
|
* Render the chevron icon used in the navigation buttons and dropdowns.
|
|
*
|
|
* @group Components
|
|
* @see https://daypicker.dev/guides/custom-components
|
|
*/
|
|
export function Chevron(props: {
|
|
className?: string;
|
|
/**
|
|
* The size of the chevron.
|
|
*
|
|
* @defaultValue 24
|
|
*/
|
|
size?: number;
|
|
/** Set to `true` to disable the chevron. */
|
|
disabled?: boolean;
|
|
/** The orientation of the chevron. */
|
|
orientation?: "up" | "down" | "left" | "right";
|
|
}) {
|
|
const { size = 24, orientation = "left", className } = props;
|
|
|
|
return (
|
|
<svg className={className} width={size} height={size} viewBox="0 0 24 24">
|
|
{orientation === "up" && (
|
|
<polygon points="6.77 17 12.5 11.43 18.24 17 20 15.28 12.5 8 5 15.28" />
|
|
)}
|
|
{orientation === "down" && (
|
|
<polygon points="6.77 8 12.5 13.57 18.24 8 20 9.72 12.5 17 5 9.72" />
|
|
)}
|
|
{orientation === "left" && (
|
|
<polygon points="16 18.112 9.81111111 12 16 5.87733333 14.0888889 4 6 12 14.0888889 20" />
|
|
)}
|
|
{orientation === "right" && (
|
|
<polygon points="8 18.112 14.18888889 12 8 5.87733333 9.91111111 4 18 12 9.91111111 20" />
|
|
)}
|
|
</svg>
|
|
);
|
|
}
|
|
|
|
export type ChevronProps = Parameters<typeof Chevron>[0];
|