@contractspec/lib.ui-kit-web 1.56.1 → 1.58.0

package/dist/browser/ui/page-header.js

@@ -0,0 +1,206 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/stack.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var vStackVariants = cva("flex flex-col", {
+  variants: {
+    gap: {
+      none: "gap-0",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6",
+      "2xl": "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    }
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "stretch",
+    justify: "start"
+  }
+});
+var VStack = React.forwardRef(({ className, gap, align, justify, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    className: cn(vStackVariants({ gap, align, justify }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+VStack.displayName = "VStack";
+var hStackVariants = cva("flex flex-row", {
+  variants: {
+    gap: {
+      none: "gap-0",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6",
+      "2xl": "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      wrapReverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "center",
+    justify: "start",
+    wrap: "wrap"
+  }
+});
+var HStack = React.forwardRef(({ className, gap, align, justify, wrap, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    className: cn(hStackVariants({ gap, align, justify, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+HStack.displayName = "HStack";
+var boxVariants = cva("flex flex-row", {
+  variants: {
+    gap: {
+      none: "gap-0",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6",
+      "2xl": "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      wrapReverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "center",
+    justify: "center",
+    wrap: "nowrap"
+  }
+});
+var Box = React.forwardRef(({ className, gap, align, justify, wrap, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    className: cn(boxVariants({ gap, align, justify, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+Box.displayName = "Box";
+// ui/page-header.tsx
+import { cva as cva2 } from "class-variance-authority";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var headerVariants = cva2("", {
+  variants: {
+    spacing: {
+      sm: "gap-1",
+      md: "gap-2",
+      lg: "gap-3"
+    }
+  },
+  defaultVariants: {
+    spacing: "md"
+  }
+});
+function PageHeader({
+  breadcrumb,
+  title,
+  subtitle,
+  actions,
+  spacing,
+  className
+}) {
+  return /* @__PURE__ */ jsxDEV2(VStack, {
+    className: cn2(headerVariants({ spacing }), className),
+    children: [
+      breadcrumb,
+      /* @__PURE__ */ jsxDEV2(HStack, {
+        className: "flex-col items-start justify-between md:flex-row",
+        children: [
+          /* @__PURE__ */ jsxDEV2(VStack, {
+            className: "gap-1",
+            children: [
+              /* @__PURE__ */ jsxDEV2("h1", {
+                className: "text-2xl font-semibold md:text-3xl",
+                children: title
+              }, undefined, false, undefined, this),
+              subtitle ? /* @__PURE__ */ jsxDEV2("p", {
+                className: "text-muted-foreground text-base",
+                children: subtitle
+              }, undefined, false, undefined, this) : null
+            ]
+          }, undefined, true, undefined, this),
+          actions ? /* @__PURE__ */ jsxDEV2("div", {
+            className: "flex items-center gap-2",
+            children: actions
+          }, undefined, false, undefined, this) : null
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  PageHeader
+};

package/dist/browser/ui/pagination.js

@@ -0,0 +1,156 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/button.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-hidden focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
+  variants: {
+    variant: {
+      default: "bg-primary text-primary-foreground hover:bg-primary/90",
+      destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+      outline: "border bg-background shadow-2xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+      secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+      ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+      link: "text-primary underline-offset-4 hover:underline"
+    },
+    size: {
+      default: "h-9 px-4 py-2 has-[>svg]:px-3",
+      sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+      lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+      icon: "size-9"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+var Button = React.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
+  if (asChild) {
+    return /* @__PURE__ */ jsxDEV(Slot, {
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }, undefined, false, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV("button", {
+    ref,
+    "data-slot": "button",
+    className: cn(buttonVariants({ variant, size, className })),
+    ...props
+  }, undefined, false, undefined, this);
+});
+Button.displayName = "Button";
+// ui/pagination.tsx
+import * as React2 from "react";
+import { ChevronLeft, ChevronRight, MoreHorizontal } from "lucide-react";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var Pagination = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxDEV2("nav", {
+  role: "navigation",
+  "aria-label": "pagination",
+  className: cn2("mx-auto flex w-full justify-center", className),
+  ...props
+}, undefined, false, undefined, this);
+Pagination.displayName = "Pagination";
+var PaginationContent = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxDEV2("ul", {
+  ref,
+  className: cn2("flex flex-row items-center gap-1", className),
+  ...props
+}, undefined, false, undefined, this));
+PaginationContent.displayName = "PaginationContent";
+var PaginationItem = React2.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxDEV2("li", {
+  ref,
+  className: cn2("", className),
+  ...props
+}, undefined, false, undefined, this));
+PaginationItem.displayName = "PaginationItem";
+var PaginationLink = ({
+  className,
+  isActive,
+  size = "icon",
+  ...props
+}) => /* @__PURE__ */ jsxDEV2("a", {
+  "aria-current": isActive ? "page" : undefined,
+  className: cn2(buttonVariants({
+    variant: isActive ? "outline" : "ghost",
+    size
+  }), className),
+  ...props
+}, undefined, false, undefined, this);
+PaginationLink.displayName = "PaginationLink";
+var PaginationPrevious = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxDEV2(PaginationLink, {
+  "aria-label": "Go to previous page",
+  size: "default",
+  className: cn2("gap-1 pl-2.5", className),
+  ...props,
+  children: [
+    /* @__PURE__ */ jsxDEV2(ChevronLeft, {
+      className: "h-4 w-4"
+    }, undefined, false, undefined, this),
+    /* @__PURE__ */ jsxDEV2("span", {
+      children: "Previous"
+    }, undefined, false, undefined, this)
+  ]
+}, undefined, true, undefined, this);
+PaginationPrevious.displayName = "PaginationPrevious";
+var PaginationNext = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxDEV2(PaginationLink, {
+  "aria-label": "Go to next page",
+  size: "default",
+  className: cn2("gap-1 pr-2.5", className),
+  ...props,
+  children: [
+    /* @__PURE__ */ jsxDEV2("span", {
+      children: "Next"
+    }, undefined, false, undefined, this),
+    /* @__PURE__ */ jsxDEV2(ChevronRight, {
+      className: "h-4 w-4"
+    }, undefined, false, undefined, this)
+  ]
+}, undefined, true, undefined, this);
+PaginationNext.displayName = "PaginationNext";
+var PaginationEllipsis = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxDEV2("span", {
+  "aria-hidden": true,
+  className: cn2("flex h-9 w-9 items-center justify-center", className),
+  ...props,
+  children: [
+    /* @__PURE__ */ jsxDEV2(MoreHorizontal, {
+      className: "h-4 w-4"
+    }, undefined, false, undefined, this),
+    /* @__PURE__ */ jsxDEV2("span", {
+      className: "sr-only",
+      children: "More pages"
+    }, undefined, false, undefined, this)
+  ]
+}, undefined, true, undefined, this);
+PaginationEllipsis.displayName = "PaginationEllipsis";
+export {
+  PaginationPrevious,
+  PaginationNext,
+  PaginationLink,
+  PaginationItem,
+  PaginationEllipsis,
+  PaginationContent,
+  Pagination
+};

package/dist/browser/ui/popover.js

@@ -0,0 +1,59 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/popover.tsx
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function Popover({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(PopoverPrimitive.Root, {
+    "data-slot": "popover",
+    ...props
+  }, undefined, false, undefined, this);
+}
+function PopoverTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(PopoverPrimitive.Trigger, {
+    "data-slot": "popover-trigger",
+    ...props
+  }, undefined, false, undefined, this);
+}
+function PopoverContent({
+  className,
+  align = "center",
+  sideOffset = 4,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(PopoverPrimitive.Portal, {
+    children: /* @__PURE__ */ jsxDEV(PopoverPrimitive.Content, {
+      "data-slot": "popover-content",
+      align,
+      sideOffset,
+      className: cn("bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden", className),
+      ...props
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function PopoverAnchor({
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(PopoverPrimitive.Anchor, {
+    "data-slot": "popover-anchor",
+    ...props
+  }, undefined, false, undefined, this);
+}
+export {
+  PopoverTrigger,
+  PopoverContent,
+  PopoverAnchor,
+  Popover
+};

package/dist/browser/ui/progress.js

@@ -0,0 +1,32 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/progress.tsx
+import * as ProgressPrimitive from "@radix-ui/react-progress";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function Progress({
+  className,
+  value,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(ProgressPrimitive.Root, {
+    "data-slot": "progress",
+    className: cn("bg-primary/20 relative h-2 w-full overflow-hidden rounded-full", className),
+    ...props,
+    children: /* @__PURE__ */ jsxDEV(ProgressPrimitive.Indicator, {
+      "data-slot": "progress-indicator",
+      className: "bg-primary h-full w-full flex-1 transition-all",
+      style: { transform: `translateX(-${100 - (value || 0)}%)` }
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  Progress
+};

package/dist/browser/ui/radio-group.js

@@ -0,0 +1,45 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/radio-group.tsx
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { CircleIcon } from "lucide-react";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function RadioGroup({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(RadioGroupPrimitive.Root, {
+    "data-slot": "radio-group",
+    className: cn("grid gap-3", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function RadioGroupItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(RadioGroupPrimitive.Item, {
+    "data-slot": "radio-group-item",
+    className: cn("aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-2xs outline-hidden transition-[color,box-shadow] focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50", className),
+    ...props,
+    children: /* @__PURE__ */ jsxDEV(RadioGroupPrimitive.Indicator, {
+      "data-slot": "radio-group-indicator",
+      className: "relative flex items-center justify-center",
+      children: /* @__PURE__ */ jsxDEV(CircleIcon, {
+        className: "fill-primary absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2"
+      }, undefined, false, undefined, this)
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  RadioGroupItem,
+  RadioGroup
+};

package/dist/browser/ui/resizable.js

@@ -0,0 +1,41 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/resizable.tsx
+import { GripVertical } from "lucide-react";
+import * as ResizablePrimitive from "react-resizable-panels";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+var ResizablePanelGroup = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxDEV(ResizablePrimitive.PanelGroup, {
+  className: cn("flex h-full w-full data-[panel-group-direction=vertical]:flex-col", className),
+  ...props
+}, undefined, false, undefined, this);
+var ResizablePanel = ResizablePrimitive.Panel;
+var ResizableHandle = ({
+  withHandle,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxDEV(ResizablePrimitive.PanelResizeHandle, {
+  className: cn("bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90", className),
+  ...props,
+  children: withHandle && /* @__PURE__ */ jsxDEV("div", {
+    className: "bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border",
+    children: /* @__PURE__ */ jsxDEV(GripVertical, {
+      className: "h-2.5 w-2.5"
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this)
+}, undefined, false, undefined, this);
+export {
+  ResizablePanelGroup,
+  ResizablePanel,
+  ResizableHandle
+};

package/dist/browser/ui/route-announcer.js

@@ -0,0 +1,28 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/route-announcer.tsx
+import * as React from "react";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function RouteAnnouncer({ title }) {
+  const [message, setMessage] = React.useState("");
+  React.useEffect(() => {
+    if (title)
+      setMessage(title);
+  }, [title]);
+  return /* @__PURE__ */ jsxDEV("div", {
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    className: "sr-only",
+    children: message
+  }, undefined, false, undefined, this);
+}
+export {
+  RouteAnnouncer
+};

package/dist/browser/ui/scroll-area.js

@@ -0,0 +1,53 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
+// ui/scroll-area.tsx
+import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+function ScrollArea({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(ScrollAreaPrimitive.Root, {
+    "data-slot": "scroll-area",
+    className: cn("relative", className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsxDEV(ScrollAreaPrimitive.Viewport, {
+        "data-slot": "scroll-area-viewport",
+        className: "focus-visible:ring-ring/50 size-full rounded-[inherit] outline-hidden transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1",
+        children
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV(ScrollBar, {}, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV(ScrollAreaPrimitive.Corner, {}, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+function ScrollBar({
+  className,
+  orientation = "vertical",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV(ScrollAreaPrimitive.ScrollAreaScrollbar, {
+    "data-slot": "scroll-area-scrollbar",
+    orientation,
+    className: cn("flex touch-none p-px transition-colors select-none", orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent", orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent", className),
+    ...props,
+    children: /* @__PURE__ */ jsxDEV(ScrollAreaPrimitive.ScrollAreaThumb, {
+      "data-slot": "scroll-area-thumb",
+      className: "bg-border relative flex-1 rounded-full"
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  ScrollBar,
+  ScrollArea
+};