Feature Highlight

import { FeatureHighlight } from "@/components/ui/feature-highlight-1"; // Adjust path as needed

// Demo data based on the provided image
const demoHeadline = "Long battery life for all-day watching";
const demoSubheadline = "Galaxy A56 5G";
const demoStats = [
  { value: "29 hrs", label: "Watch up to" },
  { value: "5,000 mAh" },
];

// Using a high-quality placeholder image of a phone.
// Replace this with your actual product image URL.
const demoImageUrl =
  "https://ik.imagekit.io/fpxbgsota/2f0dabfa8ec0ecb7e0450966db981e0c2f971e66f70745721380c9ec2499c9a0.png?updatedAt=1760702571673";

const demoImageAlt = "A modern smartphone showing a night city skyline.";

const demoDisclaimer =
  "Image simulated for illustrative purposes. Actual UI may be different. " +
  "Typical value tested under third-party laboratory condition. Typical value is the estimated average value considering " +
  "the deviation in battery capacity among the battery samples tested under IEC 61960 standard. " +
  "Rated (minimum) capacity is 4,905 mAh. Actual battery life varies by network environment, usage patterns and other factors.";

/**
 * Default demo for the FeatureHighlight component.
 */
export default function FeatureHighlightDemo() {
  return (
    <div className="flex w-full items-center justify-center bg-background p-4">
      <FeatureHighlight
        headline={demoHeadline}
        subheadline={demoSubheadline}
        stats={demoStats}
        imageUrl={demoImageUrl}
        imageAlt={demoImageAlt}
        disclaimerText={demoDisclaimer}
      />
    </div>
  );
}