Split Button

import { SplitButton } from "@sigil-ui/components";

"use client";

import { useState } from "react";
import { SplitButton } from "@sigil-ui/components";

function SplitButtonPreview() {
  const [message, setMessage] = useState("Choose an action.");
  return <div className="grid gap-[var(--s-space-16)] w-full">
    <div><SplitButton onClick={() => setMessage("Project saved.")} onDropdownClick={() => setMessage("Save a copy selected.")} dropdownLabel="Save a copy">Save project</SplitButton></div>
    <p role="status" className="text-[var(--s-text-muted)] text-[length:var(--s-size-sm)]">{message}</p>
  </div>;
}