Ai Suggestions

A component that displays prompt suggestion chips. It animates chips to radiate out from the center of a row. Use it to show equal-weight alternatives in a visually distinct way.

byEdu Calvo from Smoothui

Installation

terminal

pnpm dlx layro-cli add @educlopez/ai-suggestions

npx layro-cli add @educlopez/ai-suggestions

npx layro-cli add @educlopez/ai-suggestions

bunx layro-cli add @educlopez/ai-suggestions

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Dependencies

Demo

"use client";

import SmoothButton from "@/components/smoothui/smooth-button";
import { cn } from "@/lib/utils";
import { AnimatePresence, motion, useReducedMotion } from "motion/react";
import { useMemo } from "react";

const SPRING_DEFAULT = {
  bounce: 0.1,
  duration: 0.25,
  type: "spring" as const,
};
const STAGGER_SECONDS = 0.045;