"use client"; // Add this if using in a page/layout

import { useState } from "react";
import { ProBottomSheet } from "./ProBottomSheet/ProBottomSheet";

export default function ProBottomSheetBtn() {
  // State must be managed in a client component
  const [isOpen, setIsOpen] = useState(true);

  return (
    <div>
      <button onClick={() => setIsOpen(true)}>
        Open Sheet
      </button>

      <ProBottomSheet
        isOpen={isOpen}
        onClose={() => setIsOpen(false)} // This is now safe
      >
        <p>Sheet content</p>
      </ProBottomSheet>
    </div>
  );
}