Components
DynamicSelect
This component provides a role-aware, dependent dropdown system where the second dropdown adapts automatically based on the first selection and the user’s role. It’s clean, reusable, and leverages Shadcn UI components for polished design.
"use client";
import DynamicSelect from "@/components/ui/dynamic-select";
export default function Page() {
// Example: user role could come from session or API
const userRole = "admin"; // Change to "user" to see dynamic options change
return (
<div className="flex items-center justify-center">
<div className="p-6 bg-white rounded-2xl shadow-lg">
<h1 className="text-xl font-semibold mb-4">Dynamic Context-Aware Select</h1>
<DynamicSelect userRole={userRole} />
</div>
</div>
);
}
Published
Similar components
Explore more
Part of Ruixen UI — browse the full library on 21st.dev.