"use client"; import { useControllableState } from "@radix-ui/react-use-controllable-state"; import { type LucideIcon, XIcon } from "lucide-react"; import { type ComponentProps, createContext, type HTMLAttributes, type MouseEventHandler, useContext, } from "react"; import { Button } from "@/components/ui/button"; import { cn } from "@/lib/utils"; type BannerContextProps = { show: boolean; setShow: (show: boolean) => void; }; export const BannerContext = createContext({ show: true, setShow: () => {}, }); export type BannerProps = HTMLAttributes & { visible?: boolean; defaultVisible?: boolean; onClose?: () => void; inset?: boolean; }; export const Banner = ({ children, visible, defaultVisible = true, onClose, className, inset = false, ...props }: BannerProps) => { const [show, setShow] = useControllableState({ defaultProp: defaultVisible, prop: visible, onChange: onClose, }); if (!show) { return null; } return (

{children}

); }; export type BannerIconProps = HTMLAttributes & { icon: LucideIcon; }; export const BannerIcon = ({ icon: Icon, className, ...props }: BannerIconProps) => (

); export type BannerTitleProps = HTMLAttributes; export const BannerTitle = ({ className, ...props }: BannerTitleProps) => (

); export type BannerActionProps = ComponentProps; export const BannerAction = ({ variant = "outline", size = "sm", className, ...props }: BannerActionProps) => ( ); };

banner

Instalação

Dependências

Registry dependencies