@liveblocks/react-ui 3.0.0 → 3.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (126) hide show
  1. package/dist/_private/index.cjs +4 -0
  2. package/dist/_private/index.cjs.map +1 -1
  3. package/dist/_private/index.d.cts +15 -2
  4. package/dist/_private/index.d.ts +15 -2
  5. package/dist/_private/index.js +2 -0
  6. package/dist/_private/index.js.map +1 -1
  7. package/dist/components/AiChat.cjs +2 -2
  8. package/dist/components/AiChat.cjs.map +1 -1
  9. package/dist/components/AiChat.js +2 -2
  10. package/dist/components/AiChat.js.map +1 -1
  11. package/dist/components/AiTool.cjs +9 -7
  12. package/dist/components/AiTool.cjs.map +1 -1
  13. package/dist/components/AiTool.js +9 -7
  14. package/dist/components/AiTool.js.map +1 -1
  15. package/dist/components/Comment.cjs +10 -10
  16. package/dist/components/Comment.cjs.map +1 -1
  17. package/dist/components/Comment.js +10 -10
  18. package/dist/components/Comment.js.map +1 -1
  19. package/dist/components/Composer.cjs +7 -10
  20. package/dist/components/Composer.cjs.map +1 -1
  21. package/dist/components/Composer.js +7 -10
  22. package/dist/components/Composer.js.map +1 -1
  23. package/dist/components/HistoryVersionSummary.cjs +2 -2
  24. package/dist/components/HistoryVersionSummary.cjs.map +1 -1
  25. package/dist/components/HistoryVersionSummary.js +2 -2
  26. package/dist/components/HistoryVersionSummary.js.map +1 -1
  27. package/dist/components/HistoryVersionSummaryList.cjs +2 -5
  28. package/dist/components/HistoryVersionSummaryList.cjs.map +1 -1
  29. package/dist/components/HistoryVersionSummaryList.js +2 -5
  30. package/dist/components/HistoryVersionSummaryList.js.map +1 -1
  31. package/dist/components/InboxNotification.cjs +30 -4
  32. package/dist/components/InboxNotification.cjs.map +1 -1
  33. package/dist/components/InboxNotification.js +30 -4
  34. package/dist/components/InboxNotification.js.map +1 -1
  35. package/dist/components/InboxNotificationList.cjs +2 -2
  36. package/dist/components/InboxNotificationList.cjs.map +1 -1
  37. package/dist/components/InboxNotificationList.js +2 -2
  38. package/dist/components/InboxNotificationList.js.map +1 -1
  39. package/dist/components/Thread.cjs +2 -2
  40. package/dist/components/Thread.cjs.map +1 -1
  41. package/dist/components/Thread.js +2 -2
  42. package/dist/components/Thread.js.map +1 -1
  43. package/dist/components/internal/AiChatAssistantMessage.cjs +9 -4
  44. package/dist/components/internal/AiChatAssistantMessage.cjs.map +1 -1
  45. package/dist/components/internal/AiChatAssistantMessage.js +10 -5
  46. package/dist/components/internal/AiChatAssistantMessage.js.map +1 -1
  47. package/dist/components/internal/AiChatComposer.cjs +2 -2
  48. package/dist/components/internal/AiChatComposer.cjs.map +1 -1
  49. package/dist/components/internal/AiChatComposer.js +2 -2
  50. package/dist/components/internal/AiChatComposer.js.map +1 -1
  51. package/dist/components/internal/AiChatUserMessage.cjs +2 -2
  52. package/dist/components/internal/AiChatUserMessage.cjs.map +1 -1
  53. package/dist/components/internal/AiChatUserMessage.js +2 -2
  54. package/dist/components/internal/AiChatUserMessage.js.map +1 -1
  55. package/dist/components/internal/Attachment.cjs +3 -3
  56. package/dist/components/internal/Attachment.cjs.map +1 -1
  57. package/dist/components/internal/Attachment.js +3 -3
  58. package/dist/components/internal/Attachment.js.map +1 -1
  59. package/dist/components/internal/Attribution.cjs +2 -2
  60. package/dist/components/internal/Attribution.cjs.map +1 -1
  61. package/dist/components/internal/Attribution.js +2 -2
  62. package/dist/components/internal/Attribution.js.map +1 -1
  63. package/dist/components/internal/Avatar.cjs +2 -2
  64. package/dist/components/internal/Avatar.cjs.map +1 -1
  65. package/dist/components/internal/Avatar.js +2 -2
  66. package/dist/components/internal/Avatar.js.map +1 -1
  67. package/dist/components/internal/Button.cjs +3 -3
  68. package/dist/components/internal/Button.cjs.map +1 -1
  69. package/dist/components/internal/Button.js +3 -3
  70. package/dist/components/internal/Button.js.map +1 -1
  71. package/dist/components/internal/Dropdown.cjs +3 -3
  72. package/dist/components/internal/Dropdown.cjs.map +1 -1
  73. package/dist/components/internal/Dropdown.js +3 -3
  74. package/dist/components/internal/Dropdown.js.map +1 -1
  75. package/dist/components/internal/Emoji.cjs +2 -2
  76. package/dist/components/internal/Emoji.cjs.map +1 -1
  77. package/dist/components/internal/Emoji.js +2 -2
  78. package/dist/components/internal/Emoji.js.map +1 -1
  79. package/dist/components/internal/EmojiPicker.cjs +5 -5
  80. package/dist/components/internal/EmojiPicker.cjs.map +1 -1
  81. package/dist/components/internal/EmojiPicker.js +5 -5
  82. package/dist/components/internal/EmojiPicker.js.map +1 -1
  83. package/dist/components/internal/Icon.cjs +2 -2
  84. package/dist/components/internal/Icon.cjs.map +1 -1
  85. package/dist/components/internal/Icon.js +2 -2
  86. package/dist/components/internal/Icon.js.map +1 -1
  87. package/dist/components/internal/InboxNotificationThread.cjs +2 -2
  88. package/dist/components/internal/InboxNotificationThread.cjs.map +1 -1
  89. package/dist/components/internal/InboxNotificationThread.js +2 -2
  90. package/dist/components/internal/InboxNotificationThread.js.map +1 -1
  91. package/dist/components/internal/List.cjs +2 -2
  92. package/dist/components/internal/List.cjs.map +1 -1
  93. package/dist/components/internal/List.js +2 -2
  94. package/dist/components/internal/List.js.map +1 -1
  95. package/dist/components/internal/Prose.cjs +2 -2
  96. package/dist/components/internal/Prose.cjs.map +1 -1
  97. package/dist/components/internal/Prose.js +2 -2
  98. package/dist/components/internal/Prose.js.map +1 -1
  99. package/dist/components/internal/Room.cjs +2 -2
  100. package/dist/components/internal/Room.cjs.map +1 -1
  101. package/dist/components/internal/Room.js +2 -2
  102. package/dist/components/internal/Room.js.map +1 -1
  103. package/dist/components/internal/Tooltip.cjs +2 -2
  104. package/dist/components/internal/Tooltip.cjs.map +1 -1
  105. package/dist/components/internal/Tooltip.js +2 -2
  106. package/dist/components/internal/Tooltip.js.map +1 -1
  107. package/dist/components/internal/User.cjs +2 -2
  108. package/dist/components/internal/User.cjs.map +1 -1
  109. package/dist/components/internal/User.js +2 -2
  110. package/dist/components/internal/User.js.map +1 -1
  111. package/dist/index.cjs.map +1 -1
  112. package/dist/index.d.cts +34 -1
  113. package/dist/index.d.ts +34 -1
  114. package/dist/index.js.map +1 -1
  115. package/dist/utils/{class-names.cjs → cn.cjs} +3 -3
  116. package/dist/utils/cn.cjs.map +1 -0
  117. package/dist/utils/{class-names.js → cn.js} +3 -3
  118. package/dist/utils/cn.js.map +1 -0
  119. package/dist/version.cjs +1 -1
  120. package/dist/version.js +1 -1
  121. package/package.json +4 -4
  122. package/src/styles/index.css +9 -6
  123. package/styles.css +1 -1
  124. package/styles.css.map +1 -1
  125. package/dist/utils/class-names.cjs.map +0 -1
  126. package/dist/utils/class-names.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Prose.cjs","sources":["../../../src/components/internal/Prose.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { useComponents } from \"../../components\";\nimport type {\n MarkdownComponents,\n MarkdownComponentsCodeBlockProps,\n MarkdownComponentsLinkProps,\n} from \"../../primitives/Markdown\";\nimport { Markdown } from \"../../primitives/Markdown\";\nimport { classNames } from \"../../utils/class-names\";\nimport { CodeBlock as DefaultCodeBlock } from \"./CodeBlock\";\n\ninterface ProseProps extends ComponentProps<\"div\"> {\n content: string;\n}\n\nfunction Link({ href, title, children }: MarkdownComponentsLinkProps) {\n const { Anchor } = useComponents();\n\n return (\n <Anchor href={href} title={title}>\n {children}\n </Anchor>\n );\n}\n\nfunction CodeBlock({ language, code }: MarkdownComponentsCodeBlockProps) {\n return <DefaultCodeBlock title={language || \"Plain text\"} code={code} />;\n}\n\nconst markdownComponents: Partial<MarkdownComponents> = {\n Link,\n CodeBlock,\n};\n\n/**\n * This component renders Markdown content with `lb-prose`\n * styles and custom components (code blocks, etc)\n */\nexport function Prose({ content, className, ...props }: ProseProps) {\n return (\n <Markdown\n content={content}\n components={markdownComponents}\n className={classNames(\"lb-prose\", className)}\n {...props}\n />\n );\n}\n"],"names":["useComponents","jsx","DefaultCodeBlock","Markdown","classNames"],"mappings":";;;;;;;;AAgBA,SAAS,IAAK,CAAA,EAAE,IAAM,EAAA,KAAA,EAAO,UAAyC,EAAA;AACpE,EAAM,MAAA,EAAE,MAAO,EAAA,GAAIA,wBAAc,EAAA,CAAA;AAEjC,EAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,IAAO,IAAA;AAAA,IAAY,KAAA;AAAA,IACjB,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,SAAU,CAAA,EAAE,QAAU,EAAA,IAAA,EAA0C,EAAA;AACvE,EAAA,uBAAQA,cAAA,CAAAC,qBAAA,EAAA;AAAA,IAAiB,OAAO,QAAY,IAAA,YAAA;AAAA,IAAc,IAAA;AAAA,GAAY,CAAA,CAAA;AACxE,CAAA;AAEA,MAAM,kBAAkD,GAAA;AAAA,EACtD,IAAA;AAAA,EACA,SAAA;AACF,CAAA,CAAA;AAMO,SAAS,KAAM,CAAA,EAAE,OAAS,EAAA,SAAA,EAAA,GAAc,OAAqB,EAAA;AAClE,EAAA,uBACGD,cAAA,CAAAE,iBAAA,EAAA;AAAA,IACC,OAAA;AAAA,IACA,UAAY,EAAA,kBAAA;AAAA,IACZ,SAAA,EAAWC,qBAAW,CAAA,UAAA,EAAY,SAAS,CAAA;AAAA,IAC1C,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"Prose.cjs","sources":["../../../src/components/internal/Prose.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { useComponents } from \"../../components\";\nimport type {\n MarkdownComponents,\n MarkdownComponentsCodeBlockProps,\n MarkdownComponentsLinkProps,\n} from \"../../primitives/Markdown\";\nimport { Markdown } from \"../../primitives/Markdown\";\nimport { cn } from \"../../utils/cn\";\nimport { CodeBlock as DefaultCodeBlock } from \"./CodeBlock\";\n\ninterface ProseProps extends ComponentProps<\"div\"> {\n content: string;\n}\n\nfunction Link({ href, title, children }: MarkdownComponentsLinkProps) {\n const { Anchor } = useComponents();\n\n return (\n <Anchor href={href} title={title}>\n {children}\n </Anchor>\n );\n}\n\nfunction CodeBlock({ language, code }: MarkdownComponentsCodeBlockProps) {\n return <DefaultCodeBlock title={language || \"Plain text\"} code={code} />;\n}\n\nconst markdownComponents: Partial<MarkdownComponents> = {\n Link,\n CodeBlock,\n};\n\n/**\n * This component renders Markdown content with `lb-prose`\n * styles and custom components (code blocks, etc)\n */\nexport function Prose({ content, className, ...props }: ProseProps) {\n return (\n <Markdown\n content={content}\n components={markdownComponents}\n className={cn(\"lb-prose\", className)}\n {...props}\n />\n );\n}\n"],"names":["useComponents","jsx","DefaultCodeBlock","Markdown","cn"],"mappings":";;;;;;;;AAgBA,SAAS,IAAK,CAAA,EAAE,IAAM,EAAA,KAAA,EAAO,UAAyC,EAAA;AACpE,EAAM,MAAA,EAAE,MAAO,EAAA,GAAIA,wBAAc,EAAA,CAAA;AAEjC,EAAA,uBACGC,cAAA,CAAA,MAAA,EAAA;AAAA,IAAO,IAAA;AAAA,IAAY,KAAA;AAAA,IACjB,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,SAAU,CAAA,EAAE,QAAU,EAAA,IAAA,EAA0C,EAAA;AACvE,EAAA,uBAAQA,cAAA,CAAAC,qBAAA,EAAA;AAAA,IAAiB,OAAO,QAAY,IAAA,YAAA;AAAA,IAAc,IAAA;AAAA,GAAY,CAAA,CAAA;AACxE,CAAA;AAEA,MAAM,kBAAkD,GAAA;AAAA,EACtD,IAAA;AAAA,EACA,SAAA;AACF,CAAA,CAAA;AAMO,SAAS,KAAM,CAAA,EAAE,OAAS,EAAA,SAAA,EAAA,GAAc,OAAqB,EAAA;AAClE,EAAA,uBACGD,cAAA,CAAAE,iBAAA,EAAA;AAAA,IACC,OAAA;AAAA,IACA,UAAY,EAAA,kBAAA;AAAA,IACZ,SAAA,EAAWC,KAAG,CAAA,UAAA,EAAY,SAAS,CAAA;AAAA,IAClC,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ;;;;"}
@@ -1,7 +1,7 @@
1
1
  import { jsx } from 'react/jsx-runtime';
2
2
  import { useComponents } from '../../components.js';
3
3
  import { Markdown } from '../../primitives/Markdown.js';
4
- import { classNames } from '../../utils/class-names.js';
4
+ import { cn } from '../../utils/cn.js';
5
5
  import { CodeBlock as CodeBlock$1 } from './CodeBlock.js';
6
6
 
7
7
  function Link({ href, title, children }) {
@@ -26,7 +26,7 @@ function Prose({ content, className, ...props }) {
26
26
  return /* @__PURE__ */ jsx(Markdown, {
27
27
  content,
28
28
  components: markdownComponents,
29
- className: classNames("lb-prose", className),
29
+ className: cn("lb-prose", className),
30
30
  ...props
31
31
  });
32
32
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Prose.js","sources":["../../../src/components/internal/Prose.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { useComponents } from \"../../components\";\nimport type {\n MarkdownComponents,\n MarkdownComponentsCodeBlockProps,\n MarkdownComponentsLinkProps,\n} from \"../../primitives/Markdown\";\nimport { Markdown } from \"../../primitives/Markdown\";\nimport { classNames } from \"../../utils/class-names\";\nimport { CodeBlock as DefaultCodeBlock } from \"./CodeBlock\";\n\ninterface ProseProps extends ComponentProps<\"div\"> {\n content: string;\n}\n\nfunction Link({ href, title, children }: MarkdownComponentsLinkProps) {\n const { Anchor } = useComponents();\n\n return (\n <Anchor href={href} title={title}>\n {children}\n </Anchor>\n );\n}\n\nfunction CodeBlock({ language, code }: MarkdownComponentsCodeBlockProps) {\n return <DefaultCodeBlock title={language || \"Plain text\"} code={code} />;\n}\n\nconst markdownComponents: Partial<MarkdownComponents> = {\n Link,\n CodeBlock,\n};\n\n/**\n * This component renders Markdown content with `lb-prose`\n * styles and custom components (code blocks, etc)\n */\nexport function Prose({ content, className, ...props }: ProseProps) {\n return (\n <Markdown\n content={content}\n components={markdownComponents}\n className={classNames(\"lb-prose\", className)}\n {...props}\n />\n );\n}\n"],"names":["DefaultCodeBlock"],"mappings":";;;;;;AAgBA,SAAS,IAAK,CAAA,EAAE,IAAM,EAAA,KAAA,EAAO,UAAyC,EAAA;AACpE,EAAM,MAAA,EAAE,MAAO,EAAA,GAAI,aAAc,EAAA,CAAA;AAEjC,EAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,IAAO,IAAA;AAAA,IAAY,KAAA;AAAA,IACjB,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,SAAU,CAAA,EAAE,QAAU,EAAA,IAAA,EAA0C,EAAA;AACvE,EAAA,uBAAQ,GAAA,CAAAA,WAAA,EAAA;AAAA,IAAiB,OAAO,QAAY,IAAA,YAAA;AAAA,IAAc,IAAA;AAAA,GAAY,CAAA,CAAA;AACxE,CAAA;AAEA,MAAM,kBAAkD,GAAA;AAAA,EACtD,IAAA;AAAA,EACA,SAAA;AACF,CAAA,CAAA;AAMO,SAAS,KAAM,CAAA,EAAE,OAAS,EAAA,SAAA,EAAA,GAAc,OAAqB,EAAA;AAClE,EAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,IACC,OAAA;AAAA,IACA,UAAY,EAAA,kBAAA;AAAA,IACZ,SAAA,EAAW,UAAW,CAAA,UAAA,EAAY,SAAS,CAAA;AAAA,IAC1C,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ;;;;"}
1
+ {"version":3,"file":"Prose.js","sources":["../../../src/components/internal/Prose.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { useComponents } from \"../../components\";\nimport type {\n MarkdownComponents,\n MarkdownComponentsCodeBlockProps,\n MarkdownComponentsLinkProps,\n} from \"../../primitives/Markdown\";\nimport { Markdown } from \"../../primitives/Markdown\";\nimport { cn } from \"../../utils/cn\";\nimport { CodeBlock as DefaultCodeBlock } from \"./CodeBlock\";\n\ninterface ProseProps extends ComponentProps<\"div\"> {\n content: string;\n}\n\nfunction Link({ href, title, children }: MarkdownComponentsLinkProps) {\n const { Anchor } = useComponents();\n\n return (\n <Anchor href={href} title={title}>\n {children}\n </Anchor>\n );\n}\n\nfunction CodeBlock({ language, code }: MarkdownComponentsCodeBlockProps) {\n return <DefaultCodeBlock title={language || \"Plain text\"} code={code} />;\n}\n\nconst markdownComponents: Partial<MarkdownComponents> = {\n Link,\n CodeBlock,\n};\n\n/**\n * This component renders Markdown content with `lb-prose`\n * styles and custom components (code blocks, etc)\n */\nexport function Prose({ content, className, ...props }: ProseProps) {\n return (\n <Markdown\n content={content}\n components={markdownComponents}\n className={cn(\"lb-prose\", className)}\n {...props}\n />\n );\n}\n"],"names":["DefaultCodeBlock"],"mappings":";;;;;;AAgBA,SAAS,IAAK,CAAA,EAAE,IAAM,EAAA,KAAA,EAAO,UAAyC,EAAA;AACpE,EAAM,MAAA,EAAE,MAAO,EAAA,GAAI,aAAc,EAAA,CAAA;AAEjC,EAAA,uBACG,GAAA,CAAA,MAAA,EAAA;AAAA,IAAO,IAAA;AAAA,IAAY,KAAA;AAAA,IACjB,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,SAAU,CAAA,EAAE,QAAU,EAAA,IAAA,EAA0C,EAAA;AACvE,EAAA,uBAAQ,GAAA,CAAAA,WAAA,EAAA;AAAA,IAAiB,OAAO,QAAY,IAAA,YAAA;AAAA,IAAc,IAAA;AAAA,GAAY,CAAA,CAAA;AACxE,CAAA;AAEA,MAAM,kBAAkD,GAAA;AAAA,EACtD,IAAA;AAAA,EACA,SAAA;AACF,CAAA,CAAA;AAMO,SAAS,KAAM,CAAA,EAAE,OAAS,EAAA,SAAA,EAAA,GAAc,OAAqB,EAAA;AAClE,EAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,IACC,OAAA;AAAA,IACA,UAAY,EAAA,kBAAA;AAAA,IACZ,SAAA,EAAW,EAAG,CAAA,UAAA,EAAY,SAAS,CAAA;AAAA,IAClC,GAAG,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ;;;;"}
@@ -4,7 +4,7 @@
4
4
  var jsxRuntime = require('react/jsx-runtime');
5
5
  var react = require('@liveblocks/react');
6
6
  var react$1 = require('react');
7
- var classNames = require('../../utils/class-names.cjs');
7
+ var cn = require('../../utils/cn.cjs');
8
8
 
9
9
 
10
10
  function Room({ roomId, className, ...props }) {
@@ -13,7 +13,7 @@ function Room({ roomId, className, ...props }) {
13
13
  return info?.name ?? roomId;
14
14
  }, [info?.name, roomId]);
15
15
  return /* @__PURE__ */ jsxRuntime.jsx("span", {
16
- className: classNames.classNames("lb-name lb-room", className),
16
+ className: cn.cn("lb-name lb-room", className),
17
17
  "data-loading": isLoading ? "" : void 0,
18
18
  ...props,
19
19
  children: isLoading ? null : resolvedRoomName
@@ -1 +1 @@
1
- {"version":3,"file":"Room.cjs","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n const { info, isLoading } = useRoomInfo(roomId);\n const resolvedRoomName = useMemo(() => {\n return info?.name ?? roomId;\n }, [info?.name, roomId]);\n\n return (\n <span\n className={classNames(\"lb-name lb-room\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedRoomName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
1
+ {"version":3,"file":"Room.cjs","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n const { info, isLoading } = useRoomInfo(roomId);\n const resolvedRoomName = useMemo(() => {\n return info?.name ?? roomId;\n }, [info?.name, roomId]);\n\n return (\n <span\n className={cn(\"lb-name lb-room\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedRoomName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AAC2C;AACX;AAC3B;AAEgB;AAG1B;;"}
@@ -2,7 +2,7 @@
2
2
  import { jsx } from 'react/jsx-runtime';
3
3
  import { useRoomInfo } from '@liveblocks/react';
4
4
  import { useMemo } from 'react';
5
- import { classNames } from '../../utils/class-names.js';
5
+ import { cn } from '../../utils/cn.js';
6
6
 
7
7
 
8
8
  function Room({ roomId, className, ...props }) {
@@ -11,7 +11,7 @@ function Room({ roomId, className, ...props }) {
11
11
  return info?.name ?? roomId;
12
12
  }, [info?.name, roomId]);
13
13
  return /* @__PURE__ */ jsx("span", {
14
- className: classNames("lb-name lb-room", className),
14
+ className: cn("lb-name lb-room", className),
15
15
  "data-loading": isLoading ? "" : void 0,
16
16
  ...props,
17
17
  children: isLoading ? null : resolvedRoomName
@@ -1 +1 @@
1
- {"version":3,"file":"Room.js","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n const { info, isLoading } = useRoomInfo(roomId);\n const resolvedRoomName = useMemo(() => {\n return info?.name ?? roomId;\n }, [info?.name, roomId]);\n\n return (\n <span\n className={classNames(\"lb-name lb-room\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedRoomName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
1
+ {"version":3,"file":"Room.js","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n const { info, isLoading } = useRoomInfo(roomId);\n const resolvedRoomName = useMemo(() => {\n return info?.name ?? roomId;\n }, [info?.name, roomId]);\n\n return (\n <span\n className={cn(\"lb-name lb-room\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedRoomName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AAC2C;AACX;AAC3B;AAEgB;AAG1B;;"}
@@ -6,7 +6,7 @@ var TooltipPrimitive = require('@radix-ui/react-tooltip');
6
6
  var react = require('react');
7
7
  var config = require('../../config.cjs');
8
8
  var constants = require('../../constants.cjs');
9
- var classNames = require('../../utils/class-names.cjs');
9
+ var cn = require('../../utils/cn.cjs');
10
10
  var isApple = require('../../utils/is-apple.cjs');
11
11
 
12
12
  function _interopNamespaceDefault(e) {
@@ -80,7 +80,7 @@ const Tooltip = react.forwardRef(
80
80
  /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, {
81
81
  container: portalContainer,
82
82
  children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Content, {
83
- className: classNames.classNames(
83
+ className: cn.cn(
84
84
  "lb-root lb-portal lb-tooltip",
85
85
  multiline && "lb-tooltip:multiline",
86
86
  className
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUiConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { classNames } from \"../../utils/class-names\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n alt: () => ALT_KEY,\n mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n control: () => CONTROL_KEY,\n ctrl: () => CONTROL_KEY,\n command: () => COMMAND_KEY,\n cmd: () => COMMAND_KEY,\n shift: () => SHIFT_KEY,\n enter: () => ENTER_KEY,\n \" \": () => SPACE_KEY,\n space: () => SPACE_KEY,\n escape: () => ESCAPE_KEY,\n esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n content: ReactNode;\n multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n const keys = keymap.split(\"-\");\n\n return (\n <>\n {keys.map((key, index) => {\n const lowerKey = key.toLowerCase();\n\n if (lowerKey in KEYS) {\n return (\n <ShortcutTooltipKey\n key={index}\n name={lowerKey as keyof typeof KEYS}\n />\n );\n }\n\n return <span key={index}>{key}</span>;\n })}\n </>\n );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n ({ children, content, multiline, className, ...props }, forwardedRef) => {\n const { portalContainer } = useLiveblocksUiConfig();\n\n return (\n <TooltipPrimitive.Root disableHoverableContent>\n <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal container={portalContainer}>\n <TooltipPrimitive.Content\n className={classNames(\n \"lb-root lb-portal lb-tooltip\",\n multiline && \"lb-tooltip:multiline\",\n className\n )}\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n );\n }\n);\n\nexport const ShortcutTooltip = forwardRef<\n HTMLButtonElement,\n ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n const shortcutKbd = useMemo(() => {\n return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n }, [shortcut]);\n\n return (\n <Tooltip\n content={\n <>\n {content}\n {shortcutKbd && (\n <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n )}\n </>\n }\n {...props}\n ref={forwardedRef}\n >\n {children}\n </Tooltip>\n );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n return (\n <abbr title={title} {...props}>\n {key}\n </abbr>\n );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAa;AACA;AAC2B;AACvB;AACH;AACG;AACJ;AACE;AACA;AACF;AACE;AACC;AAEhB;AAiBA;AACE;AAEA;AACE;AAEI;AAEA;AACE;AACG;AAEO;AACR;AAIJ;AAAQ;AAAkB;AAAI;AAC/B;AAGP;AAEO;AAAgB;AAEnB;AAEA;AACG;AAA6C;AAC5C;AAAC;AAAgC;AAAM;AACpC;AACH;AACC;AAAmC;AACjC;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AACH;AACF;AAAA;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACG;AAEG;AACG;AAAA;AAEE;AAAc;AAAuB;AAAY;AAAA;AAEtD;AAEE;AACC;AAEJ;AAGP;AAEA;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;;;;;;"}
1
+ {"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUiConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { cn } from \"../../utils/cn\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n alt: () => ALT_KEY,\n mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n control: () => CONTROL_KEY,\n ctrl: () => CONTROL_KEY,\n command: () => COMMAND_KEY,\n cmd: () => COMMAND_KEY,\n shift: () => SHIFT_KEY,\n enter: () => ENTER_KEY,\n \" \": () => SPACE_KEY,\n space: () => SPACE_KEY,\n escape: () => ESCAPE_KEY,\n esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n content: ReactNode;\n multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n const keys = keymap.split(\"-\");\n\n return (\n <>\n {keys.map((key, index) => {\n const lowerKey = key.toLowerCase();\n\n if (lowerKey in KEYS) {\n return (\n <ShortcutTooltipKey\n key={index}\n name={lowerKey as keyof typeof KEYS}\n />\n );\n }\n\n return <span key={index}>{key}</span>;\n })}\n </>\n );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n ({ children, content, multiline, className, ...props }, forwardedRef) => {\n const { portalContainer } = useLiveblocksUiConfig();\n\n return (\n <TooltipPrimitive.Root disableHoverableContent>\n <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal container={portalContainer}>\n <TooltipPrimitive.Content\n className={cn(\n \"lb-root lb-portal lb-tooltip\",\n multiline && \"lb-tooltip:multiline\",\n className\n )}\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n );\n }\n);\n\nexport const ShortcutTooltip = forwardRef<\n HTMLButtonElement,\n ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n const shortcutKbd = useMemo(() => {\n return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n }, [shortcut]);\n\n return (\n <Tooltip\n content={\n <>\n {content}\n {shortcutKbd && (\n <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n )}\n </>\n }\n {...props}\n ref={forwardedRef}\n >\n {children}\n </Tooltip>\n );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n return (\n <abbr title={title} {...props}>\n {key}\n </abbr>\n );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAa;AACA;AAC2B;AACvB;AACH;AACG;AACJ;AACE;AACA;AACF;AACE;AACC;AAEhB;AAiBA;AACE;AAEA;AACE;AAEI;AAEA;AACE;AACG;AAEO;AACR;AAIJ;AAAQ;AAAkB;AAAI;AAC/B;AAGP;AAEO;AAAgB;AAEnB;AAEA;AACG;AAA6C;AAC5C;AAAC;AAAgC;AAAM;AACpC;AACH;AACC;AAAmC;AACjC;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AACH;AACF;AAAA;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACG;AAEG;AACG;AAAA;AAEE;AAAc;AAAuB;AAAY;AAAA;AAEtD;AAEE;AACC;AAEJ;AAGP;AAEA;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;;;;;;"}
@@ -5,7 +5,7 @@ export { TooltipProvider } from '@radix-ui/react-tooltip';
5
5
  import { forwardRef, useMemo } from 'react';
6
6
  import { useLiveblocksUiConfig } from '../../config.js';
7
7
  import { FLOATING_ELEMENT_SIDE_OFFSET, FLOATING_ELEMENT_COLLISION_PADDING } from '../../constants.js';
8
- import { classNames } from '../../utils/class-names.js';
8
+ import { cn } from '../../utils/cn.js';
9
9
  import { isApple } from '../../utils/is-apple.js';
10
10
 
11
11
 
@@ -60,7 +60,7 @@ const Tooltip = forwardRef(
60
60
  /* @__PURE__ */ jsx(TooltipPrimitive.Portal, {
61
61
  container: portalContainer,
62
62
  children: /* @__PURE__ */ jsx(TooltipPrimitive.Content, {
63
- className: classNames(
63
+ className: cn(
64
64
  "lb-root lb-portal lb-tooltip",
65
65
  multiline && "lb-tooltip:multiline",
66
66
  className
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUiConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { classNames } from \"../../utils/class-names\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n alt: () => ALT_KEY,\n mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n control: () => CONTROL_KEY,\n ctrl: () => CONTROL_KEY,\n command: () => COMMAND_KEY,\n cmd: () => COMMAND_KEY,\n shift: () => SHIFT_KEY,\n enter: () => ENTER_KEY,\n \" \": () => SPACE_KEY,\n space: () => SPACE_KEY,\n escape: () => ESCAPE_KEY,\n esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n content: ReactNode;\n multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n const keys = keymap.split(\"-\");\n\n return (\n <>\n {keys.map((key, index) => {\n const lowerKey = key.toLowerCase();\n\n if (lowerKey in KEYS) {\n return (\n <ShortcutTooltipKey\n key={index}\n name={lowerKey as keyof typeof KEYS}\n />\n );\n }\n\n return <span key={index}>{key}</span>;\n })}\n </>\n );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n ({ children, content, multiline, className, ...props }, forwardedRef) => {\n const { portalContainer } = useLiveblocksUiConfig();\n\n return (\n <TooltipPrimitive.Root disableHoverableContent>\n <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal container={portalContainer}>\n <TooltipPrimitive.Content\n className={classNames(\n \"lb-root lb-portal lb-tooltip\",\n multiline && \"lb-tooltip:multiline\",\n className\n )}\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n );\n }\n);\n\nexport const ShortcutTooltip = forwardRef<\n HTMLButtonElement,\n ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n const shortcutKbd = useMemo(() => {\n return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n }, [shortcut]);\n\n return (\n <Tooltip\n content={\n <>\n {content}\n {shortcutKbd && (\n <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n )}\n </>\n }\n {...props}\n ref={forwardedRef}\n >\n {children}\n </Tooltip>\n );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n return (\n <abbr title={title} {...props}>\n {key}\n </abbr>\n );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAa;AACA;AAC2B;AACvB;AACH;AACG;AACJ;AACE;AACA;AACF;AACE;AACC;AAEhB;AAiBA;AACE;AAEA;AACE;AAEI;AAEA;AACE;AACG;AAEO;AACR;AAIJ;AAAQ;AAAkB;AAAI;AAC/B;AAGP;AAEO;AAAgB;AAEnB;AAEA;AACG;AAA6C;AAC5C;AAAC;AAAgC;AAAM;AACpC;AACH;AACC;AAAmC;AACjC;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AACH;AACF;AAAA;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACG;AAEG;AACG;AAAA;AAEE;AAAc;AAAuB;AAAY;AAAA;AAEtD;AAEE;AACC;AAEJ;AAGP;AAEA;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;"}
1
+ {"version":3,"file":"Tooltip.js","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUiConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { cn } from \"../../utils/cn\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n alt: () => ALT_KEY,\n mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n control: () => CONTROL_KEY,\n ctrl: () => CONTROL_KEY,\n command: () => COMMAND_KEY,\n cmd: () => COMMAND_KEY,\n shift: () => SHIFT_KEY,\n enter: () => ENTER_KEY,\n \" \": () => SPACE_KEY,\n space: () => SPACE_KEY,\n escape: () => ESCAPE_KEY,\n esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n content: ReactNode;\n multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n const keys = keymap.split(\"-\");\n\n return (\n <>\n {keys.map((key, index) => {\n const lowerKey = key.toLowerCase();\n\n if (lowerKey in KEYS) {\n return (\n <ShortcutTooltipKey\n key={index}\n name={lowerKey as keyof typeof KEYS}\n />\n );\n }\n\n return <span key={index}>{key}</span>;\n })}\n </>\n );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n ({ children, content, multiline, className, ...props }, forwardedRef) => {\n const { portalContainer } = useLiveblocksUiConfig();\n\n return (\n <TooltipPrimitive.Root disableHoverableContent>\n <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n {children}\n </TooltipPrimitive.Trigger>\n <TooltipPrimitive.Portal container={portalContainer}>\n <TooltipPrimitive.Content\n className={cn(\n \"lb-root lb-portal lb-tooltip\",\n multiline && \"lb-tooltip:multiline\",\n className\n )}\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </TooltipPrimitive.Content>\n </TooltipPrimitive.Portal>\n </TooltipPrimitive.Root>\n );\n }\n);\n\nexport const ShortcutTooltip = forwardRef<\n HTMLButtonElement,\n ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n const shortcutKbd = useMemo(() => {\n return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n }, [shortcut]);\n\n return (\n <Tooltip\n content={\n <>\n {content}\n {shortcutKbd && (\n <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n )}\n </>\n }\n {...props}\n ref={forwardedRef}\n >\n {children}\n </Tooltip>\n );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n return (\n <abbr title={title} {...props}>\n {key}\n </abbr>\n );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAa;AACA;AAC2B;AACvB;AACH;AACG;AACJ;AACE;AACA;AACF;AACE;AACC;AAEhB;AAiBA;AACE;AAEA;AACE;AAEI;AAEA;AACE;AACG;AAEO;AACR;AAIJ;AAAQ;AAAkB;AAAI;AAC/B;AAGP;AAEO;AAAgB;AAEnB;AAEA;AACG;AAA6C;AAC5C;AAAC;AAAgC;AAAM;AACpC;AACH;AACC;AAAmC;AACjC;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AACH;AACF;AAAA;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACG;AAEG;AACG;AAAA;AAEE;AAAc;AAAuB;AAAY;AAAA;AAEtD;AAEE;AACC;AAEJ;AAGP;AAEA;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;"}
@@ -6,7 +6,7 @@ var react = require('@liveblocks/react');
6
6
  var react$1 = require('react');
7
7
  var overrides = require('../../overrides.cjs');
8
8
  var shared = require('../../shared.cjs');
9
- var classNames = require('../../utils/class-names.cjs');
9
+ var cn = require('../../utils/cn.cjs');
10
10
 
11
11
 
12
12
  function User({ userId, replaceSelf, className, ...props }) {
@@ -17,7 +17,7 @@ function User({ userId, replaceSelf, className, ...props }) {
17
17
  return replaceSelf && currentId === userId ? $.USER_SELF : user?.name ?? $.USER_UNKNOWN;
18
18
  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);
19
19
  return /* @__PURE__ */ jsxRuntime.jsx("span", {
20
- className: classNames.classNames("lb-name lb-user", className),
20
+ className: cn.cn("lb-name lb-user", className),
21
21
  "data-loading": isLoading ? "" : void 0,
22
22
  ...props,
23
23
  children: isLoading ? null : resolvedUserName
@@ -1 +1 @@
1
- {"version":3,"file":"User.cjs","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n /**\n * The user ID to display the user name for.\n */\n userId: string;\n\n /**\n * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n */\n replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n const currentId = useCurrentUserId();\n const { user, isLoading } = useUser(userId);\n const $ = useOverrides();\n const resolvedUserName = useMemo(() => {\n return replaceSelf && currentId === userId\n ? $.USER_SELF\n : (user?.name ?? $.USER_UNKNOWN);\n }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n return (\n <span\n className={classNames(\"lb-name lb-user\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedUserName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
1
+ {"version":3,"file":"User.cjs","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n /**\n * The user ID to display the user name for.\n */\n userId: string;\n\n /**\n * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n */\n replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n const currentId = useCurrentUserId();\n const { user, isLoading } = useUser(userId);\n const $ = useOverrides();\n const resolvedUserName = useMemo(() => {\n return replaceSelf && currentId === userId\n ? $.USER_SELF\n : (user?.name ?? $.USER_UNKNOWN);\n }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n return (\n <span\n className={cn(\"lb-name lb-user\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedUserName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AAC2C;AACX;AAC3B;AAEgB;AAG1B;;"}
@@ -4,7 +4,7 @@ import { useUser } from '@liveblocks/react';
4
4
  import { useMemo } from 'react';
5
5
  import { useOverrides } from '../../overrides.js';
6
6
  import { useCurrentUserId } from '../../shared.js';
7
- import { classNames } from '../../utils/class-names.js';
7
+ import { cn } from '../../utils/cn.js';
8
8
 
9
9
 
10
10
  function User({ userId, replaceSelf, className, ...props }) {
@@ -15,7 +15,7 @@ function User({ userId, replaceSelf, className, ...props }) {
15
15
  return replaceSelf && currentId === userId ? $.USER_SELF : user?.name ?? $.USER_UNKNOWN;
16
16
  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);
17
17
  return /* @__PURE__ */ jsx("span", {
18
- className: classNames("lb-name lb-user", className),
18
+ className: cn("lb-name lb-user", className),
19
19
  "data-loading": isLoading ? "" : void 0,
20
20
  ...props,
21
21
  children: isLoading ? null : resolvedUserName
@@ -1 +1 @@
1
- {"version":3,"file":"User.js","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n /**\n * The user ID to display the user name for.\n */\n userId: string;\n\n /**\n * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n */\n replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n const currentId = useCurrentUserId();\n const { user, isLoading } = useUser(userId);\n const $ = useOverrides();\n const resolvedUserName = useMemo(() => {\n return replaceSelf && currentId === userId\n ? $.USER_SELF\n : (user?.name ?? $.USER_UNKNOWN);\n }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n return (\n <span\n className={classNames(\"lb-name lb-user\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedUserName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
1
+ {"version":3,"file":"User.js","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { cn } from \"../../utils/cn\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n /**\n * The user ID to display the user name for.\n */\n userId: string;\n\n /**\n * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n */\n replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n const currentId = useCurrentUserId();\n const { user, isLoading } = useUser(userId);\n const $ = useOverrides();\n const resolvedUserName = useMemo(() => {\n return replaceSelf && currentId === userId\n ? $.USER_SELF\n : (user?.name ?? $.USER_UNKNOWN);\n }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n return (\n <span\n className={cn(\"lb-name lb-user\", className)}\n data-loading={isLoading ? \"\" : undefined}\n {...props}\n >\n {isLoading ? null : resolvedUserName}\n </span>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AAC2C;AACX;AAC3B;AAEgB;AAG1B;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type {\n AiChatComponents,\n AiChatComponentsEmptyProps,\n AiChatComponentsLoadingProps,\n AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type { CommentProps } from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n InboxNotificationAvatarProps,\n InboxNotificationCustomKindProps,\n InboxNotificationCustomProps,\n InboxNotificationIconProps,\n InboxNotificationProps,\n InboxNotificationTextMentionKindProps,\n InboxNotificationTextMentionProps,\n InboxNotificationThreadKindProps,\n InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n CommentOverrides,\n ComposerOverrides,\n GlobalOverrides,\n InboxNotificationOverrides,\n LocalizationOverrides,\n Overrides,\n ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type { ComposerSubmitComment } from \"./primitives\";\nexport type {\n CommentAttachmentArgs,\n ComposerBodyMark,\n ComposerBodyMarks,\n} from \"./types\";\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;;;;;;;;AAIAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type {\n AiChatComponents,\n AiChatComponentsEmptyProps,\n AiChatComponentsLoadingProps,\n AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type { CommentProps } from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n InboxNotificationAvatarProps,\n InboxNotificationCustomKindProps,\n InboxNotificationCustomProps,\n InboxNotificationIconProps,\n InboxNotificationInspectorProps,\n InboxNotificationProps,\n InboxNotificationTextMentionKindProps,\n InboxNotificationTextMentionProps,\n InboxNotificationThreadKindProps,\n InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n CommentOverrides,\n ComposerOverrides,\n GlobalOverrides,\n InboxNotificationOverrides,\n LocalizationOverrides,\n Overrides,\n ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type { ComposerSubmitComment } from \"./primitives\";\nexport type {\n CommentAttachmentArgs,\n ComposerBodyMark,\n ComposerBodyMarks,\n} from \"./types\";\n"],"names":["detectDupes","PKG_NAME","PKG_VERSION","PKG_FORMAT"],"mappings":";;;;;;;;;;;;;;;;;AAIAA,gBAAY,CAAAC,gBAAA,EAAUC,qBAAaC,kBAAU,CAAA;;;;;;;;;;;;;;;"}
package/dist/index.d.cts CHANGED
@@ -209,6 +209,12 @@ interface AiToolProps extends Omit<ComponentProps<"div">, "title" | "children">
209
209
  * The event handler called when the content is collapsed or expanded by clicking on it.
210
210
  */
211
211
  onCollapsedChange?: (collapsed: boolean) => void;
212
+ /**
213
+ * Whether the content can be collapsed/expanded.
214
+ * If set to `false`, clicking on it will have no effect.
215
+ * If there's no content, this prop has no effect.
216
+ */
217
+ collapsible?: boolean;
212
218
  }
213
219
  type AiToolIconProps = ComponentProps<"div">;
214
220
  type AiToolInspectorProps = ComponentProps<"div">;
@@ -762,6 +768,12 @@ interface InboxNotificationTextMentionProps extends Omit<InboxNotificationProps,
762
768
  */
763
769
  showRoomName?: boolean;
764
770
  }
771
+ interface InboxNotificationInspectorProps extends Omit<InboxNotificationProps, "kinds" | "children">, InboxNotificationSharedProps {
772
+ /**
773
+ * The inbox notification to display.
774
+ */
775
+ inboxNotification: InboxNotificationData;
776
+ }
765
777
  interface InboxNotificationCustomProps extends Omit<InboxNotificationProps, "kinds">, InboxNotificationSharedProps, SlotProp {
766
778
  /**
767
779
  * The inbox notification to display.
@@ -813,9 +825,30 @@ declare function InboxNotificationAvatar({ className, ...props }: InboxNotificat
813
825
  * </>
814
826
  */
815
827
  declare const InboxNotification: react.ForwardRefExoticComponent<InboxNotificationProps & react.RefAttributes<HTMLAnchorElement>> & {
828
+ /**
829
+ * Displays a thread inbox notification kind.
830
+ */
816
831
  Thread: react.ForwardRefExoticComponent<InboxNotificationThreadProps & react.RefAttributes<HTMLAnchorElement>>;
832
+ /**
833
+ * Displays a text mention inbox notification kind.
834
+ */
817
835
  TextMention: react.ForwardRefExoticComponent<InboxNotificationTextMentionProps & react.RefAttributes<HTMLAnchorElement>>;
836
+ /**
837
+ * Displays a custom inbox notification kind.
838
+ */
818
839
  Custom: react.ForwardRefExoticComponent<InboxNotificationCustomProps & react.RefAttributes<HTMLAnchorElement>>;
840
+ /**
841
+ * Display the inbox notification's data, which can be useful during development.
842
+ *
843
+ * @example
844
+ * <InboxNotification
845
+ * inboxNotification={inboxNotification}
846
+ * kinds={{
847
+ * $custom: InboxNotification.Inspector,
848
+ * }}
849
+ * />
850
+ */
851
+ Inspector: react.ForwardRefExoticComponent<InboxNotificationInspectorProps & react.RefAttributes<HTMLAnchorElement>>;
819
852
  Icon: typeof InboxNotificationIcon;
820
853
  Avatar: typeof InboxNotificationAvatar;
821
854
  };
@@ -1123,4 +1156,4 @@ declare namespace icon {
1123
1156
  };
1124
1157
  }
1125
1158
 
1126
- export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiTool, AiToolIconProps, AiToolProps, Comment, CommentAttachmentArgs, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };
1159
+ export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiTool, AiToolIconProps, AiToolProps, Comment, CommentAttachmentArgs, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationInspectorProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };
package/dist/index.d.ts CHANGED
@@ -209,6 +209,12 @@ interface AiToolProps extends Omit<ComponentProps<"div">, "title" | "children">
209
209
  * The event handler called when the content is collapsed or expanded by clicking on it.
210
210
  */
211
211
  onCollapsedChange?: (collapsed: boolean) => void;
212
+ /**
213
+ * Whether the content can be collapsed/expanded.
214
+ * If set to `false`, clicking on it will have no effect.
215
+ * If there's no content, this prop has no effect.
216
+ */
217
+ collapsible?: boolean;
212
218
  }
213
219
  type AiToolIconProps = ComponentProps<"div">;
214
220
  type AiToolInspectorProps = ComponentProps<"div">;
@@ -762,6 +768,12 @@ interface InboxNotificationTextMentionProps extends Omit<InboxNotificationProps,
762
768
  */
763
769
  showRoomName?: boolean;
764
770
  }
771
+ interface InboxNotificationInspectorProps extends Omit<InboxNotificationProps, "kinds" | "children">, InboxNotificationSharedProps {
772
+ /**
773
+ * The inbox notification to display.
774
+ */
775
+ inboxNotification: InboxNotificationData;
776
+ }
765
777
  interface InboxNotificationCustomProps extends Omit<InboxNotificationProps, "kinds">, InboxNotificationSharedProps, SlotProp {
766
778
  /**
767
779
  * The inbox notification to display.
@@ -813,9 +825,30 @@ declare function InboxNotificationAvatar({ className, ...props }: InboxNotificat
813
825
  * </>
814
826
  */
815
827
  declare const InboxNotification: react.ForwardRefExoticComponent<InboxNotificationProps & react.RefAttributes<HTMLAnchorElement>> & {
828
+ /**
829
+ * Displays a thread inbox notification kind.
830
+ */
816
831
  Thread: react.ForwardRefExoticComponent<InboxNotificationThreadProps & react.RefAttributes<HTMLAnchorElement>>;
832
+ /**
833
+ * Displays a text mention inbox notification kind.
834
+ */
817
835
  TextMention: react.ForwardRefExoticComponent<InboxNotificationTextMentionProps & react.RefAttributes<HTMLAnchorElement>>;
836
+ /**
837
+ * Displays a custom inbox notification kind.
838
+ */
818
839
  Custom: react.ForwardRefExoticComponent<InboxNotificationCustomProps & react.RefAttributes<HTMLAnchorElement>>;
840
+ /**
841
+ * Display the inbox notification's data, which can be useful during development.
842
+ *
843
+ * @example
844
+ * <InboxNotification
845
+ * inboxNotification={inboxNotification}
846
+ * kinds={{
847
+ * $custom: InboxNotification.Inspector,
848
+ * }}
849
+ * />
850
+ */
851
+ Inspector: react.ForwardRefExoticComponent<InboxNotificationInspectorProps & react.RefAttributes<HTMLAnchorElement>>;
819
852
  Icon: typeof InboxNotificationIcon;
820
853
  Avatar: typeof InboxNotificationAvatar;
821
854
  };
@@ -1123,4 +1156,4 @@ declare namespace icon {
1123
1156
  };
1124
1157
  }
1125
1158
 
1126
- export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiTool, AiToolIconProps, AiToolProps, Comment, CommentAttachmentArgs, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };
1159
+ export { AiChat, AiChatComponents, AiChatComponentsEmptyProps, AiChatComponentsLoadingProps, AiChatProps, AiTool, AiToolIconProps, AiToolProps, Comment, CommentAttachmentArgs, CommentOverrides, CommentProps, Composer, ComposerBodyMark, ComposerBodyMarks, ComposerOverrides, ComposerProps, ComposerSubmitComment, GlobalOverrides, HistoryVersionSummary, HistoryVersionSummaryList, HistoryVersionSummaryListProps, HistoryVersionSummaryProps, icon as Icon, InboxNotification, InboxNotificationAvatarProps, InboxNotificationCustomKindProps, InboxNotificationCustomProps, InboxNotificationIconProps, InboxNotificationInspectorProps, InboxNotificationList, InboxNotificationListProps, InboxNotificationOverrides, InboxNotificationProps, InboxNotificationTextMentionKindProps, InboxNotificationTextMentionProps, InboxNotificationThreadKindProps, InboxNotificationThreadProps, LiveblocksUiConfig, LocalizationOverrides, Overrides, Thread, ThreadOverrides, ThreadProps, useOverrides };
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type {\n AiChatComponents,\n AiChatComponentsEmptyProps,\n AiChatComponentsLoadingProps,\n AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type { CommentProps } from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n InboxNotificationAvatarProps,\n InboxNotificationCustomKindProps,\n InboxNotificationCustomProps,\n InboxNotificationIconProps,\n InboxNotificationProps,\n InboxNotificationTextMentionKindProps,\n InboxNotificationTextMentionProps,\n InboxNotificationThreadKindProps,\n InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n CommentOverrides,\n ComposerOverrides,\n GlobalOverrides,\n InboxNotificationOverrides,\n LocalizationOverrides,\n Overrides,\n ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type { ComposerSubmitComment } from \"./primitives\";\nexport type {\n CommentAttachmentArgs,\n ComposerBodyMark,\n ComposerBodyMarks,\n} from \"./types\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}
1
+ {"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import { detectDupes } from \"@liveblocks/core\";\n\nimport { PKG_FORMAT, PKG_NAME, PKG_VERSION } from \"./version\";\n\ndetectDupes(PKG_NAME, PKG_VERSION, PKG_FORMAT);\n\nexport type {\n AiChatComponents,\n AiChatComponentsEmptyProps,\n AiChatComponentsLoadingProps,\n AiChatProps,\n} from \"./components/AiChat\";\nexport { AiChat } from \"./components/AiChat\";\nexport type { AiToolIconProps, AiToolProps } from \"./components/AiTool\";\nexport { AiTool } from \"./components/AiTool\";\nexport type { CommentProps } from \"./components/Comment\";\nexport { Comment } from \"./components/Comment\";\nexport type { ComposerProps } from \"./components/Composer\";\nexport { Composer } from \"./components/Composer\";\nexport type { HistoryVersionSummaryProps } from \"./components/HistoryVersionSummary\";\nexport { HistoryVersionSummary } from \"./components/HistoryVersionSummary\";\nexport type { HistoryVersionSummaryListProps } from \"./components/HistoryVersionSummaryList\";\nexport { HistoryVersionSummaryList } from \"./components/HistoryVersionSummaryList\";\nexport type {\n InboxNotificationAvatarProps,\n InboxNotificationCustomKindProps,\n InboxNotificationCustomProps,\n InboxNotificationIconProps,\n InboxNotificationInspectorProps,\n InboxNotificationProps,\n InboxNotificationTextMentionKindProps,\n InboxNotificationTextMentionProps,\n InboxNotificationThreadKindProps,\n InboxNotificationThreadProps,\n} from \"./components/InboxNotification\";\nexport { InboxNotification } from \"./components/InboxNotification\";\nexport type { InboxNotificationListProps } from \"./components/InboxNotificationList\";\nexport { InboxNotificationList } from \"./components/InboxNotificationList\";\nexport type { ThreadProps } from \"./components/Thread\";\nexport { Thread } from \"./components/Thread\";\nexport { LiveblocksUiConfig } from \"./config\";\nexport * as Icon from \"./icon\";\nexport type {\n CommentOverrides,\n ComposerOverrides,\n GlobalOverrides,\n InboxNotificationOverrides,\n LocalizationOverrides,\n Overrides,\n ThreadOverrides,\n} from \"./overrides\";\nexport { useOverrides } from \"./overrides\";\nexport type { ComposerSubmitComment } from \"./primitives\";\nexport type {\n CommentAttachmentArgs,\n ComposerBodyMark,\n ComposerBodyMarks,\n} from \"./types\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,WAAY,CAAA,QAAA,EAAU,aAAa,UAAU,CAAA"}
@@ -1,8 +1,8 @@
1
1
  'use strict';
2
2
 
3
- function classNames(...args) {
3
+ function cn(...args) {
4
4
  return args.filter((arg) => typeof arg === "string" || typeof arg === "number").join(" ");
5
5
  }
6
6
 
7
- exports.classNames = classNames;
8
- //# sourceMappingURL=class-names.cjs.map
7
+ exports.cn = cn;
8
+ //# sourceMappingURL=cn.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cn.cjs","sources":["../../src/utils/cn.ts"],"sourcesContent":["/**\n * Construct class names strings.\n */\nexport function cn(...args: (string | number | boolean | undefined | null)[]) {\n return args\n .filter((arg) => typeof arg === \"string\" || typeof arg === \"number\")\n .join(\" \");\n}\n"],"names":[],"mappings":";;AAGO,SAAS,MAAM,IAAwD,EAAA;AAC5E,EAAA,OAAO,IACJ,CAAA,MAAA,CAAO,CAAC,GAAA,KAAQ,OAAO,GAAA,KAAQ,QAAY,IAAA,OAAO,GAAQ,KAAA,QAAQ,CAClE,CAAA,IAAA,CAAK,GAAG,CAAA,CAAA;AACb;;;;"}
@@ -1,6 +1,6 @@
1
- function classNames(...args) {
1
+ function cn(...args) {
2
2
  return args.filter((arg) => typeof arg === "string" || typeof arg === "number").join(" ");
3
3
  }
4
4
 
5
- export { classNames };
6
- //# sourceMappingURL=class-names.js.map
5
+ export { cn };
6
+ //# sourceMappingURL=cn.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"cn.js","sources":["../../src/utils/cn.ts"],"sourcesContent":["/**\n * Construct class names strings.\n */\nexport function cn(...args: (string | number | boolean | undefined | null)[]) {\n return args\n .filter((arg) => typeof arg === \"string\" || typeof arg === \"number\")\n .join(\" \");\n}\n"],"names":[],"mappings":"AAGO,SAAS,MAAM,IAAwD,EAAA;AAC5E,EAAA,OAAO,IACJ,CAAA,MAAA,CAAO,CAAC,GAAA,KAAQ,OAAO,GAAA,KAAQ,QAAY,IAAA,OAAO,GAAQ,KAAA,QAAQ,CAClE,CAAA,IAAA,CAAK,GAAG,CAAA,CAAA;AACb;;;;"}
package/dist/version.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  'use strict';
2
2
 
3
3
  const PKG_NAME = "@liveblocks/react-ui";
4
- const PKG_VERSION = typeof "3.0.0" === "string" && "3.0.0";
4
+ const PKG_VERSION = typeof "3.1.0" === "string" && "3.1.0";
5
5
  const PKG_FORMAT = typeof "cjs" === "string" && "cjs";
6
6
 
7
7
  exports.PKG_FORMAT = PKG_FORMAT;
package/dist/version.js CHANGED
@@ -1,5 +1,5 @@
1
1
  const PKG_NAME = "@liveblocks/react-ui";
2
- const PKG_VERSION = typeof "3.0.0" === "string" && "3.0.0";
2
+ const PKG_VERSION = typeof "3.1.0" === "string" && "3.1.0";
3
3
  const PKG_FORMAT = typeof "esm" === "string" && "esm";
4
4
 
5
5
  export { PKG_FORMAT, PKG_NAME, PKG_VERSION };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@liveblocks/react-ui",
3
- "version": "3.0.0",
3
+ "version": "3.1.0",
4
4
  "description": "A set of React pre-built components for the Liveblocks products. Liveblocks is the all-in-one toolkit to build collaborative products like Figma, Notion, and more.",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
@@ -76,9 +76,9 @@
76
76
  },
77
77
  "dependencies": {
78
78
  "@floating-ui/react-dom": "^2.1.2",
79
- "@liveblocks/client": "3.0.0",
80
- "@liveblocks/core": "3.0.0",
81
- "@liveblocks/react": "3.0.0",
79
+ "@liveblocks/client": "3.1.0",
80
+ "@liveblocks/core": "3.1.0",
81
+ "@liveblocks/react": "3.1.0",
82
82
  "@radix-ui/react-dropdown-menu": "^2.1.2",
83
83
  "@radix-ui/react-popover": "^1.1.2",
84
84
  "@radix-ui/react-slot": "^1.1.0",
@@ -2001,10 +2001,12 @@
2001
2001
  }
2002
2002
 
2003
2003
  .lb-inbox-notification-title {
2004
- @include capitalize;
2005
-
2006
2004
  min-block-size: $lb-button-size;
2007
2005
 
2006
+ :where(.lb-inbox-notification:not([data-inspector])) & {
2007
+ @include capitalize;
2008
+ }
2009
+
2008
2010
  :where(strong, .lb-list, .lb-name) {
2009
2011
  font-weight: 500;
2010
2012
  }
@@ -2385,7 +2387,7 @@
2385
2387
  margin: 0;
2386
2388
  padding: 0 var(--lb-spacing) calc(0.875 * var(--lb-spacing));
2387
2389
  font-size: 85%;
2388
- line-height: 1;
2390
+ line-height: var(--lb-line-height);
2389
2391
 
2390
2392
  /* overflow-inline: auto; doesn't work as expected */
2391
2393
  /* stylelint-disable-next-line plugin/use-logical-properties-and-values */
@@ -2798,7 +2800,7 @@
2798
2800
 
2799
2801
  .lb-ai-tool-header {
2800
2802
  display: flex;
2801
- gap: calc(0.25 * var(--lb-spacing));
2803
+ gap: calc(0.3125 * var(--lb-spacing));
2802
2804
  align-items: center;
2803
2805
  inline-size: 100%;
2804
2806
  block-size: calc($lb-button-size + var(--lb-spacing));
@@ -2832,18 +2834,19 @@
2832
2834
  .lb-ai-tool-header-title {
2833
2835
  @include truncate;
2834
2836
 
2837
+ margin-inline-end: calc(0.25 * var(--lb-spacing));
2835
2838
  color: var(--lb-foreground-secondary);
2836
2839
  font-size: 0.9375em;
2837
2840
 
2838
2841
  &:where(:first-child) {
2839
- margin-inline-start: calc(0.25 * var(--lb-spacing));
2842
+ margin-inline-start: calc(0.3125 * var(--lb-spacing));
2840
2843
  }
2841
2844
  }
2842
2845
 
2843
2846
  .lb-ai-tool-header-status {
2844
2847
  flex: none;
2845
2848
  margin-inline-start: auto;
2846
- margin-inline-end: calc(0.25 * var(--lb-spacing));
2849
+ margin-inline-end: calc(0.1875 * var(--lb-spacing));
2847
2850
  color: var(--lb-foreground-moderate);
2848
2851
  }
2849
2852