ivt/dist/item/index.mjs

Ivt Components Library

import { Slot } from '@radix-ui/react-slot';
import { cva } from 'class-variance-authority';
import * as React from 'react';
import { c as cn } from '../chunks/utils-05LlW3Cl.mjs';
import { S as Separator } from '../chunks/separator-StpvupIv.mjs';
import '../chunks/bundle-mjs-BYcyWisL.mjs';
import '../chunks/index-DgKlJYZP.mjs';
import 'react-dom';
import 'react/jsx-runtime';

function ItemGroup({ className, ...props }) {
    return(// biome-ignore lint/a11y/useSemanticElements: <role>
    /*#__PURE__*/ React.createElement("div", {
        role: "list",
        "data-slot": "item-group",
        className: cn("group/item-group flex flex-col", className),
        ...props
    }));
}
function ItemSeparator({ className, ...props }) {
    return /*#__PURE__*/ React.createElement(Separator, {
        "data-slot": "item-separator",
        orientation: "horizontal",
        className: cn("my-0", className),
        ...props
    });
}
const itemVariants = cva("group/item flex items-center border border-transparent text-sm rounded-md transition-colors [a]:hover:bg-accent/50 [a]:transition-colors duration-100 flex-wrap outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", {
    variants: {
        variant: {
            default: "bg-transparent",
            outline: "border-border",
            muted: "bg-muted/50"
        },
        size: {
            default: "p-4 gap-4 ",
            sm: "py-3 px-4 gap-2.5"
        }
    },
    defaultVariants: {
        variant: "default",
        size: "default"
    }
});
function Item({ className, variant = "default", size = "default", asChild = false, ...props }) {
    const Comp = asChild ? Slot : "div";
    return /*#__PURE__*/ React.createElement(Comp, {
        "data-slot": "item",
        "data-variant": variant,
        "data-size": size,
        className: cn(itemVariants({
            variant,
            size,
            className
        })),
        ...props
    });
}
const itemMediaVariants = cva("flex shrink-0 items-center justify-center gap-2 group-has-[[data-slot=item-description]]/item:self-start [&_svg]:pointer-events-none group-has-[[data-slot=item-description]]/item:translate-y-0.5", {
    variants: {
        variant: {
            default: "bg-transparent",
            icon: "size-8 border rounded-sm bg-muted [&_svg:not([class*='size-'])]:size-4",
            image: "size-10 rounded-sm overflow-hidden [&_img]:size-full [&_img]:object-cover"
        }
    },
    defaultVariants: {
        variant: "default"
    }
});
function ItemMedia({ className, variant = "default", ...props }) {
    return /*#__PURE__*/ React.createElement("div", {
        "data-slot": "item-media",
        "data-variant": variant,
        className: cn(itemMediaVariants({
            variant,
            className
        })),
        ...props
    });
}
function ItemContent({ className, ...props }) {
    return /*#__PURE__*/ React.createElement("div", {
        "data-slot": "item-content",
        className: cn("flex flex-1 flex-col gap-1 [&+[data-slot=item-content]]:flex-none", className),
        ...props
    });
}
function ItemTitle({ className, ...props }) {
    return /*#__PURE__*/ React.createElement("div", {
        "data-slot": "item-title",
        className: cn("flex w-fit items-center gap-2 text-sm leading-snug font-medium", className),
        ...props
    });
}
function ItemDescription({ className, ...props }) {
    return /*#__PURE__*/ React.createElement("p", {
        "data-slot": "item-description",
        className: cn("text-muted-foreground line-clamp-2 text-sm leading-normal font-normal text-balance", "[&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4", className),
        ...props
    });
}
function ItemActions({ className, ...props }) {
    return /*#__PURE__*/ React.createElement("div", {
        "data-slot": "item-actions",
        className: cn("flex items-center gap-2", className),
        ...props
    });
}
function ItemHeader({ className, ...props }) {
    return /*#__PURE__*/ React.createElement("div", {
        "data-slot": "item-header",
        className: cn("flex basis-full items-center justify-between gap-2", className),
        ...props
    });
}
function ItemFooter({ className, ...props }) {
    return /*#__PURE__*/ React.createElement("div", {
        "data-slot": "item-footer",
        className: cn("flex basis-full items-center justify-between gap-2", className),
        ...props
    });
}

export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };
//# sourceMappingURL=index.mjs.map