jason-mohabali

Aidimension Ui Select

Component

About

Radix-styled select primitive with trigger

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Aidimension Ui Select to your project and fits it to your theme.

Code

How Aidimension Ui Select is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import * as React from "react";
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/components/ui/ai-dimensie-select";

const settings = { placeholder: "Select a framework" };

export default function Demo({ placeholder = settings.placeholder }: Partial<typeof settings>) {
  return (
    <div className="flex min-h-[300px] items-center justify-center bg-background p-8">
      <Select>
        <SelectTrigger className="w-[220px]">
          <SelectValue placeholder={placeholder} />
        </SelectTrigger>
        <SelectContent>
          <SelectItem value="next">Next.js</SelectItem>
          <SelectItem value="remix">Remix</SelectItem>
          <SelectItem value="astro">Astro</SelectItem>
          <SelectItem value="nuxt">Nuxt</SelectItem>
        </SelectContent>
      </Select>
    </div>
  );
}

Dependencies

More by jason-mohabali

View all
  • Path to Resilience Orbital Timeline

    Path to Resilience Orbital Timeline

    113
  • The Digital Store — Template Showcase

    The Digital Store — Template Showcase

  • Aidimension Ui Textarea

    Aidimension Ui Textarea

  • Aidimension Ui Switch

    Aidimension Ui Switch

  • Aidimension Ui Slider

    Aidimension Ui Slider

  • Aidimension Ui Tabs

    Aidimension Ui Tabs

  • Aidimension Ui Separator

    Aidimension Ui Separator

  • Aidimension Ui Input

    Aidimension Ui Input

Explore more