@hanzo/ui 5.3.34 → 5.3.36

package/dist/primitives/navigation-menu.js

@@ -0,0 +1,29 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
+import { cva } from 'class-variance-authority';
+import { ChevronDown } from 'lucide-react';
+import { cn } from '../util';
+const NavigationMenu = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(NavigationMenuPrimitive.Root, { ref: ref, className: cn('relative z-10 flex max-w-max flex-1 items-center justify-center', className), ...props, children: children })));
+NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;
+const NavigationMenuList = React.forwardRef(({ className, ...props }, ref) => (_jsx(NavigationMenuPrimitive.List, { ref: ref, className: cn('group flex flex-1 list-none items-center justify-center space-x-1', className), ...props })));
+NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;
+const NavigationMenuItem = React.forwardRef(({ className, ...props }, ref) => (_jsx(NavigationMenuPrimitive.Item, { ref: ref, className: cn("relative", className), ...props })));
+NavigationMenuItem.displayName = 'NavigationMenuItem';
+const navigationMenuTriggerStyle = cva('group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 ' +
+    'text-sm font-medium transition-colors hover:bg-level-1 text-foreground hover:text-accent ' +
+    ' focus:text-accent focus:outline-none disabled:pointer-events-none disabled:opacity-50 ' +
+    'data-[active]:bg-level-1/50 data-[state=open]:bg-level-1/50');
+const NavigationMenuTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(NavigationMenuPrimitive.Trigger, { ref: ref, className: cn(navigationMenuTriggerStyle(), 'group', className), ...props, children: [children, ' ', _jsx(ChevronDown, { className: 'relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180', "aria-hidden": 'true' })] })));
+NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;
+const NavigationMenuContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(NavigationMenuPrimitive.Content, { ref: ref, className: cn("right-0  absolute", "absolute top-full w-fit bg-popover mt-[5px]", "data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 bg-background overflow-hidden rounded-md border", className), ...props })));
+NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;
+const NavigationMenuLink = NavigationMenuPrimitive.Link;
+const NavigationMenuViewport = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { className: cn('absolute left-0 top-full flex justify-center'), children: _jsx(NavigationMenuPrimitive.Viewport, { className: cn('origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border ', 'bg-background text-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]', className), ref: ref, ...props }) })));
+NavigationMenuViewport.displayName =
+    NavigationMenuPrimitive.Viewport.displayName;
+const NavigationMenuIndicator = React.forwardRef(({ className, ...props }, ref) => (_jsx(NavigationMenuPrimitive.Indicator, { ref: ref, className: cn('top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden', 'data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in', className), ...props, children: _jsx("div", { className: 'relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md' }) })));
+NavigationMenuIndicator.displayName =
+    NavigationMenuPrimitive.Indicator.displayName;
+export { navigationMenuTriggerStyle, NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuContent, NavigationMenuTrigger, NavigationMenuLink, NavigationMenuIndicator, NavigationMenuViewport, };

package/dist/primitives/next/image.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { ImageDef, Dimensions, MediaTransform } from '../../types';
+declare const Image: React.FC<{
+    def: ImageDef;
+    constrainTo?: Dimensions;
+    transform?: MediaTransform;
+    fullWidth?: boolean;
+    className?: string;
+    preload?: boolean;
+}>;
+export default Image;
+//# sourceMappingURL=image.d.ts.map

package/dist/primitives/next/image.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"image.d.ts","sourceRoot":"","sources":["../../../primitives/next/image.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAGvE,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC;IACpB,GAAG,EAAE,QAAQ,CAAA;IACb,WAAW,CAAC,EAAE,UAAU,CAAA;IACxB,SAAS,CAAC,EAAE,cAAc,CAAA;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,CA0EA,CAAA;AAED,eAAe,KAAK,CAAA"}

package/dist/primitives/next/image.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import NextImage from 'next/image';
+import { constrain, cn, spreadToTransform } from '../../util';
+const Image = ({ def, constrainTo, transform = {}, fullWidth = false, className = '', preload = false }) => {
+    const { src, alt: _alt, dim, sizes, svgFillClass: _svgFillClass, } = def;
+    const toSpread = {};
+    if (fullWidth) {
+        toSpread.style = {
+            width: '100%',
+            height: 'auto',
+            ...spreadToTransform(transform)
+        };
+        if (constrainTo) {
+            toSpread.style.maxWidth = constrainTo.w;
+            toSpread.style.maxHeight = constrainTo.h;
+        }
+    }
+    else {
+        const resolved = constrainTo ? constrain(dim, constrainTo) : dim;
+        toSpread.width = resolved.w;
+        toSpread.height = resolved.h;
+        toSpread.style = { ...spreadToTransform(transform) };
+    }
+    if (sizes) {
+        toSpread.sizes = sizes;
+    }
+    // Note: cannot be spread (a Next thing)
+    let alt;
+    if (_alt) {
+        alt = _alt;
+    }
+    else {
+        const tokens = src.split('/');
+        // Something remotely meaningful
+        alt = (tokens.length > 0) ? tokens[tokens.length - 1] : src;
+    }
+    const svgFillClass = _svgFillClass ?? '';
+    return (fullWidth) ? (_jsx("div", { className: 'relative flex flex-col items-center justify-center w-full', children: _jsx(NextImage, { src: src, alt: alt, ...toSpread, priority: preload, loading: preload ? 'eager' : 'lazy', className: cn(svgFillClass, className) }) })) : (_jsx(NextImage, { src: src, alt: alt, ...toSpread, priority: preload, loading: preload ? 'eager' : 'lazy', className: cn(svgFillClass, className) }));
+};
+export default Image;

package/dist/primitives/next/index.d.ts

@@ -0,0 +1,8 @@
+export { default as Image } from './image';
+export { default as InlineIcon } from './inline-icon';
+export { default as LinkElement } from './link-element';
+export { default as MDXLink } from './mdx-link';
+export { default as MediaStack } from './media-stack';
+export { default as NavItems } from './nav-items';
+export { default as YouTubeEmbed } from './youtube-embed';
+//# sourceMappingURL=index.d.ts.map

package/dist/primitives/next/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../primitives/next/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,gBAAgB,CAAA;AACvD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC/C,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAA;AACjD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/primitives/next/index.js

@@ -0,0 +1,7 @@
+export { default as Image } from './image';
+export { default as InlineIcon } from './inline-icon';
+export { default as LinkElement } from './link-element';
+export { default as MDXLink } from './mdx-link';
+export { default as MediaStack } from './media-stack';
+export { default as NavItems } from './nav-items';
+export { default as YouTubeEmbed } from './youtube-embed';

package/dist/primitives/next/inline-icon.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+declare const InlineIcon: React.FC<{
+    /**
+     * If a ReactNode is passed in, it should be set to 'w-full h-auto' so that it can be sized
+     * according to width of parent.
+     */
+    icon: React.ReactNode;
+    /** default should be handled by calling code. */
+    size?: number;
+    agent?: string;
+    className?: string;
+}>;
+export default InlineIcon;
+//# sourceMappingURL=inline-icon.d.ts.map

package/dist/primitives/next/inline-icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"inline-icon.d.ts","sourceRoot":"","sources":["../../../primitives/next/inline-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IACvB;;;OAGG;IACL,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACnB,iDAAiD;IACnD,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAkBA,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/primitives/next/inline-icon.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Image from 'next/image';
+const InlineIcon = ({ icon, size, agent, className = '' }) => {
+    if (!icon)
+        return null;
+    const phone = agent === 'phone';
+    if (typeof icon === 'string') {
+        const _size = (phone && size) ? (size * .75) : size;
+        return (_jsx(Image, { src: icon, width: _size, height: _size, alt: 'icon', className: className }));
+    }
+    return (_jsx("div", { className: className, children: icon }));
+};
+export default InlineIcon;

package/dist/primitives/next/link-element.d.ts

@@ -0,0 +1,24 @@
+import React, { PropsWithChildren } from 'react';
+import type { LinkDef } from '../../types';
+import { buttonVariants } from '../button';
+import { type VariantProps } from '../../util';
+/**
+ * If this is rendered directly (and not auto generated in a Block)
+ * and it has any children, title, icon, and iconAfter
+ * are ignore.
+ */
+declare const LinkElement: React.FC<PropsWithChildren & VariantProps<typeof buttonVariants> & {
+    def: LinkDef;
+    /**
+     * Use to trigger other events in addition to the
+     * link action itself. For example, to also close a drawer menu.
+     */
+    onClick?: () => void;
+    /** overrides def (eg, for title area)*/
+    icon?: React.ReactNode;
+    /** overrides def */
+    iconAfter?: boolean;
+    className?: string;
+}>;
+export default LinkElement;
+//# sourceMappingURL=link-element.d.ts.map

package/dist/primitives/next/link-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-element.d.ts","sourceRoot":"","sources":["../../../primitives/next/link-element.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAGhD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAO,aAAa,CAAA;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAA;AAC1C,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,YAAY,CAAA;AAEhD;;;;GAIG;AACL,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CACzB,iBAAiB,GACjB,YAAY,CAAC,OAAO,cAAc,CAAC,GACrC;IACE,GAAG,EAAE,OAAO,CAAC;IAEX;;;OAGG;IACL,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IAElB,wCAAwC;IAC1C,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACpB,oBAAoB;IACtB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAuEA,CAAA;AAED,eAAe,WAAW,CAAA"}

package/dist/primitives/next/link-element.js

@@ -0,0 +1,47 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import Link from 'next/link';
+import { buttonVariants } from '../button';
+import { cn } from '../../util';
+/**
+ * If this is rendered directly (and not auto generated in a Block)
+ * and it has any children, title, icon, and iconAfter
+ * are ignore.
+ */
+const LinkElement = ({ def, 
+// DO NOT provide a default to any of the props that also appear in def!
+onClick, size, variant, icon, iconAfter, className = '', children, }) => {
+    const { href, newTab, variant: defVariant, size: defSize, title } = def;
+    const linkProps = {};
+    // As per LinkDef docs
+    if (href.startsWith('http') || href.startsWith('mailto')) {
+        linkProps.rel = 'noreferrer noopener';
+        if (newTab ?? true) {
+            linkProps.target = '_blank';
+        }
+    }
+    else if (newTab) {
+        linkProps.target = '_blank';
+    }
+    const toSpread = {
+        href,
+        ...(onClick ? { onClick } : {}),
+        ...linkProps
+    };
+    const Contents = () => {
+        if (React.Children.count(children) > 0)
+            return children;
+        // Props > def fields > defaults.
+        const _icon = (icon) ? icon : (def.icon) ? def.icon : undefined;
+        const _iconAfter = (iconAfter) ? iconAfter : (def.iconAfter) ? def.iconAfter : false;
+        // 'title' is not guaranteed as it could be an icon only button / link
+        return (_jsxs(_Fragment, { children: [_icon && !_iconAfter && (_jsx("div", { className: 'pr-1', children: _icon })), title && (_jsx("div", { children: title })), _icon && _iconAfter && (_jsx("div", { className: 'pl-1', children: _icon }))] }));
+    };
+    return (_jsx(Link, { className: cn(buttonVariants({
+            variant: variant ? variant : (defVariant ? defVariant : 'link'),
+            size: size ? size : (defSize || 'default'),
+        }), 
+        // This is a "label only" LinkDef.  cf: footer"
+        ((href.length > 0 || onClick) ? '' : 'pointer-events-none'), className), ...toSpread, children: _jsx(Contents, {}) }));
+};
+export default LinkElement;

package/dist/primitives/next/mdx-link.d.ts

@@ -0,0 +1,4 @@
+import React, { AnchorHTMLAttributes } from 'react';
+declare const MDXLink: React.FC<AnchorHTMLAttributes<HTMLAnchorElement>>;
+export default MDXLink;
+//# sourceMappingURL=mdx-link.d.ts.map

package/dist/primitives/next/mdx-link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mdx-link.d.ts","sourceRoot":"","sources":["../../../primitives/next/mdx-link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAG,EAAE,oBAAoB,EAA0B,MAAM,OAAO,CAAA;AAG5E,QAAA,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,CAgB9D,CAAA;AAED,eAAe,OAAO,CAAA"}

package/dist/primitives/next/mdx-link.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import Link from 'next/link';
+const MDXLink = ({ href, children, ...rest }) => {
+    // internal link
+    if (href && (href.startsWith('/'))) {
+        return (_jsx(Link, { href: href, ...rest, children: children }));
+    }
+    return _jsx("a", { target: "_blank", href: href, ...rest, children: children });
+};
+export default MDXLink;

package/dist/primitives/next/media-stack.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { MediaStackDef, Dimensions } from '../../types';
+declare const MediaStack: React.FC<{
+    media: MediaStackDef;
+    constrainTo?: Dimensions;
+    clx?: string;
+}>;
+export default MediaStack;
+//# sourceMappingURL=media-stack.d.ts.map

package/dist/primitives/next/media-stack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-stack.d.ts","sourceRoot":"","sources":["../../../primitives/next/media-stack.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAK5D,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC;IACzB,KAAK,EAAE,aAAa,CAAA;IACpB,WAAW,CAAC,EAAE,UAAU,CAAA;IACxB,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAqCA,CAAA;AAED,eAAe,UAAU,CAAA"}

package/dist/primitives/next/media-stack.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn, constrain, spreadToTransform } from '../../util';
+import Image from './image';
+import VideoPlayer from '../video-player';
+const MediaStack = ({ media, constrainTo: cnst = { w: 250, h: 250 }, clx = '' }) => {
+    const { img, video, mediaTransform } = media;
+    const transform = mediaTransform ?? {};
+    // Order of precedence: MP4 > Image
+    // For 3D/Spline support, use @hanzo/ui/spline MediaStack instead
+    if (video) {
+        const dim = constrain(video.dim.md, cnst);
+        return (_jsx(VideoPlayer, { className: clx, sources: video.sources, width: dim.w, height: dim.h, style: {
+                minHeight: dim.h,
+                ...spreadToTransform(transform)
+            }, ...video.videoProps }));
+    }
+    return img ? (_jsx(Image, { def: img, constrainTo: cnst, className: clx, transform: transform })) : (_jsx("div", { style: { width: cnst.w, height: cnst.h }, className: cn('bg-level-2', clx) }));
+};
+export default MediaStack;

package/dist/primitives/next/nav-items.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { LinkDef } from '../../types';
+declare const NavItems: React.FC<{
+    items: LinkDef[];
+    className?: string;
+    as?: React.ElementType;
+    itemClx?: string | ((def: LinkDef) => string);
+    currentAs?: string;
+}>;
+export default NavItems;
+//# sourceMappingURL=nav-items.d.ts.map

package/dist/primitives/next/nav-items.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"nav-items.d.ts","sourceRoot":"","sources":["../../../primitives/next/nav-items.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAO,aAAa,CAAA;AAI3C,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC;IACvB,KAAK,EAAE,OAAO,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,GAAG,EAAE,OAAO,KAAK,MAAM,CAAC,CAAC;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CA8BA,CAAA;AAED,eAAe,QAAQ,CAAA"}

package/dist/primitives/next/nav-items.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import LinkElement from './link-element';
+import { cn } from '../../util';
+const NavItems = ({ items, className = '', itemClx, as: Tag = 'nav', currentAs }) => (items.length ? (_jsx(Tag, { className: className, children: items.map((item, index) => {
+        const variant = item.variant ?? 'link';
+        let internalClx = '';
+        // note that linkFG (or any other variant of 'link') 
+        // will not get assigned these classes,
+        // and will remain styles is 'foreground' (hence the name)
+        if (variant === 'link') {
+            internalClx += 'text-nav hover:text-nav-hover ';
+            if (currentAs && currentAs === item.href) {
+                internalClx += 'text-nav-current ';
+            }
+        }
+        else {
+            internalClx += 'min-w-0 lg:min-w-0 ';
+        }
+        const _itemClx = (itemClx) ? (typeof itemClx === 'string' ? itemClx : itemClx(item)) : '';
+        return (_jsx(LinkElement, { def: item, className: cn(internalClx, _itemClx) }, index));
+    }) })) : null);
+export default NavItems;

package/dist/primitives/next/youtube-embed.d.ts

@@ -0,0 +1,12 @@
+declare const YouTubeEmbed: React.FC<{
+    youtubeID: string;
+    width: number;
+    height: number;
+    buttonSize?: number;
+    timeAt?: string;
+    title?: string;
+    caption?: string;
+    className?: string;
+}>;
+export default YouTubeEmbed;
+//# sourceMappingURL=youtube-embed.d.ts.map

package/dist/primitives/next/youtube-embed.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"youtube-embed.d.ts","sourceRoot":"","sources":["../../../primitives/next/youtube-embed.tsx"],"names":[],"mappings":"AAUA,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC;IAC3B,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CA6DA,CAAA;AAED,eAAe,YAAY,CAAA"}

package/dist/primitives/next/youtube-embed.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import Image from 'next/image';
+import * as Icons from '../icons';
+// Concept based on https://www.youtube.com/watch?v=lLqRchtjN00
+// (https://github.com/a-trost/fableton)
+const YouTubeEmbed = ({ youtubeID, width, height, buttonSize = 100, timeAt, title, caption, className = '' }) => {
+    const [showVideo, setShowVideo] = useState(false);
+    // re autoplay: https://stackoverflow.com/a/45610557/11645689
+    return (_jsx("div", { className: className, children: showVideo ? (_jsx("iframe", { width: width, height: height, src: `https://www.youtube-nocookie.com/embed/${youtubeID + ((timeAt) ? `?t=${timeAt}&` : '?')}rel=0&autoplay=1`, allow: 'accelerometer ; autoplay *; clipboard-write *; encrypted-media *; gyroscope *; picture-in-picture *;', allowFullScreen: true, title: title || 'Youtube video', className: 'aspect-[16/9] h-full w-full p-0 border-0 ' })) : (_jsxs("button", { type: 'button', onClick: () => setShowVideo(true), className: 'relative aspect-[16/9] w-full', "aria-label": `Play video ${title}`, children: [_jsx(Image, { src: `https://img.youtube.com/vi/${youtubeID}/maxresdefault.jpg`, alt: '', className: 'h-full w-full', width: width, height: height, loading: 'lazy' }), _jsx("div", { className: //https://stackoverflow.com/a/23384995/11645689
+                    'absolute z-above-content-2 left-[50%] top-[50%] -translate-y-2/4 -translate-x-2/4 ' +
+                        'grid place-items-center ' +
+                        'text-xl text-white opacity-90', children: _jsx(Icons.youtube, { width: buttonSize, height: buttonSize, role: 'img', className: 'transform transition hover:scale-110', 'aria-hidden': true }) }), caption && _jsx("p", { className: 'hidden md:block whitespace-nowrap typography absolute z-above-content left-[50%] top-[20px] -translate-x-2/4 ', children: caption })] })) }));
+};
+export default YouTubeEmbed;

package/dist/primitives/popover.d.ts

@@ -0,0 +1,12 @@
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as React from 'react';
+declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
+declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
+declare const PopoverClose: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const PopoverContent: {
+    ({ className, align, sideOffset, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor, PopoverClose };
+//# sourceMappingURL=popover.d.ts.map

package/dist/primitives/popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover.d.ts","sourceRoot":"","sources":["../../primitives/popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,gBAAgB,MAAM,yBAAyB,CAAC;AAC5D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,OAAO,yCAAwB,CAAC;AAEtC,QAAA,MAAM,cAAc,gHAA2B,CAAC;AAChD,QAAA,MAAM,aAAa,4GAA0B,CAAC;AAC9C,QAAA,MAAM,YAAY,8GAAyB,CAAC;AAE5C,QAAA,MAAM,cAAc;iDAKjB,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,OAAO,CAAC;;CAavD,CAAC;AAGF,OAAO,EAAE,OAAO,EAAE,cAAc,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,EAAE,CAAC"}

package/dist/primitives/popover.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import { cn } from '../src/utils';
+const Popover = PopoverPrimitive.Root;
+const PopoverTrigger = PopoverPrimitive.Trigger;
+const PopoverAnchor = PopoverPrimitive.Anchor;
+const PopoverClose = PopoverPrimitive.Close;
+const PopoverContent = ({ className, align = 'center', sideOffset = 4, ...props }) => (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Content, { align: align, className: cn('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', 'bg-bg-dark border-divider z-50 w-72 rounded-md border p-4 text-gray-50 shadow-lg shadow-md outline-hidden', className), sideOffset: sideOffset, ...props }) }));
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor, PopoverClose };

package/dist/primitives/pretty-json-print.d.ts

@@ -0,0 +1,5 @@
+export declare const PrettyJsonPrint: ({ json, className, }: {
+    json: string | object;
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=pretty-json-print.d.ts.map

package/dist/primitives/pretty-json-print.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pretty-json-print.d.ts","sourceRoot":"","sources":["../../primitives/pretty-json-print.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,yBAGzB;IACD,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,4CAkBA,CAAC"}

package/dist/primitives/pretty-json-print.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { cn } from '../src/utils';
+export const PrettyJsonPrint = ({ json, className, }) => {
+    const formattedJson = useMemo(() => {
+        let formattedValue = `Unparseable JSON: String(${json})`;
+        if (typeof json === 'object') {
+            formattedValue = JSON.stringify(json, null, 2);
+        }
+        else if (typeof json === 'string') {
+            try {
+                const parsedJson = JSON.parse(json);
+                formattedValue = JSON.stringify(parsedJson, null, 2);
+            }
+            catch (error) {
+                console.error('error parsing json', error);
+            }
+        }
+        return formattedValue;
+    }, [json]);
+    return (_jsx("pre", { className: cn('overflow-x-scroll', className), children: formattedJson }));
+};

package/dist/primitives/progress.d.ts

@@ -0,0 +1,9 @@
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import * as React from 'react';
+declare const Progress: {
+    ({ className, value, ...props }: React.ComponentProps<typeof ProgressPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
+export { Progress };
+export default Progress;
+//# sourceMappingURL=progress.d.ts.map

package/dist/primitives/progress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.d.ts","sourceRoot":"","sources":["../../primitives/progress.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAC9D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,QAAQ;qCAIX,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC;;CAarD,CAAC;AAGF,OAAO,EAAE,QAAQ,EAAE,CAAC;AACpB,eAAe,QAAQ,CAAC"}

package/dist/primitives/progress.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import { cn } from '../src/utils';
+const Progress = ({ className, value, ...props }) => (_jsx(ProgressPrimitive.Root, { className: cn('bg-bg-quaternary relative h-4 w-full overflow-hidden', className), ...props, children: _jsx(ProgressPrimitive.Indicator, { className: "h-full w-full flex-1 bg-green-500 transition-all", style: { transform: `translateX(-${100 - (value || 0)}%)` } }) }));
+Progress.displayName = ProgressPrimitive.Root.displayName;
+export { Progress };
+export default Progress;

package/dist/primitives/prompt-textarea.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+export interface PromptTextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
+    isLoading?: boolean;
+    label?: string;
+    field: {
+        onChange: (...event: any[]) => void;
+        onBlur: () => void;
+        value: any;
+        disabled?: boolean;
+        name: string;
+        placeholder?: string;
+    };
+}
+declare const PromptTextarea: {
+    ({ className, ...props }: PromptTextareaProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { PromptTextarea };
+//# sourceMappingURL=prompt-textarea.d.ts.map

package/dist/primitives/prompt-textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prompt-textarea.d.ts","sourceRoot":"","sources":["../../primitives/prompt-textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,WAAW,mBACf,SAAQ,KAAK,CAAC,sBAAsB,CAAC,mBAAmB,CAAC;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE;QACL,QAAQ,EAAE,CAAC,GAAG,KAAK,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;QACpC,MAAM,EAAE,MAAM,IAAI,CAAC;QACnB,KAAK,EAAE,GAAG,CAAC;QACX,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,IAAI,EAAE,MAAM,CAAC;QACb,WAAW,CAAC,EAAE,MAAM,CAAC;KACtB,CAAC;CACH;AAED,QAAA,MAAM,cAAc;8BAA6B,mBAAmB;;CA+CnE,CAAC;AAGF,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/primitives/prompt-textarea.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../src/utils';
+import { DotsLoader } from './dots-loader';
+import { FormLabel } from './form';
+const MIN_TEXTAREA_HEIGHT = 32;
+const PromptTextarea = ({ className, ...props }) => {
+    const textareaRef = React.useRef(null);
+    React.useLayoutEffect(() => {
+        // Reset height - important to shrink on delete
+        if (!textareaRef.current)
+            return;
+        textareaRef.current.style.height = '60px';
+        // Set height
+        textareaRef.current.style.height = `${Math.max(textareaRef.current.scrollHeight + 2, MIN_TEXTAREA_HEIGHT)}px`;
+        if (props.autoFocus !== undefined && props.autoFocus) {
+            textareaRef.current.focus();
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [props.value]);
+    return (_jsxs(_Fragment, { children: [_jsx("textarea", { className: cn('flex w-full rounded-md border border-gray-200 bg-gray-400 px-4 py-2 pt-4 text-sm break-words placeholder-gray-100 placeholder:text-base focus-visible:ring-1 focus-visible:ring-gray-100 focus-visible:outline-hidden focus-visible:ring-inset disabled:cursor-not-allowed disabled:opacity-50', className), style: {
+                    minHeight: MIN_TEXTAREA_HEIGHT,
+                    resize: 'none',
+                    maxHeight: '300px',
+                }, ...props.field, onKeyDown: props.onKeyDown, ref: textareaRef, ...(!props.isLoading && {
+                    placeholder: props.label,
+                }) }), props.isLoading ? (_jsx(DotsLoader, { className: "absolute top-6 left-4" })) : null, _jsx(FormLabel, { className: "sr-only", children: props.label })] }));
+};
+PromptTextarea.displayName = 'PromptTextarea';
+export { PromptTextarea };

package/dist/primitives/radio-group.d.ts

@@ -0,0 +1,12 @@
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import * as React from 'react';
+declare const RadioGroup: {
+    ({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
+declare const RadioGroupItem: {
+    ({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
+export { RadioGroup, RadioGroupItem };
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/primitives/radio-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../primitives/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AAEnE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,UAAU;8BAGb,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC;;CAOvD,CAAC;AAGF,QAAA,MAAM,cAAc;8BAGjB,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC;;CAcvD,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,CAAC"}

package/dist/primitives/radio-group.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import { Circle } from 'lucide-react';
+import { cn } from '../src/utils';
+const RadioGroup = ({ className, ...props }) => {
+    return (_jsx(RadioGroupPrimitive.Root, { className: cn('grid gap-2', className), ...props }));
+};
+RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
+const RadioGroupItem = ({ className, ...props }) => {
+    return (_jsx(RadioGroupPrimitive.Item, { className: cn('border-brand text-brand ring-offset-background focus-visible:ring-ring aspect-square h-4 w-4 rounded-full border focus:outline-hidden focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50', className), ...props, children: _jsx(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: _jsx(Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) }) }));
+};
+RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
+export { RadioGroup, RadioGroupItem };

package/dist/primitives/resizable.d.ts

@@ -0,0 +1,24 @@
+import * as ResizablePrimitive from 'react-resizable-panels';
+declare const ResizablePanelGroup: ({ className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) => import("react/jsx-runtime").JSX.Element;
+declare const ResizablePanel: import("react").ForwardRefExoticComponent<Omit<import("react").HTMLAttributes<keyof HTMLElementTagNameMap>, "id" | "onResize"> & {
+    className?: string | undefined;
+    collapsedSize?: number | undefined;
+    collapsible?: boolean | undefined;
+    defaultSize?: number | undefined;
+    id?: string | undefined;
+    maxSize?: number | undefined;
+    minSize?: number | undefined;
+    onCollapse?: ResizablePrimitive.PanelOnCollapse | undefined;
+    onExpand?: ResizablePrimitive.PanelOnExpand | undefined;
+    onResize?: ResizablePrimitive.PanelOnResize | undefined;
+    order?: number | undefined;
+    style?: object | undefined;
+    tagName?: keyof HTMLElementTagNameMap | undefined;
+} & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<ResizablePrimitive.ImperativePanelHandle>>;
+declare const ResizableHandle: ({ withHandle, className, ...props }: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
+    withHandle?: boolean;
+}) => import("react/jsx-runtime").JSX.Element;
+export { ResizablePanelGroup, ResizablePanel, ResizableHandle };
+//# sourceMappingURL=resizable.d.ts.map

package/dist/primitives/resizable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizable.d.ts","sourceRoot":"","sources":["../../primitives/resizable.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,kBAAkB,MAAM,wBAAwB,CAAC;AAI7D,QAAA,MAAM,mBAAmB,4BAGtB,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,UAAU,CAAC,4CAQ5D,CAAC;AAEF,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;sBA6B+qB,OAAO;4EA7B3pB,CAAC;AAEhD,QAAA,MAAM,eAAe,wCAIlB,KAAK,CAAC,cAAc,CAAC,OAAO,kBAAkB,CAAC,iBAAiB,CAAC,GAAG;IACrE,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,4CAkBA,CAAC;AAEF,OAAO,EAAE,mBAAmB,EAAE,cAAc,EAAE,eAAe,EAAE,CAAC"}

package/dist/primitives/resizable.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { GripVertical } from 'lucide-react';
+import * as ResizablePrimitive from 'react-resizable-panels';
+import { cn } from '../src/utils';
+const ResizablePanelGroup = ({ className, ...props }) => (_jsx(ResizablePrimitive.PanelGroup, { className: cn('flex h-full w-full data-[panel-group-direction=vertical]:flex-col', className), ...props }));
+const ResizablePanel = ResizablePrimitive.Panel;
+const ResizableHandle = ({ withHandle, className, ...props }) => (_jsx(ResizablePrimitive.PanelResizeHandle, { className: cn('focus-visible:ring-ring relative flex w-px items-center justify-center bg-gray-100 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', 'data-[resize-handle-state=drag]:after:bg-bg-secondary', 'data-[resize-handle-state=hover]:after:bg-bg-secondary', 'after:w-[1px] data-[panel-group-direction=vertical]:after:h-[1px]', className), ...props, children: withHandle && (_jsx("div", { className: "z-10 flex h-4 w-3 items-center justify-center rounded-xs border bg-gray-200", children: _jsx(GripVertical, { className: "h-2.5 w-2.5" }) })) }));
+export { ResizablePanelGroup, ResizablePanel, ResizableHandle };

package/dist/primitives/scroll-area.d.ts

@@ -0,0 +1,14 @@
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import * as React from 'react';
+declare const ScrollArea: {
+    ({ className, children, ref, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.Root> & {
+        ref?: React.RefObject<HTMLDivElement | null>;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
+declare const ScrollBar: {
+    ({ className, orientation, ...props }: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>): import("react/jsx-runtime").JSX.Element;
+    displayName: string | undefined;
+};
+export { ScrollArea, ScrollBar };
+//# sourceMappingURL=scroll-area.d.ts.map

package/dist/primitives/scroll-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.d.ts","sourceRoot":"","sources":["../../primitives/scroll-area.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AACnE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,QAAA,MAAM,UAAU;6CAKb,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,GAAG;QACzD,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;KAC9C;;CAcA,CAAC;AAGF,QAAA,MAAM,SAAS;2CAIZ,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,mBAAmB,CAAC;;CAoBtE,CAAC;AAGF,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,CAAC"}

package/dist/primitives/scroll-area.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import { cn } from '../src/utils';
+const ScrollArea = ({ className, children, ref, ...props }) => (_jsxs(ScrollAreaPrimitive.Root, { className: cn('relative overflow-hidden', className), ...props, children: [_jsx(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", ref: ref, children: children }), _jsx(ScrollBar, {}), _jsx(ScrollAreaPrimitive.Corner, {})] }));
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+const ScrollBar = ({ className, orientation = 'vertical', ...props }) => (_jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, { className: cn('flex touch-none transition-colors select-none', orientation === 'vertical' &&
+        'h-full w-2.5 border-l border-l-transparent p-[1px]', orientation === 'horizontal' &&
+        'h-2.5 border-t border-t-transparent p-[1px]', className), orientation: orientation, ...props, children: _jsx(ScrollAreaPrimitive.ScrollAreaThumb, { className: cn('relative rounded-full bg-gray-300', orientation === 'vertical' && 'flex-1') }) }));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+export { ScrollArea, ScrollBar };