snapshot of https://github.com/shadcn-ui/ui.git (main, 2026-09-15; blobs > 131072B omitted)

2026-09-15 22:44:43 +05:00
commit 1416db152c
5727 changed files with 630238 additions and 0 deletions
--- a/apps/v4/registry/bases/base/ui/bubble.tsx
+++ b/apps/v4/registry/bases/base/ui/bubble.tsx
@@ -0,0 +1,120 @@
+import * as React from "react"
+import { mergeProps } from "@base-ui/react/merge-props"
+import { useRender } from "@base-ui/react/use-render"
+import { cva, type VariantProps } from "class-variance-authority"
+import { cn } from "cn"
+
+function BubbleGroup({ className, ...props }: React.ComponentProps<"div">) {
+  return (
+    <div
+      data-slot="bubble-group"
+      className={cn("cn-bubble-group flex min-w-0 flex-col", className)}
+      {...props}
+    />
+  )
+}
+
+const bubbleVariants = cva(
+  "cn-bubble group/bubble relative flex w-fit min-w-0 flex-col",
+  {
+    variants: {
+      variant: {
+        default: "cn-bubble-variant-default",
+        secondary: "cn-bubble-variant-secondary",
+        muted: "cn-bubble-variant-muted",
+        tinted: "cn-bubble-variant-tinted",
+        outline: "cn-bubble-variant-outline",
+        ghost: "cn-bubble-variant-ghost",
+        destructive: "cn-bubble-variant-destructive",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  }
+)
+
+function Bubble({
+  variant = "default",
+  align = "start",
+  className,
+  ...props
+}: React.ComponentProps<"div"> &
+  VariantProps<typeof bubbleVariants> & {
+    align?: "start" | "end"
+  }) {
+  return (
+    <div
+      data-slot="bubble"
+      data-variant={variant}
+      data-align={align}
+      className={cn(bubbleVariants({ variant }), className)}
+      {...props}
+    />
+  )
+}
+
+function BubbleContent({
+  className,
+  render,
+  ...props
+}: useRender.ComponentProps<"div">) {
+  return useRender({
+    defaultTagName: "div",
+    props: mergeProps<"div">(
+      {
+        className: cn(
+          "cn-bubble-content w-fit max-w-full min-w-0 overflow-hidden wrap-break-word [button]:text-left [button,a]:transition-colors",
+          className
+        ),
+      },
+      props
+    ),
+    render,
+    state: {
+      slot: "bubble-content",
+    },
+  })
+}
+
+const bubbleReactionsVariants = cva(
+  "cn-bubble-reactions absolute z-10 flex w-fit items-center justify-center",
+  {
+    variants: {
+      side: {
+        top: "cn-bubble-reactions-side-top",
+        bottom: "cn-bubble-reactions-side-bottom",
+      },
+      align: {
+        start: "cn-bubble-reactions-align-start",
+        end: "cn-bubble-reactions-align-end",
+      },
+    },
+    defaultVariants: {
+      side: "bottom",
+      align: "end",
+    },
+  }
+)
+
+function BubbleReactions({
+  side = "bottom",
+  align = "end",
+  className,
+  ...props
+}: React.ComponentProps<"div"> & {
+  align?: "start" | "end"
+  side?: "top" | "bottom"
+}) {
+  return (
+    <div
+      data-slot="bubble-reactions"
+      data-align={align}
+      data-side={side}
+      className={cn(bubbleReactionsVariants({ side, align }), className)}
+      {...props}
+    />
+  )
+}
+
+export { BubbleGroup, Bubble, BubbleContent, BubbleReactions }