@locusgraph/components 0.2.0 → 0.2.2

package/dist/display/chat/attachment/attachment-parts.js

@@ -1,21 +1,64 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "cn";
 import * as Slot from "radix-ui/slot";
+import * as React from "react";
 import { Button } from "../../../action/button.js";
-function AttachmentTitle({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "attachment-title", className: cn("block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer", className), ...props }));
+import { jsx as _jsx } from "react/jsx-runtime";
+function AttachmentTitle({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("span", {
+    "data-slot": "attachment-title",
+    className: cn("block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer", className),
+    ...props
+  });
 }
-function AttachmentDescription({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "attachment-description", className: cn("mt-0.5 block min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80", "max-w-full", className), ...props }));
+function AttachmentDescription({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("span", {
+    "data-slot": "attachment-description",
+    className: cn("mt-0.5 block min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive/80", "max-w-full", className),
+    ...props
+  });
 }
-function AttachmentActions({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "attachment-actions", className: cn("relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:right-3 group-data-[orientation=vertical]/attachment:gap-1", className), ...props }));
+function AttachmentActions({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "attachment-actions",
+    className: cn("relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:right-3 group-data-[orientation=vertical]/attachment:gap-1", className),
+    ...props
+  });
 }
-function AttachmentAction({ className, variant, size = "icon-xs", ...props }) {
-    return (_jsx(Button, { "data-slot": "attachment-action", variant: variant ?? "ghost", size: size, className: cn(className), ...props }));
+function AttachmentAction({
+  className,
+  variant,
+  size = "icon-xs",
+  ...props
+}) {
+  return /*#__PURE__*/_jsx(Button, {
+    "data-slot": "attachment-action",
+    variant: variant ?? "ghost",
+    size: size,
+    className: cn(className),
+    ...props
+  });
 }
-function AttachmentTrigger({ className, asChild = false, type, ...props }) {
-    const Comp = asChild ? Slot.Root : "button";
-    return (_jsx(Comp, { "data-slot": "attachment-trigger", type: asChild ? undefined : (type ?? "button"), className: cn("absolute inset-0 z-10 outline-none", className), ...props }));
+function AttachmentTrigger({
+  className,
+  asChild = false,
+  type,
+  ...props
+}) {
+  const Comp = asChild ? Slot.Root : "button";
+  return /*#__PURE__*/_jsx(Comp, {
+    "data-slot": "attachment-trigger",
+    type: asChild ? undefined : type ?? "button",
+    className: cn("absolute inset-0 z-10 outline-none", className),
+    ...props
+  });
 }
-export { AttachmentAction, AttachmentActions, AttachmentDescription, AttachmentTitle, AttachmentTrigger, };
+export { AttachmentAction, AttachmentActions, AttachmentDescription, AttachmentTitle, AttachmentTrigger };

package/dist/display/chat/attachment/attachment.js

@@ -1,40 +1,82 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { cn } from "cn";
+import * as React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 const attachmentVariants = cva("group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-xl border bg-card text-card-foreground transition-colors focus-within:ring-1 focus-within:ring-ring/50 has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive/30 data-[state=idle]:border-dashed", {
-    variants: {
-        size: {
-            default: "gap-2 text-sm has-data-[slot=attachment-content]:px-2.5 has-data-[slot=attachment-content]:py-2 has-data-[slot=attachment-media]:p-2",
-            sm: "gap-2.5 text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5",
-            xs: "gap-1.5 rounded-lg text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1",
-        },
-        orientation: {
-            horizontal: "min-w-40 items-center",
-            vertical: "w-28 flex-col has-data-[slot=attachment-content]:w-36",
-        },
+  variants: {
+    size: {
+      default: "gap-2 text-sm has-data-[slot=attachment-content]:px-2.5 has-data-[slot=attachment-content]:py-2 has-data-[slot=attachment-media]:p-2",
+      sm: "gap-2.5 text-xs has-data-[slot=attachment-content]:px-2 has-data-[slot=attachment-content]:py-1.5 has-data-[slot=attachment-media]:p-1.5",
+      xs: "gap-1.5 rounded-lg text-xs has-data-[slot=attachment-content]:px-1.5 has-data-[slot=attachment-content]:py-1 has-data-[slot=attachment-media]:p-1"
     },
+    orientation: {
+      horizontal: "min-w-40 items-center",
+      vertical: "w-28 flex-col has-data-[slot=attachment-content]:w-36"
+    }
+  }
 });
-function Attachment({ className, state = "done", size = "default", orientation = "horizontal", ...props }) {
-    return (_jsx("div", { "data-slot": "attachment", "data-state": state, "data-size": size, "data-orientation": orientation, className: cn(attachmentVariants({ size, orientation }), className), ...props }));
+function Attachment({
+  className,
+  state = "done",
+  size = "default",
+  orientation = "horizontal",
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "attachment",
+    "data-state": state,
+    "data-size": size,
+    "data-orientation": orientation,
+    className: cn(attachmentVariants({
+      size,
+      orientation
+    }), className),
+    ...props
+  });
 }
-function AttachmentGroup({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "attachment-group", className: cn("flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 scrollbar-none gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start", className), ...props }));
+function AttachmentGroup({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "attachment-group",
+    className: cn("flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 scrollbar-none gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start", className),
+    ...props
+  });
 }
 const attachmentMediaVariants = cva("relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[size=sm]/attachment:w-8 group-data-[size=xs]/attachment:w-7 group-data-[size=xs]/attachment:rounded-md group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5", {
-    variants: {
-        variant: {
-            icon: "",
-            image: "opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover",
-        },
-    },
-    defaultVariants: {
-        variant: "icon",
-    },
+  variants: {
+    variant: {
+      icon: "",
+      image: "opacity-60 group-data-[state=done]/attachment:opacity-100 group-data-[state=idle]/attachment:opacity-100 *:[img]:aspect-square *:[img]:w-full *:[img]:object-cover"
+    }
+  },
+  defaultVariants: {
+    variant: "icon"
+  }
 });
-function AttachmentMedia({ className, variant = "icon", ...props }) {
-    return (_jsx("div", { "data-slot": "attachment-media", "data-variant": variant, className: cn(attachmentMediaVariants({ variant }), className), ...props }));
+function AttachmentMedia({
+  className,
+  variant = "icon",
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "attachment-media",
+    "data-variant": variant,
+    className: cn(attachmentMediaVariants({
+      variant
+    }), className),
+    ...props
+  });
 }
-function AttachmentContent({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "attachment-content", className: cn("max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1", className), ...props }));
+function AttachmentContent({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "attachment-content",
+    className: cn("max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1", className),
+    ...props
+  });
 }
 export { Attachment, AttachmentContent, AttachmentGroup, AttachmentMedia };

package/dist/display/chat/bubble.js

@@ -1,50 +1,93 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { cn } from "cn";
 import * as Slot from "radix-ui/slot";
-function BubbleGroup({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "bubble-group", className: cn("flex min-w-0 flex-col gap-2", className), ...props }));
+import * as React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
+function BubbleGroup({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "bubble-group",
+    className: cn("flex min-w-0 flex-col gap-2", className),
+    ...props
+  });
 }
 const bubbleVariants = cva("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
-    variants: {
-        variant: {
-            default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
-            secondary: "*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]",
-            muted: "*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
-            tinted: "*:data-[slot=bubble-content]:bg-muted *:data-[slot=bubble-content]:text-foreground *:data-[slot=bubble-content]:ring-1 *:data-[slot=bubble-content]:ring-border [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
-            outline: "*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30",
-            ghost: "border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:py-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50",
-            destructive: "*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30",
-        },
-    },
-    defaultVariants: {
-        variant: "default",
-    },
+  variants: {
+    variant: {
+      default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
+      secondary: "*:data-[slot=bubble-content]:bg-secondary *:data-[slot=bubble-content]:text-secondary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)]",
+      muted: "*:data-[slot=bubble-content]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
+      tinted: "*:data-[slot=bubble-content]:bg-muted *:data-[slot=bubble-content]:text-foreground *:data-[slot=bubble-content]:ring-1 *:data-[slot=bubble-content]:ring-border [&>[data-slot=bubble-content]:is(button,a):hover]:bg-[color-mix(in_oklch,var(--muted),var(--foreground)_5%)]",
+      outline: "*:data-[slot=bubble-content]:border-border *:data-[slot=bubble-content]:bg-background [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-input/30",
+      ghost: "border-none *:data-[slot=bubble-content]:rounded-none *:data-[slot=bubble-content]:bg-transparent *:data-[slot=bubble-content]:py-0 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted [&>[data-slot=bubble-content]:is(button,a):hover]:text-foreground dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-muted/50",
+      destructive: "*:data-[slot=bubble-content]:bg-destructive/10 *:data-[slot=bubble-content]:text-destructive dark:*:data-[slot=bubble-content]:bg-destructive/20 [&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/20 dark:[&>[data-slot=bubble-content]:is(button,a):hover]:bg-destructive/30"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
 });
-function Bubble({ variant = "default", align = "start", className, ...props }) {
-    return (_jsx("div", { "data-slot": "bubble", "data-variant": variant, "data-align": align, className: cn(bubbleVariants({ variant }), className), ...props }));
+function Bubble({
+  variant = "default",
+  align = "start",
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "bubble",
+    "data-variant": variant,
+    "data-align": align,
+    className: cn(bubbleVariants({
+      variant
+    }), className),
+    ...props
+  });
 }
-function BubbleContent({ asChild = false, className, ...props }) {
-    const Comp = asChild ? Slot.Root : "div";
-    return (_jsx(Comp, { "data-slot": "bubble-content", className: cn("w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50", className), ...props }));
+function BubbleContent({
+  asChild = false,
+  className,
+  ...props
+}) {
+  const Comp = asChild ? Slot.Root : "div";
+  return /*#__PURE__*/_jsx(Comp, {
+    "data-slot": "bubble-content",
+    className: cn("w-fit max-w-full min-w-0 overflow-hidden rounded-xl border border-transparent px-3 py-2 text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [button]:text-left [button,a]:transition-colors [button,a]:outline-none [button,a]:focus-visible:border-ring [button,a]:focus-visible:ring-3 [button,a]:focus-visible:ring-ring/50", className),
+    ...props
+  });
 }
 const bubbleReactionsVariants = cva("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-full bg-muted px-1.5 py-0.5 text-sm ring-3 ring-card has-[button]:p-0", {
-    variants: {
-        side: {
-            top: "top-0 -translate-y-3/4",
-            bottom: "bottom-0 translate-y-3/4",
-        },
-        align: {
-            start: "left-3",
-            end: "right-3",
-        },
-    },
-    defaultVariants: {
-        side: "bottom",
-        align: "end",
+  variants: {
+    side: {
+      top: "top-0 -translate-y-3/4",
+      bottom: "bottom-0 translate-y-3/4"
     },
+    align: {
+      start: "left-3",
+      end: "right-3"
+    }
+  },
+  defaultVariants: {
+    side: "bottom",
+    align: "end"
+  }
 });
-function BubbleReactions({ side = "bottom", align = "end", className, ...props }) {
-    return (_jsx("div", { "data-slot": "bubble-reactions", "data-align": align, "data-side": side, className: cn(bubbleReactionsVariants({ side, align }), className), ...props }));
+function BubbleReactions({
+  side = "bottom",
+  align = "end",
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("div", {
+    "data-slot": "bubble-reactions",
+    "data-align": align,
+    "data-side": side,
+    className: cn(bubbleReactionsVariants({
+      side,
+      align
+    }), className),
+    ...props
+  });
 }
 export { Bubble, BubbleContent, BubbleGroup, BubbleReactions };

package/dist/display/chat/marker.js

@@ -1,24 +1,53 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { cn } from "cn";
 import * as Slot from "radix-ui/slot";
+import * as React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 const markerVariants = cva("group/marker relative flex min-h-4 w-full items-center gap-2 text-left text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground", {
-    variants: {
-        variant: {
-            default: "",
-            separator: "before:mr-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ml-1 after:h-px after:min-w-0 after:flex-1 after:bg-border",
-            border: "border-b border-border pb-2",
-        },
-    },
+  variants: {
+    variant: {
+      default: "",
+      separator: "before:mr-1 before:h-px before:min-w-0 before:flex-1 before:bg-border after:ml-1 after:h-px after:min-w-0 after:flex-1 after:bg-border",
+      border: "border-b border-border pb-2"
+    }
+  }
 });
-function Marker({ className, variant = "default", asChild = false, ...props }) {
-    const Comp = asChild ? Slot.Root : "div";
-    return (_jsx(Comp, { "data-slot": "marker", "data-variant": variant, className: cn(markerVariants({ variant, className })), ...props }));
+function Marker({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot.Root : "div";
+  return /*#__PURE__*/_jsx(Comp, {
+    "data-slot": "marker",
+    "data-variant": variant,
+    className: cn(markerVariants({
+      variant,
+      className
+    })),
+    ...props
+  });
 }
-function MarkerIcon({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "marker-icon", "aria-hidden": "true", className: cn("size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4", className), ...props }));
+function MarkerIcon({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("span", {
+    "data-slot": "marker-icon",
+    "aria-hidden": "true",
+    className: cn("size-4 shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
+    ...props
+  });
 }
-function MarkerContent({ className, ...props }) {
-    return (_jsx("span", { "data-slot": "marker-content", className: cn("min-w-0 wrap-break-word group-data-[variant=separator]/marker:flex-none group-data-[variant=separator]/marker:text-center *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", className), ...props }));
+function MarkerContent({
+  className,
+  ...props
+}) {
+  return /*#__PURE__*/_jsx("span", {
+    "data-slot": "marker-content",
+    className: cn("min-w-0 wrap-break-word group-data-[variant=separator]/marker:flex-none group-data-[variant=separator]/marker:text-center *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", className),
+    ...props
+  });
 }
 export { Marker, MarkerContent, MarkerIcon, markerVariants };