@fluid-app/ui-primitives 0.1.0 → 0.1.1

package/dist/index.cjs

@@ -4,11 +4,12 @@ var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var zod = require('@hookform/resolvers/zod');
 var reactHookForm = require('react-hook-form');
-var React6 = require('react');
+var React8 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var AccordionPrimitive = require('@radix-ui/react-accordion');
 var lucideReact = require('lucide-react');
 var classVarianceAuthority = require('class-variance-authority');
+var radixUi = require('radix-ui');
 var reactSlot = require('@radix-ui/react-slot');
 var reactDayPicker = require('react-day-picker');
 var RechartsPrimitive = require('recharts');
@@ -44,7 +45,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React6__namespace = /*#__PURE__*/_interopNamespace(React6);
+var React8__namespace = /*#__PURE__*/_interopNamespace(React8);
 var AccordionPrimitive__namespace = /*#__PURE__*/_interopNamespace(AccordionPrimitive);
 var RechartsPrimitive__namespace = /*#__PURE__*/_interopNamespace(RechartsPrimitive);
 var CollapsiblePrimitive__namespace = /*#__PURE__*/_interopNamespace(CollapsiblePrimitive);
@@ -71,7 +72,7 @@ function useZodForm(schema, options) {
   const resolver = zodResolverFn(schema);
   return reactHookForm.useForm({ ...options, resolver });
 }
-var PortalContainerContext = React6.createContext(
+var PortalContainerContext = React8.createContext(
   void 0
 );
 function PortalContainerProvider({
@@ -81,7 +82,7 @@ function PortalContainerProvider({
   return /* @__PURE__ */ jsxRuntime.jsx(PortalContainerContext.Provider, { value: container ?? void 0, children });
 }
 function usePortalContainer() {
-  return React6.useContext(PortalContainerContext);
+  return React8.useContext(PortalContainerContext);
 }
 function Accordion({
   className,
@@ -212,6 +213,133 @@ function AlertDescription({
     }
   );
 }
+function Avatar({
+  className,
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.Avatar.Root,
+    {
+      "data-slot": "avatar",
+      "data-size": size,
+      className: cn(
+        "group/avatar relative flex size-8 shrink-0 overflow-hidden rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarImage({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.Avatar.Image,
+    {
+      "data-slot": "avatar-image",
+      className: cn("aspect-square size-full", className),
+      ...props
+    }
+  );
+}
+function AvatarFallback({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.Avatar.Fallback,
+    {
+      "data-slot": "avatar-fallback",
+      className: cn(
+        "flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarBadge({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "data-slot": "avatar-badge",
+      className: cn(
+        "absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none",
+        "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden",
+        "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2",
+        "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "avatar-group",
+      className: cn(
+        "group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarGroupCount({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "avatar-group-count",
+      className: cn(
+        "relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var badgeVariants = classVarianceAuthority.cva(
+  "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90",
+        outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+        ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 [a&]:hover:underline"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? radixUi.Slot.Root : "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
 var buttonVariants = classVarianceAuthority.cva(
   "inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
   {
@@ -400,9 +528,9 @@ function CardFooter({ className, ...props }) {
   );
 }
 var THEMES = { light: "", dark: ".dark" };
-var ChartContext = React6__namespace.createContext(null);
+var ChartContext = React8__namespace.createContext(null);
 function useChart() {
-  const context = React6__namespace.useContext(ChartContext);
+  const context = React8__namespace.useContext(ChartContext);
   if (!context) {
     throw new Error("useChart must be used within a <ChartContainer />");
   }
@@ -415,7 +543,7 @@ function ChartContainer({
   config,
   ...props
 }) {
-  const uniqueId = React6__namespace.useId();
+  const uniqueId = React8__namespace.useId();
   const chartId = `chart-${id || uniqueId.replace(/:/g, "")}`;
   return /* @__PURE__ */ jsxRuntime.jsx(ChartContext.Provider, { value: { config }, children: /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
@@ -476,7 +604,7 @@ function ChartTooltipContent({
   labelKey
 }) {
   const { config } = useChart();
-  const tooltipLabel = React6__namespace.useMemo(() => {
+  const tooltipLabel = React8__namespace.useMemo(() => {
     if (hideLabel || !payload?.length) {
       return null;
     }
@@ -1164,6 +1292,43 @@ function PopoverDescription({
     }
   );
 }
+function RadioGroup2({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.RadioGroup.Root,
+    {
+      "data-slot": "radio-group",
+      className: cn("grid gap-3", className),
+      ...props
+    }
+  );
+}
+function RadioGroupItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.RadioGroup.Item,
+    {
+      "data-slot": "radio-group-item",
+      className: cn(
+        "aspect-square size-4 shrink-0 rounded-full border border-input text-primary shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:aria-invalid:ring-destructive/40",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        radixUi.RadioGroup.Indicator,
+        {
+          "data-slot": "radio-group-indicator",
+          className: "relative flex items-center justify-center",
+          children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleIcon, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-primary" })
+        }
+      )
+    }
+  );
+}
 function Select({
   ...props
 }) {
@@ -1320,7 +1485,7 @@ function SelectScrollDownButton({
     }
   );
 }
-var Separator3 = React6__namespace.forwardRef(
+var Separator3 = React8__namespace.forwardRef(
   ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     SeparatorPrimitive__namespace.Root,
     {
@@ -1349,7 +1514,7 @@ function Skeleton({
     }
   );
 }
-var Slider = React6__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var Slider = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   SliderPrimitive__namespace.Root,
   {
     ref,
@@ -1372,7 +1537,7 @@ function SheetPortal(props) {
   const portalContainer = usePortalContainer();
   return /* @__PURE__ */ jsxRuntime.jsx(SheetPrimitive__namespace.Portal, { container: portalContainer, ...props });
 }
-var SheetOverlay = React6__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetOverlay = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SheetPrimitive__namespace.Overlay,
   {
     className: cn(
@@ -1400,7 +1565,7 @@ var sheetVariants = classVarianceAuthority.cva(
     }
   }
 );
-var SheetContent = React6__namespace.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(SheetPortal, { children: [
+var SheetContent = React8__namespace.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(SheetPortal, { children: [
   /* @__PURE__ */ jsxRuntime.jsx(SheetOverlay, {}),
   /* @__PURE__ */ jsxRuntime.jsxs(
     SheetPrimitive__namespace.Content,
@@ -1443,7 +1608,7 @@ function SheetFooter({ className, ...props }) {
     }
   );
 }
-var SheetTitle = React6__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetTitle = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SheetPrimitive__namespace.Title,
   {
     ref,
@@ -1452,7 +1617,7 @@ var SheetTitle = React6__namespace.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SheetTitle.displayName = SheetPrimitive__namespace.Title.displayName;
-var SheetDescription = React6__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SheetDescription = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SheetPrimitive__namespace.Description,
   {
     ref,
@@ -1513,7 +1678,7 @@ function SpinnerWithText({
     }
   );
 }
-var Switch = React6__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Switch = React8__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SwitchPrimitive__namespace.Root,
   {
     className: cn(
@@ -1533,6 +1698,108 @@ var Switch = React6__namespace.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 Switch.displayName = SwitchPrimitive__namespace.Root.displayName;
+function Table({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "table-container",
+      className: "relative w-full overflow-x-auto",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "table",
+        {
+          "data-slot": "table",
+          className: cn("w-full caption-bottom text-sm", className),
+          ...props
+        }
+      )
+    }
+  );
+}
+function TableHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "thead",
+    {
+      "data-slot": "table-header",
+      className: cn("[&_tr]:border-b", className),
+      ...props
+    }
+  );
+}
+function TableBody({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "tbody",
+    {
+      "data-slot": "table-body",
+      className: cn("[&_tr:last-child]:border-0", className),
+      ...props
+    }
+  );
+}
+function TableFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "tfoot",
+    {
+      "data-slot": "table-footer",
+      className: cn(
+        "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableRow({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "tr",
+    {
+      "data-slot": "table-row",
+      className: cn(
+        "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableHead({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "th",
+    {
+      "data-slot": "table-head",
+      className: cn(
+        "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCell({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "td",
+    {
+      "data-slot": "table-cell",
+      className: cn(
+        "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TableCaption({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "caption",
+    {
+      "data-slot": "table-caption",
+      className: cn("mt-4 text-sm text-muted-foreground", className),
+      ...props
+    }
+  );
+}
 function Tabs({
   className,
   ...props
@@ -1604,7 +1871,7 @@ function Textarea({ className, ...props }) {
     }
   );
 }
-var ToggleGroupContext = React6__namespace.createContext({
+var ToggleGroupContext = React8__namespace.createContext({
   size: "default",
   variant: "default",
   spacing: 0,
@@ -1650,7 +1917,7 @@ function ToggleGroupItem({
   size = "default",
   ...props
 }) {
-  const context = React6__namespace.useContext(ToggleGroupContext);
+  const context = React8__namespace.useContext(ToggleGroupContext);
   return /* @__PURE__ */ jsxRuntime.jsx(
     ToggleGroupPrimitive__namespace.Item,
     {
@@ -1702,6 +1969,13 @@ exports.AccordionTrigger = AccordionTrigger;
 exports.Alert = Alert;
 exports.AlertDescription = AlertDescription;
 exports.AlertTitle = AlertTitle;
+exports.Avatar = Avatar;
+exports.AvatarBadge = AvatarBadge;
+exports.AvatarFallback = AvatarFallback;
+exports.AvatarGroup = AvatarGroup;
+exports.AvatarGroupCount = AvatarGroupCount;
+exports.AvatarImage = AvatarImage;
+exports.Badge = Badge;
 exports.Button = Button;
 exports.Calendar = Calendar;
 exports.Card = Card;
@@ -1757,6 +2031,8 @@ exports.PopoverHeader = PopoverHeader;
 exports.PopoverTitle = PopoverTitle;
 exports.PopoverTrigger = PopoverTrigger;
 exports.PortalContainerProvider = PortalContainerProvider;
+exports.RadioGroup = RadioGroup2;
+exports.RadioGroupItem = RadioGroupItem;
 exports.Select = Select;
 exports.SelectContent = SelectContent;
 exports.SelectGroup = SelectGroup;
@@ -1782,6 +2058,14 @@ exports.Skeleton = Skeleton;
 exports.Slider = Slider;
 exports.SpinnerWithText = SpinnerWithText;
 exports.Switch = Switch;
+exports.Table = Table;
+exports.TableBody = TableBody;
+exports.TableCaption = TableCaption;
+exports.TableCell = TableCell;
+exports.TableFooter = TableFooter;
+exports.TableHead = TableHead;
+exports.TableHeader = TableHeader;
+exports.TableRow = TableRow;
 exports.Tabs = Tabs;
 exports.TabsContent = TabsContent;
 exports.TabsList = TabsList;
@@ -1794,6 +2078,7 @@ exports.Tooltip = Tooltip2;
 exports.TooltipContent = TooltipContent;
 exports.TooltipProvider = TooltipProvider;
 exports.TooltipTrigger = TooltipTrigger;
+exports.badgeVariants = badgeVariants;
 exports.buttonVariants = buttonVariants;
 exports.cn = cn;
 exports.toggleVariants = toggleVariants;