@mastra/playground-ui 60.0.0-alpha.8 → 60.0.0

package/dist/command-CpXMoss8.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-CpXMoss8.cjs","sources":["../src/ds/components/Command/command.tsx"],"sourcesContent":["import { Command as CommandPrimitive } from 'cmdk';\nimport { Search } from 'lucide-react';\nimport * as React from 'react';\n\nimport { Dialog, DialogContent, DialogDescription, DialogTitle } from '@/ds/components/Dialog';\nimport type { DialogSize } from '@/ds/components/Dialog';\nimport { ScrollArea, ScrollAreaViewport } from '@/ds/components/ScrollArea';\nimport type { ScrollAreaMask } from '@/ds/components/ScrollArea';\nimport { Txt } from '@/ds/components/Txt';\nimport { FluidMenuItems, useFluidMenu, useFluidMenuItemRef } from '@/ds/primitives/fluid-menu';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nconst Command = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn('flex size-full flex-col overflow-hidden rounded-xl bg-card text-muted-foreground', className)}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\ntype CommandDialogProps = Omit<React.ComponentPropsWithoutRef<typeof Dialog>, 'children'> & {\n  children?: React.ReactNode;\n  title?: string;\n  description?: string;\n  size?: DialogSize;\n  contentClassName?: string;\n  commandClassName?: string;\n  commandLabel?: string;\n  showOverlay?: boolean;\n  overlayClassName?: string;\n};\n\nconst CommandDialog = ({\n  children,\n  title = 'Command Palette',\n  description = 'Search for commands and actions',\n  size,\n  contentClassName,\n  commandClassName,\n  commandLabel,\n  showOverlay = false,\n  overlayClassName,\n  ...props\n}: CommandDialogProps) => {\n  const filter = React.useCallback((value: string, search: string) => {\n    const normalizedValue = value.toLowerCase();\n    const normalizedSearch = search.toLowerCase();\n    const searchTerms = normalizedSearch.split(/\\s+/).filter(Boolean);\n\n    const matches = searchTerms.every(term => normalizedValue.includes(term));\n    return matches ? 1 : 0;\n  }, []);\n\n  const handleKeyDown = React.useCallback((e: React.KeyboardEvent) => {\n    if (e.key === 'Escape') return;\n\n    e.stopPropagation();\n  }, []);\n\n  return (\n    <Dialog {...props}>\n      <DialogContent\n        size={size}\n        showOverlay={showOverlay}\n        overlayClassName={overlayClassName}\n        className={cn('overflow-hidden py-0', contentClassName)}\n      >\n        <DialogTitle className=\"sr-only\">{title}</DialogTitle>\n        <DialogDescription className=\"sr-only\">{description}</DialogDescription>\n        <Command\n          label={commandLabel}\n          loop\n          filter={filter}\n          onKeyDown={handleKeyDown}\n          className={cn(\n            '**:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:text-column **:[[cmdk-group-heading]]:text-muted-foreground',\n            '[&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 **:[[cmdk-group]]:px-2',\n            '[&_[data-slot=command-input-wrapper]_svg]:size-5',\n            '**:[[cmdk-input]]:h-12',\n            '**:[[cmdk-item]]:p-2',\n            '[&_[cmdk-item]_svg]:size-5',\n            commandClassName,\n          )}\n        >\n          {children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\ntype CommandInputProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input> & {\n  rightSlot?: React.ReactNode;\n  wrapperClassName?: string;\n};\n\nconst CommandInput = React.forwardRef<React.ElementRef<typeof CommandPrimitive.Input>, CommandInputProps>(\n  ({ className, rightSlot, wrapperClassName, ...props }, ref) => (\n    <div\n      data-slot=\"command-input-wrapper\"\n      className={cn('flex items-center border-b border-border px-3', transitions.colors, wrapperClassName)}\n    >\n      <Search className={cn('mr-2 size-4 shrink-0 text-muted-foreground', transitions.colors)} />\n      <CommandPrimitive.Input\n        ref={ref}\n        className={cn(\n          'flex h-8 min-w-0 flex-1 rounded-md bg-transparent py-2 text-body-sm text-foreground',\n          'placeholder:text-placeholder disabled:cursor-not-allowed disabled:opacity-50',\n          'outline-none focus:outline-none focus-visible:outline-none',\n          transitions.colors,\n          className,\n        )}\n        {...props}\n      />\n      {rightSlot && (\n        <div data-slot=\"command-input-right-slot\" className=\"ml-2 flex shrink-0 items-center text-muted-foreground\">\n          {rightSlot}\n        </div>\n      )}\n    </div>\n  ),\n);\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\ntype CommandListProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> & {\n  scrollArea?: boolean;\n  scrollAreaClassName?: string;\n  scrollAreaViewportClassName?: string;\n  scrollAreaMask?: ScrollAreaMask;\n  /** Extra classes for the travelling hover surface (e.g. a different radius). */\n  highlightClassName?: string;\n};\n\nconst CommandList = React.forwardRef<React.ElementRef<typeof CommandPrimitive.List>, CommandListProps>(\n  (\n    {\n      className,\n      children,\n      scrollArea = false,\n      scrollAreaClassName,\n      scrollAreaViewportClassName,\n      scrollAreaMask,\n      highlightClassName,\n      ...props\n    },\n    ref,\n  ) => {\n    const menu = useFluidMenu<HTMLDivElement>({ activeAttr: 'data-selected' });\n    const list = (\n      <CommandPrimitive.List\n        className={cn(\n          'outline-none focus:outline-none focus-visible:outline-none',\n          scrollArea ? 'overflow-visible' : 'max-h-dropdown overflow-x-hidden overflow-y-auto',\n          menu.containerClassName,\n          className,\n        )}\n        {...props}\n        {...menu.getContainerProps(props, ref)}\n      >\n        <FluidMenuItems menu={menu} className={highlightClassName}>\n          {children}\n        </FluidMenuItems>\n      </CommandPrimitive.List>\n    );\n\n    if (!scrollArea) return list;\n\n    return (\n      <ScrollArea className={cn('min-h-0', scrollAreaClassName)} mask={scrollAreaMask}>\n        <ScrollAreaViewport className={scrollAreaViewportClassName}>{list}</ScrollAreaViewport>\n      </ScrollArea>\n    );\n  },\n);\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty>\n>((props, ref) => (\n  <CommandPrimitive.Empty ref={ref} className=\"py-6 text-center text-body-sm text-muted-foreground\" {...props} />\n));\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      'overflow-hidden p-1 text-muted-foreground',\n      '[&_[cmdk-group-heading]]:text-meta **:[[cmdk-group-heading]]:px-2 **:[[cmdk-group-heading]]:pt-1.5 **:[[cmdk-group-heading]]:pb-1 **:[[cmdk-group-heading]]:tracking-wider **:[[cmdk-group-heading]]:text-muted-foreground **:[[cmdk-group-heading]]:uppercase',\n      className,\n    )}\n    {...props}\n  />\n));\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandSeparator = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Separator ref={ref} className={cn('-mx-1 h-px bg-border', className)} {...props} />\n));\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={useFluidMenuItemRef(ref)}\n    className={cn(\n      'relative flex cursor-pointer items-center gap-2.5 rounded-lg px-2 py-1.5 text-body-sm text-muted-foreground select-none',\n      'outline-none focus:outline-none focus-visible:outline-none',\n      transitions.colors,\n      'data-[selected=true]:text-foreground',\n      'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n      '[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-muted-foreground data-[selected=true]:[&_svg]:text-foreground',\n      className,\n    )}\n    {...props}\n  />\n));\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nconst CommandShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => {\n  return (\n    <Txt\n      as=\"span\"\n      variant=\"meta\"\n      tone=\"muted\"\n      className={cn('ml-auto tracking-wider tabular-nums', className)}\n      {...props}\n    />\n  );\n};\nCommandShortcut.displayName = 'CommandShortcut';\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandSeparator,\n  CommandShortcut,\n};\n"],"names":["React","jsx","CommandPrimitive","cn","Dialog","jsxs","DialogContent","DialogTitle","DialogDescription","transitions","Search","scrollArea","useFluidMenu","FluidMenuItems","ScrollArea","ScrollAreaViewport","useFluidMenuItemRef","Txt"],"mappings":"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"}

package/dist/comment-DKWkzdMj.js

@@ -0,0 +1,202 @@
+import { jsx } from 'react/jsx-runtime';
+import { c as cva } from './index-Dubp6Qv4.js';
+import { createContext, useContext, forwardRef } from 'react';
+import { T as Txt } from './Txt-BP1SRHmL.js';
+import { raisedSurfaceStyle } from './primitives/raised-surface.es.js';
+import { c as cn } from './cn-65Adrsfj.js';
+
+const CommentContext = createContext(null);
+function useCommentVariant() {
+  const variant = useContext(CommentContext);
+  if (!variant) throw new Error("Comment compounds must be rendered within Comment");
+  return variant;
+}
+
+const commentVariants = cva("flex flex-col", {
+  variants: {
+    variant: {
+      default: "gap-2",
+      embed: cn(raisedSurfaceStyle, "gap-1 rounded-xl p-3"),
+      thread: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+const Comment = forwardRef(({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ jsx(CommentContext.Provider, { value: variant, children: /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-slot": "comment",
+    "data-variant": variant,
+    className: cn(commentVariants({ variant }), className),
+    ...props
+  }
+) }));
+Comment.displayName = "Comment";
+const commentListGap = {
+  default: "gap-3",
+  embed: "gap-2",
+  thread: ""
+};
+const CommentList = forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsx(
+    "ul",
+    {
+      ref,
+      "data-slot": "comment-list",
+      className: cn("flex flex-col", commentListGap[variant], className),
+      ...props
+    }
+  );
+});
+CommentList.displayName = "CommentList";
+const commentItemLayout = {
+  default: "flex flex-col gap-1",
+  embed: "flex flex-col gap-1",
+  thread: "relative flex gap-2 rounded-lg px-2 hover:bg-fill-subtle"
+};
+const CommentItem = forwardRef(
+  ({ className, continued = false, highlighted = false, ...props }, ref) => {
+    const variant = useCommentVariant();
+    const Root = variant === "thread" ? "div" : "li";
+    return /* @__PURE__ */ jsx(
+      Root,
+      {
+        ref,
+        "data-slot": "comment-item",
+        className: cn(
+          "group/comment-item",
+          commentItemLayout[variant],
+          variant === "thread" && (continued ? "py-0.5" : "py-1.5"),
+          highlighted && "bg-info-subtle",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+CommentItem.displayName = "CommentItem";
+const CommentItemAvatar = forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, "data-slot": "comment-item-avatar", className: cn("w-6 shrink-0 pt-0.5", className), ...props }));
+CommentItemAvatar.displayName = "CommentItemAvatar";
+const CommentItemContent = forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, "data-slot": "comment-item-content", className: cn("min-w-0 flex-1", className), ...props })
+);
+CommentItemContent.displayName = "CommentItemContent";
+const commentItemHeaderLayout = {
+  default: "flex items-center gap-2",
+  embed: "flex items-center gap-2",
+  thread: "flex items-baseline gap-1.5"
+};
+const CommentItemHeader = forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      "data-slot": "comment-item-header",
+      className: cn(commentItemHeaderLayout[variant], className),
+      ...props
+    }
+  );
+});
+CommentItemHeader.displayName = "CommentItemHeader";
+const commentItemAuthorSize = {
+  default: "subheading",
+  embed: "subheading",
+  thread: "column"
+};
+const commentItemAuthorTone = {
+  default: "text-foreground",
+  embed: "text-foreground",
+  thread: "truncate text-foreground"
+};
+const CommentItemAuthor = forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsx(
+    Txt,
+    {
+      ref,
+      as: "span",
+      variant: commentItemAuthorSize[variant],
+      "data-slot": "comment-item-author",
+      className: cn(commentItemAuthorTone[variant], className),
+      ...props
+    }
+  );
+});
+CommentItemAuthor.displayName = "CommentItemAuthor";
+const commentItemTimestampTone = {
+  default: "text-caption text-muted-foreground",
+  embed: "text-caption text-muted-foreground",
+  thread: "text-meta text-placeholder shrink-0"
+};
+const CommentItemTimestamp = forwardRef(
+  ({ className, ...props }, ref) => {
+    const variant = useCommentVariant();
+    return /* @__PURE__ */ jsx(
+      "time",
+      {
+        ref,
+        "data-slot": "comment-item-timestamp",
+        className: cn(commentItemTimestampTone[variant], className),
+        ...props
+      }
+    );
+  }
+);
+CommentItemTimestamp.displayName = "CommentItemTimestamp";
+const commentItemBodySize = {
+  default: "body",
+  embed: "body",
+  thread: "caption"
+};
+const commentItemBodyTone = {
+  default: "whitespace-pre-wrap text-foreground border-l border-border pl-3",
+  embed: "whitespace-pre-wrap text-foreground",
+  thread: ""
+};
+const CommentItemBody = forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsx(
+    Txt,
+    {
+      ref,
+      as: variant === "thread" ? "div" : "p",
+      variant: commentItemBodySize[variant],
+      "data-slot": "comment-item-body",
+      className: cn(commentItemBodyTone[variant], className),
+      ...props
+    }
+  );
+});
+CommentItemBody.displayName = "CommentItemBody";
+const commentItemActionsLayout = {
+  default: "flex items-center gap-1 opacity-0 group-focus-within/comment-item:opacity-100 group-hover/comment-item:opacity-100 motion-safe:transition-opacity",
+  embed: "",
+  // Inline at the end of the header row, revealed on hover/focus.
+  // `pointer-fine` only: a touch screen has no hover to reveal it with.
+  thread: "ml-auto flex shrink-0 items-center gap-0.5 self-center transition-opacity duration-200 ease-out motion-reduce:transition-none pointer-fine:opacity-0 pointer-fine:group-focus-within/comment-item:opacity-100 pointer-fine:group-hover/comment-item:opacity-100"
+};
+const CommentItemActions = forwardRef(
+  ({ className, ...props }, ref) => {
+    const variant = useCommentVariant();
+    if (variant === "embed") return null;
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        "data-slot": "comment-item-actions",
+        className: cn(commentItemActionsLayout[variant], className),
+        ...props
+      }
+    );
+  }
+);
+CommentItemActions.displayName = "CommentItemActions";
+
+export { Comment as C, CommentItemTimestamp as a, CommentItemActions as b, CommentItemBody as c, CommentItem as d, CommentItemAvatar as e, CommentItemContent as f, CommentItemHeader as g, CommentList as h, CommentItemAuthor as i, useCommentVariant as u };
+//# sourceMappingURL=comment-DKWkzdMj.js.map

package/dist/comment-DKWkzdMj.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"comment-DKWkzdMj.js","sources":["../src/ds/components/Comment/comment-context.ts","../src/ds/components/Comment/comment.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nexport type CommentVariant = 'default' | 'embed' | 'thread';\n\nexport const CommentContext = createContext<CommentVariant | null>(null);\n\nexport function useCommentVariant(): CommentVariant {\n  const variant = useContext(CommentContext);\n  if (!variant) throw new Error('Comment compounds must be rendered within Comment');\n  return variant;\n}\n","import { cva } from 'class-variance-authority';\nimport type { ComponentPropsWithoutRef, HTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\n\nimport { CommentContext, useCommentVariant } from './comment-context';\nimport type { CommentVariant } from './comment-context';\nimport { Txt } from '@/ds/components/Txt';\nimport type { TxtProps } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\nconst commentVariants = cva('flex flex-col', {\n  variants: {\n    variant: {\n      default: 'gap-2',\n      embed: cn(raisedSurfaceStyle, 'gap-1 rounded-xl p-3'),\n      thread: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nexport interface CommentProps extends ComponentPropsWithoutRef<'div'> {\n  variant?: CommentVariant;\n}\n\nexport const Comment = forwardRef<HTMLDivElement, CommentProps>(({ className, variant = 'default', ...props }, ref) => (\n  <CommentContext.Provider value={variant}>\n    <div\n      ref={ref}\n      data-slot=\"comment\"\n      data-variant={variant}\n      className={cn(commentVariants({ variant }), className)}\n      {...props}\n    />\n  </CommentContext.Provider>\n));\nComment.displayName = 'Comment';\n\nconst commentListGap: Record<CommentVariant, string> = {\n  default: 'gap-3',\n  embed: 'gap-2',\n  thread: '',\n};\n\nexport type CommentListProps = ComponentPropsWithoutRef<'ul'>;\n\nexport const CommentList = forwardRef<HTMLUListElement, CommentListProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <ul\n      ref={ref}\n      data-slot=\"comment-list\"\n      className={cn('flex flex-col', commentListGap[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentList.displayName = 'CommentList';\n\nconst commentItemLayout: Record<CommentVariant, string> = {\n  default: 'flex flex-col gap-1',\n  embed: 'flex flex-col gap-1',\n  thread: 'relative flex gap-2 rounded-lg px-2 hover:bg-fill-subtle',\n};\n\nexport interface CommentItemProps extends HTMLAttributes<HTMLElement> {\n  /** Same author moments after the row above: the header is dropped and the row tightens. */\n  continued?: boolean;\n  /** The comment a link pointed at. */\n  highlighted?: boolean;\n}\n\nexport const CommentItem = forwardRef<HTMLElement, CommentItemProps>(\n  ({ className, continued = false, highlighted = false, ...props }, ref) => {\n    const variant = useCommentVariant();\n    // A thread row is a stream entry among runs and moves, not a list item.\n    const Root = variant === 'thread' ? 'div' : 'li';\n\n    return (\n      <Root\n        // Cast needed: `Root` is polymorphic, so TS narrows the expected ref to a single element type.\n        ref={ref as never}\n        data-slot=\"comment-item\"\n        className={cn(\n          'group/comment-item',\n          commentItemLayout[variant],\n          variant === 'thread' && (continued ? 'py-0.5' : 'py-1.5'),\n          highlighted && 'bg-info-subtle',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nCommentItem.displayName = 'CommentItem';\n\nexport type CommentItemAvatarProps = ComponentPropsWithoutRef<'div'>;\n\n/** Fixed gutter: left empty on a continuation row, it keeps the body aligned under the avatar above. */\nexport const CommentItemAvatar = forwardRef<HTMLDivElement, CommentItemAvatarProps>(({ className, ...props }, ref) => (\n  <div ref={ref} data-slot=\"comment-item-avatar\" className={cn('w-6 shrink-0 pt-0.5', className)} {...props} />\n));\nCommentItemAvatar.displayName = 'CommentItemAvatar';\n\nexport type CommentItemContentProps = ComponentPropsWithoutRef<'div'>;\n\n/** Everything beside the gutter, stacked and free to shrink so long words wrap instead of widening the row. */\nexport const CommentItemContent = forwardRef<HTMLDivElement, CommentItemContentProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} data-slot=\"comment-item-content\" className={cn('min-w-0 flex-1', className)} {...props} />\n  ),\n);\nCommentItemContent.displayName = 'CommentItemContent';\n\nconst commentItemHeaderLayout: Record<CommentVariant, string> = {\n  default: 'flex items-center gap-2',\n  embed: 'flex items-center gap-2',\n  thread: 'flex items-baseline gap-1.5',\n};\n\nexport type CommentItemHeaderProps = ComponentPropsWithoutRef<'div'>;\n\nexport const CommentItemHeader = forwardRef<HTMLDivElement, CommentItemHeaderProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"comment-item-header\"\n      className={cn(commentItemHeaderLayout[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemHeader.displayName = 'CommentItemHeader';\n\nconst commentItemAuthorSize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'subheading',\n  embed: 'subheading',\n  thread: 'column',\n};\n\nconst commentItemAuthorTone: Record<CommentVariant, string> = {\n  default: 'text-foreground',\n  embed: 'text-foreground',\n  thread: 'truncate text-foreground',\n};\n\nexport type CommentItemAuthorProps = ComponentPropsWithoutRef<'span'>;\n\nexport const CommentItemAuthor = forwardRef<HTMLElement, CommentItemAuthorProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <Txt\n      ref={ref}\n      as=\"span\"\n      variant={commentItemAuthorSize[variant]}\n      data-slot=\"comment-item-author\"\n      className={cn(commentItemAuthorTone[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemAuthor.displayName = 'CommentItemAuthor';\n\nconst commentItemTimestampTone: Record<CommentVariant, string> = {\n  default: 'text-caption text-muted-foreground',\n  embed: 'text-caption text-muted-foreground',\n  thread: 'text-meta text-placeholder shrink-0',\n};\n\nexport type CommentItemTimestampProps = ComponentPropsWithoutRef<'time'>;\n\nexport const CommentItemTimestamp = forwardRef<HTMLTimeElement, CommentItemTimestampProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n\n    return (\n      <time\n        ref={ref}\n        data-slot=\"comment-item-timestamp\"\n        className={cn(commentItemTimestampTone[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemTimestamp.displayName = 'CommentItemTimestamp';\n\nconst commentItemBodySize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'body',\n  embed: 'body',\n  thread: 'caption',\n};\n\nconst commentItemBodyTone: Record<CommentVariant, string> = {\n  default: 'whitespace-pre-wrap text-foreground border-l border-border pl-3',\n  embed: 'whitespace-pre-wrap text-foreground',\n  thread: '',\n};\n\nexport type CommentItemBodyProps = ComponentPropsWithoutRef<'p'>;\n\nexport const CommentItemBody = forwardRef<HTMLElement, CommentItemBodyProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <Txt\n      ref={ref}\n      // Rendered markdown brings its own blocks, which a paragraph cannot hold.\n      as={variant === 'thread' ? 'div' : 'p'}\n      variant={commentItemBodySize[variant]}\n      data-slot=\"comment-item-body\"\n      className={cn(commentItemBodyTone[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemBody.displayName = 'CommentItemBody';\n\nconst commentItemActionsLayout: Record<CommentVariant, string> = {\n  default:\n    'flex items-center gap-1 opacity-0 group-focus-within/comment-item:opacity-100 group-hover/comment-item:opacity-100 motion-safe:transition-opacity',\n  embed: '',\n  // Inline at the end of the header row, revealed on hover/focus.\n  // `pointer-fine` only: a touch screen has no hover to reveal it with.\n  thread:\n    'ml-auto flex shrink-0 items-center gap-0.5 self-center transition-opacity duration-200 ease-out motion-reduce:transition-none pointer-fine:opacity-0 pointer-fine:group-focus-within/comment-item:opacity-100 pointer-fine:group-hover/comment-item:opacity-100',\n};\n\nexport type CommentItemActionsProps = ComponentPropsWithoutRef<'div'>;\n\n/** Hidden in the `embed` variant, which drops per-item actions. */\nexport const CommentItemActions = forwardRef<HTMLDivElement, CommentItemActionsProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n    if (variant === 'embed') return null;\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"comment-item-actions\"\n        className={cn(commentItemActionsLayout[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemActions.displayName = 'CommentItemActions';\n"],"names":[],"mappings":"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"}

package/dist/comment-DWY6D0pZ.cjs

@@ -0,0 +1,214 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const index = require('./index-C-fBJhpb.cjs');
+const React = require('react');
+const Txt = require('./Txt-DPmEpNbp.cjs');
+const primitives_raisedSurface = require('./primitives/raised-surface.cjs.js');
+const utils_cn = require('./cn-DG0X1KEP.cjs');
+
+const CommentContext = React.createContext(null);
+function useCommentVariant() {
+  const variant = React.useContext(CommentContext);
+  if (!variant) throw new Error("Comment compounds must be rendered within Comment");
+  return variant;
+}
+
+const commentVariants = index.cva("flex flex-col", {
+  variants: {
+    variant: {
+      default: "gap-2",
+      embed: utils_cn.cn(primitives_raisedSurface.raisedSurfaceStyle, "gap-1 rounded-xl p-3"),
+      thread: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+const Comment = React.forwardRef(({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(CommentContext.Provider, { value: variant, children: /* @__PURE__ */ jsxRuntime.jsx(
+  "div",
+  {
+    ref,
+    "data-slot": "comment",
+    "data-variant": variant,
+    className: utils_cn.cn(commentVariants({ variant }), className),
+    ...props
+  }
+) }));
+Comment.displayName = "Comment";
+const commentListGap = {
+  default: "gap-3",
+  embed: "gap-2",
+  thread: ""
+};
+const CommentList = React.forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "ul",
+    {
+      ref,
+      "data-slot": "comment-list",
+      className: utils_cn.cn("flex flex-col", commentListGap[variant], className),
+      ...props
+    }
+  );
+});
+CommentList.displayName = "CommentList";
+const commentItemLayout = {
+  default: "flex flex-col gap-1",
+  embed: "flex flex-col gap-1",
+  thread: "relative flex gap-2 rounded-lg px-2 hover:bg-fill-subtle"
+};
+const CommentItem = React.forwardRef(
+  ({ className, continued = false, highlighted = false, ...props }, ref) => {
+    const variant = useCommentVariant();
+    const Root = variant === "thread" ? "div" : "li";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Root,
+      {
+        ref,
+        "data-slot": "comment-item",
+        className: utils_cn.cn(
+          "group/comment-item",
+          commentItemLayout[variant],
+          variant === "thread" && (continued ? "py-0.5" : "py-1.5"),
+          highlighted && "bg-info-subtle",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+CommentItem.displayName = "CommentItem";
+const CommentItemAvatar = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, "data-slot": "comment-item-avatar", className: utils_cn.cn("w-6 shrink-0 pt-0.5", className), ...props }));
+CommentItemAvatar.displayName = "CommentItemAvatar";
+const CommentItemContent = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("div", { ref, "data-slot": "comment-item-content", className: utils_cn.cn("min-w-0 flex-1", className), ...props })
+);
+CommentItemContent.displayName = "CommentItemContent";
+const commentItemHeaderLayout = {
+  default: "flex items-center gap-2",
+  embed: "flex items-center gap-2",
+  thread: "flex items-baseline gap-1.5"
+};
+const CommentItemHeader = React.forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      "data-slot": "comment-item-header",
+      className: utils_cn.cn(commentItemHeaderLayout[variant], className),
+      ...props
+    }
+  );
+});
+CommentItemHeader.displayName = "CommentItemHeader";
+const commentItemAuthorSize = {
+  default: "subheading",
+  embed: "subheading",
+  thread: "column"
+};
+const commentItemAuthorTone = {
+  default: "text-foreground",
+  embed: "text-foreground",
+  thread: "truncate text-foreground"
+};
+const CommentItemAuthor = React.forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Txt.Txt,
+    {
+      ref,
+      as: "span",
+      variant: commentItemAuthorSize[variant],
+      "data-slot": "comment-item-author",
+      className: utils_cn.cn(commentItemAuthorTone[variant], className),
+      ...props
+    }
+  );
+});
+CommentItemAuthor.displayName = "CommentItemAuthor";
+const commentItemTimestampTone = {
+  default: "text-caption text-muted-foreground",
+  embed: "text-caption text-muted-foreground",
+  thread: "text-meta text-placeholder shrink-0"
+};
+const CommentItemTimestamp = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const variant = useCommentVariant();
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "time",
+      {
+        ref,
+        "data-slot": "comment-item-timestamp",
+        className: utils_cn.cn(commentItemTimestampTone[variant], className),
+        ...props
+      }
+    );
+  }
+);
+CommentItemTimestamp.displayName = "CommentItemTimestamp";
+const commentItemBodySize = {
+  default: "body",
+  embed: "body",
+  thread: "caption"
+};
+const commentItemBodyTone = {
+  default: "whitespace-pre-wrap text-foreground border-l border-border pl-3",
+  embed: "whitespace-pre-wrap text-foreground",
+  thread: ""
+};
+const CommentItemBody = React.forwardRef(({ className, ...props }, ref) => {
+  const variant = useCommentVariant();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Txt.Txt,
+    {
+      ref,
+      as: variant === "thread" ? "div" : "p",
+      variant: commentItemBodySize[variant],
+      "data-slot": "comment-item-body",
+      className: utils_cn.cn(commentItemBodyTone[variant], className),
+      ...props
+    }
+  );
+});
+CommentItemBody.displayName = "CommentItemBody";
+const commentItemActionsLayout = {
+  default: "flex items-center gap-1 opacity-0 group-focus-within/comment-item:opacity-100 group-hover/comment-item:opacity-100 motion-safe:transition-opacity",
+  embed: "",
+  // Inline at the end of the header row, revealed on hover/focus.
+  // `pointer-fine` only: a touch screen has no hover to reveal it with.
+  thread: "ml-auto flex shrink-0 items-center gap-0.5 self-center transition-opacity duration-200 ease-out motion-reduce:transition-none pointer-fine:opacity-0 pointer-fine:group-focus-within/comment-item:opacity-100 pointer-fine:group-hover/comment-item:opacity-100"
+};
+const CommentItemActions = React.forwardRef(
+  ({ className, ...props }, ref) => {
+    const variant = useCommentVariant();
+    if (variant === "embed") return null;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        "data-slot": "comment-item-actions",
+        className: utils_cn.cn(commentItemActionsLayout[variant], className),
+        ...props
+      }
+    );
+  }
+);
+CommentItemActions.displayName = "CommentItemActions";
+
+exports.Comment = Comment;
+exports.CommentItem = CommentItem;
+exports.CommentItemActions = CommentItemActions;
+exports.CommentItemAuthor = CommentItemAuthor;
+exports.CommentItemAvatar = CommentItemAvatar;
+exports.CommentItemBody = CommentItemBody;
+exports.CommentItemContent = CommentItemContent;
+exports.CommentItemHeader = CommentItemHeader;
+exports.CommentItemTimestamp = CommentItemTimestamp;
+exports.CommentList = CommentList;
+exports.useCommentVariant = useCommentVariant;
+//# sourceMappingURL=comment-DWY6D0pZ.cjs.map

package/dist/comment-DWY6D0pZ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"comment-DWY6D0pZ.cjs","sources":["../src/ds/components/Comment/comment-context.ts","../src/ds/components/Comment/comment.tsx"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nexport type CommentVariant = 'default' | 'embed' | 'thread';\n\nexport const CommentContext = createContext<CommentVariant | null>(null);\n\nexport function useCommentVariant(): CommentVariant {\n  const variant = useContext(CommentContext);\n  if (!variant) throw new Error('Comment compounds must be rendered within Comment');\n  return variant;\n}\n","import { cva } from 'class-variance-authority';\nimport type { ComponentPropsWithoutRef, HTMLAttributes } from 'react';\nimport { forwardRef } from 'react';\n\nimport { CommentContext, useCommentVariant } from './comment-context';\nimport type { CommentVariant } from './comment-context';\nimport { Txt } from '@/ds/components/Txt';\nimport type { TxtProps } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\nconst commentVariants = cva('flex flex-col', {\n  variants: {\n    variant: {\n      default: 'gap-2',\n      embed: cn(raisedSurfaceStyle, 'gap-1 rounded-xl p-3'),\n      thread: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nexport interface CommentProps extends ComponentPropsWithoutRef<'div'> {\n  variant?: CommentVariant;\n}\n\nexport const Comment = forwardRef<HTMLDivElement, CommentProps>(({ className, variant = 'default', ...props }, ref) => (\n  <CommentContext.Provider value={variant}>\n    <div\n      ref={ref}\n      data-slot=\"comment\"\n      data-variant={variant}\n      className={cn(commentVariants({ variant }), className)}\n      {...props}\n    />\n  </CommentContext.Provider>\n));\nComment.displayName = 'Comment';\n\nconst commentListGap: Record<CommentVariant, string> = {\n  default: 'gap-3',\n  embed: 'gap-2',\n  thread: '',\n};\n\nexport type CommentListProps = ComponentPropsWithoutRef<'ul'>;\n\nexport const CommentList = forwardRef<HTMLUListElement, CommentListProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <ul\n      ref={ref}\n      data-slot=\"comment-list\"\n      className={cn('flex flex-col', commentListGap[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentList.displayName = 'CommentList';\n\nconst commentItemLayout: Record<CommentVariant, string> = {\n  default: 'flex flex-col gap-1',\n  embed: 'flex flex-col gap-1',\n  thread: 'relative flex gap-2 rounded-lg px-2 hover:bg-fill-subtle',\n};\n\nexport interface CommentItemProps extends HTMLAttributes<HTMLElement> {\n  /** Same author moments after the row above: the header is dropped and the row tightens. */\n  continued?: boolean;\n  /** The comment a link pointed at. */\n  highlighted?: boolean;\n}\n\nexport const CommentItem = forwardRef<HTMLElement, CommentItemProps>(\n  ({ className, continued = false, highlighted = false, ...props }, ref) => {\n    const variant = useCommentVariant();\n    // A thread row is a stream entry among runs and moves, not a list item.\n    const Root = variant === 'thread' ? 'div' : 'li';\n\n    return (\n      <Root\n        // Cast needed: `Root` is polymorphic, so TS narrows the expected ref to a single element type.\n        ref={ref as never}\n        data-slot=\"comment-item\"\n        className={cn(\n          'group/comment-item',\n          commentItemLayout[variant],\n          variant === 'thread' && (continued ? 'py-0.5' : 'py-1.5'),\n          highlighted && 'bg-info-subtle',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nCommentItem.displayName = 'CommentItem';\n\nexport type CommentItemAvatarProps = ComponentPropsWithoutRef<'div'>;\n\n/** Fixed gutter: left empty on a continuation row, it keeps the body aligned under the avatar above. */\nexport const CommentItemAvatar = forwardRef<HTMLDivElement, CommentItemAvatarProps>(({ className, ...props }, ref) => (\n  <div ref={ref} data-slot=\"comment-item-avatar\" className={cn('w-6 shrink-0 pt-0.5', className)} {...props} />\n));\nCommentItemAvatar.displayName = 'CommentItemAvatar';\n\nexport type CommentItemContentProps = ComponentPropsWithoutRef<'div'>;\n\n/** Everything beside the gutter, stacked and free to shrink so long words wrap instead of widening the row. */\nexport const CommentItemContent = forwardRef<HTMLDivElement, CommentItemContentProps>(\n  ({ className, ...props }, ref) => (\n    <div ref={ref} data-slot=\"comment-item-content\" className={cn('min-w-0 flex-1', className)} {...props} />\n  ),\n);\nCommentItemContent.displayName = 'CommentItemContent';\n\nconst commentItemHeaderLayout: Record<CommentVariant, string> = {\n  default: 'flex items-center gap-2',\n  embed: 'flex items-center gap-2',\n  thread: 'flex items-baseline gap-1.5',\n};\n\nexport type CommentItemHeaderProps = ComponentPropsWithoutRef<'div'>;\n\nexport const CommentItemHeader = forwardRef<HTMLDivElement, CommentItemHeaderProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <div\n      ref={ref}\n      data-slot=\"comment-item-header\"\n      className={cn(commentItemHeaderLayout[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemHeader.displayName = 'CommentItemHeader';\n\nconst commentItemAuthorSize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'subheading',\n  embed: 'subheading',\n  thread: 'column',\n};\n\nconst commentItemAuthorTone: Record<CommentVariant, string> = {\n  default: 'text-foreground',\n  embed: 'text-foreground',\n  thread: 'truncate text-foreground',\n};\n\nexport type CommentItemAuthorProps = ComponentPropsWithoutRef<'span'>;\n\nexport const CommentItemAuthor = forwardRef<HTMLElement, CommentItemAuthorProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <Txt\n      ref={ref}\n      as=\"span\"\n      variant={commentItemAuthorSize[variant]}\n      data-slot=\"comment-item-author\"\n      className={cn(commentItemAuthorTone[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemAuthor.displayName = 'CommentItemAuthor';\n\nconst commentItemTimestampTone: Record<CommentVariant, string> = {\n  default: 'text-caption text-muted-foreground',\n  embed: 'text-caption text-muted-foreground',\n  thread: 'text-meta text-placeholder shrink-0',\n};\n\nexport type CommentItemTimestampProps = ComponentPropsWithoutRef<'time'>;\n\nexport const CommentItemTimestamp = forwardRef<HTMLTimeElement, CommentItemTimestampProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n\n    return (\n      <time\n        ref={ref}\n        data-slot=\"comment-item-timestamp\"\n        className={cn(commentItemTimestampTone[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemTimestamp.displayName = 'CommentItemTimestamp';\n\nconst commentItemBodySize: Record<CommentVariant, TxtProps['variant']> = {\n  default: 'body',\n  embed: 'body',\n  thread: 'caption',\n};\n\nconst commentItemBodyTone: Record<CommentVariant, string> = {\n  default: 'whitespace-pre-wrap text-foreground border-l border-border pl-3',\n  embed: 'whitespace-pre-wrap text-foreground',\n  thread: '',\n};\n\nexport type CommentItemBodyProps = ComponentPropsWithoutRef<'p'>;\n\nexport const CommentItemBody = forwardRef<HTMLElement, CommentItemBodyProps>(({ className, ...props }, ref) => {\n  const variant = useCommentVariant();\n\n  return (\n    <Txt\n      ref={ref}\n      // Rendered markdown brings its own blocks, which a paragraph cannot hold.\n      as={variant === 'thread' ? 'div' : 'p'}\n      variant={commentItemBodySize[variant]}\n      data-slot=\"comment-item-body\"\n      className={cn(commentItemBodyTone[variant], className)}\n      {...props}\n    />\n  );\n});\nCommentItemBody.displayName = 'CommentItemBody';\n\nconst commentItemActionsLayout: Record<CommentVariant, string> = {\n  default:\n    'flex items-center gap-1 opacity-0 group-focus-within/comment-item:opacity-100 group-hover/comment-item:opacity-100 motion-safe:transition-opacity',\n  embed: '',\n  // Inline at the end of the header row, revealed on hover/focus.\n  // `pointer-fine` only: a touch screen has no hover to reveal it with.\n  thread:\n    'ml-auto flex shrink-0 items-center gap-0.5 self-center transition-opacity duration-200 ease-out motion-reduce:transition-none pointer-fine:opacity-0 pointer-fine:group-focus-within/comment-item:opacity-100 pointer-fine:group-hover/comment-item:opacity-100',\n};\n\nexport type CommentItemActionsProps = ComponentPropsWithoutRef<'div'>;\n\n/** Hidden in the `embed` variant, which drops per-item actions. */\nexport const CommentItemActions = forwardRef<HTMLDivElement, CommentItemActionsProps>(\n  ({ className, ...props }, ref) => {\n    const variant = useCommentVariant();\n    if (variant === 'embed') return null;\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"comment-item-actions\"\n        className={cn(commentItemActionsLayout[variant], className)}\n        {...props}\n      />\n    );\n  },\n);\nCommentItemActions.displayName = 'CommentItemActions';\n"],"names":["createContext","useContext","cva","cn","raisedSurfaceStyle","forwardRef","jsx","Txt"],"mappings":"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"}

package/dist/components/AlertDialog.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const alertDialog = require('../alert-dialog-mki13KEg.cjs');
+const alertDialog = require('../alert-dialog-BcOSIOSW.cjs');
 
 
 

package/dist/components/AlertDialog.es.js

@@ -1,2 +1,2 @@
-export { A as AlertDialog } from '../alert-dialog-izDBJ9YK.js';
+export { A as AlertDialog } from '../alert-dialog-D1UYVW__.js';
 //# sourceMappingURL=AlertDialog.es.js.map

package/dist/components/Badge.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const Badge = require('../Badge-DFNxcz-r.cjs');
+const Badge = require('../Badge-H8K5WrXg.cjs');
 
 
 

package/dist/components/Badge.es.js

@@ -1,2 +1,2 @@
-export { B as Badge } from '../Badge-Bzn8Z-_I.js';
+export { B as Badge } from '../Badge-Q_pCeeGW.js';
 //# sourceMappingURL=Badge.es.js.map

package/dist/components/Button.cjs.js

@@ -2,13 +2,14 @@
 
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
-const Button = require('../Button-CIwF6NHM.cjs');
+const Button = require('../Button-BnmR2HRc.cjs');
 const jsxRuntime = require('react/jsx-runtime');
 const lucideReact = require('lucide-react');
 const React = require('react');
 const kbd = require('../kbd-BptPsKP6.cjs');
 const keyboard_useKeydown = require('../keyboard/use-keydown.cjs.js');
 require('../keyboard/keyboard-shortcuts-context.cjs.js');
+const mergeRefs = require('../merge-refs-BLbKe138.cjs');
 
 const CREATE_BUTTON_SHORTCUT = "c";
 const CreateButton = React.forwardRef(
@@ -21,7 +22,7 @@ const CreateButton = React.forwardRef(
     return /* @__PURE__ */ jsxRuntime.jsx(
       Button.Button,
       {
-        ref: mergeRefs(buttonRef, forwardedRef),
+        ref: mergeRefs.mergeRefs(buttonRef, forwardedRef),
         icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, {}),
         disabled,
         tooltip: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
@@ -35,16 +36,6 @@ const CreateButton = React.forwardRef(
   }
 );
 CreateButton.displayName = "CreateButton";
-const mergeRefs = (...refs) => (element) => {
-  refs.forEach((ref) => {
-    if (!ref) return;
-    if (typeof ref === "function") {
-      ref(element);
-      return;
-    }
-    ref.current = element;
-  });
-};
 
 exports.Button = Button.Button;
 exports.buttonVariants = Button.buttonVariants;

package/dist/components/Button.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.cjs.js","sources":["../../src/ds/components/Button/CreateButton.tsx"],"sourcesContent":["import { Plus } from 'lucide-react';\nimport React, { useRef } from 'react';\nimport { Button } from './Button';\nimport type { ButtonProps } from './Button';\nimport { Kbd } from '@/ds/components/Kbd';\nimport { useKeydown } from '@/lib/keyboard';\n\nexport const CREATE_BUTTON_SHORTCUT = 'c';\n\nexport interface CreateButtonProps extends Omit<ButtonProps, 'icon' | 'tooltip'> {\n  /** Tooltip text. The `C` shortcut hint is appended automatically. */\n  tooltip: string;\n  /** Set to `false` to unbind the `C` shortcut (the button stays clickable). Defaults to `true`. */\n  shortcutEnabled?: boolean;\n}\n\n/**\n * \"Create\" call-to-action: always renders a `Plus` icon and binds the `C` key to\n * its click. Mount at most one per view — several instances would compete for\n * the same shortcut.\n */\nexport const CreateButton = React.forwardRef<HTMLElement, CreateButtonProps>(\n  ({ tooltip, shortcutEnabled = true, disabled, children, ...props }, forwardedRef) => {\n    const buttonRef = useRef<HTMLElement>(null);\n\n    useKeydown(\n      { [CREATE_BUTTON_SHORTCUT]: () => buttonRef.current?.click() },\n      { enabled: shortcutEnabled && !disabled },\n    );\n\n    return (\n      <Button\n        ref={mergeRefs(buttonRef, forwardedRef)}\n        icon={<Plus />}\n        disabled={disabled}\n        tooltip={\n          <span className=\"inline-flex items-center gap-1.5\">\n            {tooltip}\n            <Kbd size=\"xs\">C</Kbd>\n          </span>\n        }\n        {...props}\n      >\n        {children}\n      </Button>\n    );\n  },\n);\nCreateButton.displayName = 'CreateButton';\n\nconst mergeRefs =\n  <TElement,>(...refs: Array<React.Ref<TElement> | undefined>) =>\n  (element: TElement | null) => {\n    refs.forEach(ref => {\n      if (!ref) return;\n      if (typeof ref === 'function') {\n        ref(element);\n        return;\n      }\n      ref.current = element;\n    });\n  };\n"],"names":["useRef","useKeydown","jsx","Button","Plus","jsxs","Kbd"],"mappings":";;;;;;;;;;;;AAOO,MAAM,sBAAA,GAAyB;AAc/B,MAAM,eAAe,KAAA,CAAM,UAAA;AAAA,EAChC,CAAC,EAAE,OAAA,EAAS,eAAA,GAAkB,IAAA,EAAM,UAAU,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,YAAA,KAAiB;AACnF,IAAA,MAAM,SAAA,GAAYA,aAAoB,IAAI,CAAA;AAE1C,IAAAC,8BAAA;AAAA,MACE,EAAE,CAAC,sBAAsB,GAAG,MAAM,SAAA,CAAU,OAAA,EAAS,OAAM,EAAE;AAAA,MAC7D,EAAE,OAAA,EAAS,eAAA,IAAmB,CAAC,QAAA;AAAS,KAC1C;AAEA,IAAA,uBACEC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAK,SAAA,CAAU,SAAA,EAAW,YAAY,CAAA;AAAA,QACtC,IAAA,iCAAOC,gBAAA,EAAA,EAAK,CAAA;AAAA,QACZ,QAAA;AAAA,QACA,OAAA,kBACEC,eAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kCAAA,EACb,QAAA,EAAA;AAAA,UAAA,OAAA;AAAA,0BACDH,cAAA,CAACI,OAAA,EAAA,EAAI,IAAA,EAAK,IAAA,EAAK,QAAA,EAAA,GAAA,EAAC;AAAA,SAAA,EAClB,CAAA;AAAA,QAED,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,YAAA,CAAa,WAAA,GAAc,cAAA;AAE3B,MAAM,SAAA,GACJ,CAAA,GAAe,IAAA,KACf,CAAC,OAAA,KAA6B;AAC5B,EAAA,IAAA,CAAK,QAAQ,CAAA,GAAA,KAAO;AAClB,IAAA,IAAI,CAAC,GAAA,EAAK;AACV,IAAA,IAAI,OAAO,QAAQ,UAAA,EAAY;AAC7B,MAAA,GAAA,CAAI,OAAO,CAAA;AACX,MAAA;AAAA,IACF;AACA,IAAA,GAAA,CAAI,OAAA,GAAU,OAAA;AAAA,EAChB,CAAC,CAAA;AACH,CAAA;;;;;;;;"}
+{"version":3,"file":"Button.cjs.js","sources":["../../src/ds/components/Button/CreateButton.tsx"],"sourcesContent":["import { Plus } from 'lucide-react';\nimport React, { useRef } from 'react';\nimport { Button } from './Button';\nimport type { ButtonProps } from './Button';\nimport { Kbd } from '@/ds/components/Kbd';\nimport { useKeydown } from '@/lib/keyboard';\nimport { mergeRefs } from '@/lib/merge-refs';\n\nexport const CREATE_BUTTON_SHORTCUT = 'c';\n\nexport interface CreateButtonProps extends Omit<ButtonProps, 'icon' | 'tooltip'> {\n  /** Tooltip text. The `C` shortcut hint is appended automatically. */\n  tooltip: string;\n  /** Set to `false` to unbind the `C` shortcut (the button stays clickable). Defaults to `true`. */\n  shortcutEnabled?: boolean;\n}\n\n/**\n * \"Create\" call-to-action: always renders a `Plus` icon and binds the `C` key to\n * its click. Mount at most one per view — several instances would compete for\n * the same shortcut.\n */\nexport const CreateButton = React.forwardRef<HTMLElement, CreateButtonProps>(\n  ({ tooltip, shortcutEnabled = true, disabled, children, ...props }, forwardedRef) => {\n    const buttonRef = useRef<HTMLElement>(null);\n\n    useKeydown(\n      { [CREATE_BUTTON_SHORTCUT]: () => buttonRef.current?.click() },\n      { enabled: shortcutEnabled && !disabled },\n    );\n\n    return (\n      <Button\n        ref={mergeRefs(buttonRef, forwardedRef)}\n        icon={<Plus />}\n        disabled={disabled}\n        tooltip={\n          <span className=\"inline-flex items-center gap-1.5\">\n            {tooltip}\n            <Kbd size=\"xs\">C</Kbd>\n          </span>\n        }\n        {...props}\n      >\n        {children}\n      </Button>\n    );\n  },\n);\nCreateButton.displayName = 'CreateButton';\n"],"names":["useRef","useKeydown","jsx","Button","mergeRefs","Plus","jsxs","Kbd"],"mappings":";;;;;;;;;;;;;AAQO,MAAM,sBAAA,GAAyB;AAc/B,MAAM,eAAe,KAAA,CAAM,UAAA;AAAA,EAChC,CAAC,EAAE,OAAA,EAAS,eAAA,GAAkB,IAAA,EAAM,UAAU,QAAA,EAAU,GAAG,KAAA,EAAM,EAAG,YAAA,KAAiB;AACnF,IAAA,MAAM,SAAA,GAAYA,aAAoB,IAAI,CAAA;AAE1C,IAAAC,8BAAA;AAAA,MACE,EAAE,CAAC,sBAAsB,GAAG,MAAM,SAAA,CAAU,OAAA,EAAS,OAAM,EAAE;AAAA,MAC7D,EAAE,OAAA,EAAS,eAAA,IAAmB,CAAC,QAAA;AAAS,KAC1C;AAEA,IAAA,uBACEC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,GAAA,EAAKC,mBAAA,CAAU,SAAA,EAAW,YAAY,CAAA;AAAA,QACtC,IAAA,iCAAOC,gBAAA,EAAA,EAAK,CAAA;AAAA,QACZ,QAAA;AAAA,QACA,OAAA,kBACEC,eAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,kCAAA,EACb,QAAA,EAAA;AAAA,UAAA,OAAA;AAAA,0BACDJ,cAAA,CAACK,OAAA,EAAA,EAAI,IAAA,EAAK,IAAA,EAAK,QAAA,EAAA,GAAA,EAAC;AAAA,SAAA,EAClB,CAAA;AAAA,QAED,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,YAAA,CAAa,WAAA,GAAc,cAAA;;;;;;;;"}

package/dist/components/Button.es.js

@@ -1,11 +1,12 @@
-import { B as Button } from '../Button-BY9qlu8K.js';
-export { b as buttonVariants, i as isIconButtonSize } from '../Button-BY9qlu8K.js';
+import { B as Button } from '../Button-C6eUqcPI.js';
+export { b as buttonVariants, i as isIconButtonSize } from '../Button-C6eUqcPI.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Plus } from 'lucide-react';
 import React__default, { useRef } from 'react';
 import { K as Kbd } from '../kbd-BDVTQHD_.js';
 import { useKeydown } from '../keyboard/use-keydown.es.js';
 import '../keyboard/keyboard-shortcuts-context.es.js';
+import { m as mergeRefs } from '../merge-refs-DA1xt2OQ.js';
 
 const CREATE_BUTTON_SHORTCUT = "c";
 const CreateButton = React__default.forwardRef(
@@ -32,16 +33,6 @@ const CreateButton = React__default.forwardRef(
   }
 );
 CreateButton.displayName = "CreateButton";
-const mergeRefs = (...refs) => (element) => {
-  refs.forEach((ref) => {
-    if (!ref) return;
-    if (typeof ref === "function") {
-      ref(element);
-      return;
-    }
-    ref.current = element;
-  });
-};
 
 export { Button, CREATE_BUTTON_SHORTCUT, CreateButton };
 //# sourceMappingURL=Button.es.js.map