@liveblocks/react-ui 2.15.2 → 2.16.0-toolbars1

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 (110) hide show
  1. package/dist/_private/index.d.mts +56 -5
  2. package/dist/_private/index.d.ts +56 -5
  3. package/dist/_private/index.js +46 -0
  4. package/dist/_private/index.js.map +1 -1
  5. package/dist/_private/index.mjs +21 -0
  6. package/dist/_private/index.mjs.map +1 -1
  7. package/dist/components/Comment.js +13 -33
  8. package/dist/components/Comment.js.map +1 -1
  9. package/dist/components/Comment.mjs +15 -35
  10. package/dist/components/Comment.mjs.map +1 -1
  11. package/dist/components/Composer.js +25 -65
  12. package/dist/components/Composer.js.map +1 -1
  13. package/dist/components/Composer.mjs +26 -66
  14. package/dist/components/Composer.mjs.map +1 -1
  15. package/dist/components/InboxNotification.js +7 -17
  16. package/dist/components/InboxNotification.js.map +1 -1
  17. package/dist/components/InboxNotification.mjs +7 -17
  18. package/dist/components/InboxNotification.mjs.map +1 -1
  19. package/dist/components/Thread.js +1 -5
  20. package/dist/components/Thread.js.map +1 -1
  21. package/dist/components/Thread.mjs +1 -5
  22. package/dist/components/Thread.mjs.map +1 -1
  23. package/dist/components/internal/Button.js +23 -2
  24. package/dist/components/internal/Button.js.map +1 -1
  25. package/dist/components/internal/Button.mjs +24 -4
  26. package/dist/components/internal/Button.mjs.map +1 -1
  27. package/dist/components/internal/Dropdown.js +19 -8
  28. package/dist/components/internal/Dropdown.js.map +1 -1
  29. package/dist/components/internal/Dropdown.mjs +19 -8
  30. package/dist/components/internal/Dropdown.mjs.map +1 -1
  31. package/dist/components/internal/EmojiPicker.js +1 -3
  32. package/dist/components/internal/EmojiPicker.js.map +1 -1
  33. package/dist/components/internal/EmojiPicker.mjs +1 -3
  34. package/dist/components/internal/EmojiPicker.mjs.map +1 -1
  35. package/dist/components/internal/Tooltip.js +41 -15
  36. package/dist/components/internal/Tooltip.js.map +1 -1
  37. package/dist/components/internal/Tooltip.mjs +43 -16
  38. package/dist/components/internal/Tooltip.mjs.map +1 -1
  39. package/dist/icons/ChevronDown.js +16 -0
  40. package/dist/icons/ChevronDown.js.map +1 -0
  41. package/dist/icons/ChevronDown.mjs +14 -0
  42. package/dist/icons/ChevronDown.mjs.map +1 -0
  43. package/dist/icons/ChevronLeft.js +16 -0
  44. package/dist/icons/ChevronLeft.js.map +1 -0
  45. package/dist/icons/ChevronLeft.mjs +14 -0
  46. package/dist/icons/ChevronLeft.mjs.map +1 -0
  47. package/dist/icons/ChevronRight.js +16 -0
  48. package/dist/icons/ChevronRight.js.map +1 -0
  49. package/dist/icons/ChevronRight.mjs +14 -0
  50. package/dist/icons/ChevronRight.mjs.map +1 -0
  51. package/dist/icons/ChevronUp.js +16 -0
  52. package/dist/icons/ChevronUp.js.map +1 -0
  53. package/dist/icons/ChevronUp.mjs +14 -0
  54. package/dist/icons/ChevronUp.mjs.map +1 -0
  55. package/dist/icons/Comment.js +16 -0
  56. package/dist/icons/Comment.js.map +1 -0
  57. package/dist/icons/Comment.mjs +14 -0
  58. package/dist/icons/Comment.mjs.map +1 -0
  59. package/dist/icons/Lengthen.js +16 -0
  60. package/dist/icons/Lengthen.js.map +1 -0
  61. package/dist/icons/Lengthen.mjs +14 -0
  62. package/dist/icons/Lengthen.mjs.map +1 -0
  63. package/dist/icons/QuestionMark.js +26 -0
  64. package/dist/icons/QuestionMark.js.map +1 -0
  65. package/dist/icons/QuestionMark.mjs +24 -0
  66. package/dist/icons/QuestionMark.mjs.map +1 -0
  67. package/dist/icons/Redo.js +21 -0
  68. package/dist/icons/Redo.js.map +1 -0
  69. package/dist/icons/Redo.mjs +19 -0
  70. package/dist/icons/Redo.mjs.map +1 -0
  71. package/dist/icons/Shorten.js +16 -0
  72. package/dist/icons/Shorten.js.map +1 -0
  73. package/dist/icons/Shorten.mjs +14 -0
  74. package/dist/icons/Shorten.mjs.map +1 -0
  75. package/dist/icons/Sparkles.js +16 -0
  76. package/dist/icons/Sparkles.js.map +1 -0
  77. package/dist/icons/Sparkles.mjs +14 -0
  78. package/dist/icons/Sparkles.mjs.map +1 -0
  79. package/dist/icons/Translate.js +21 -0
  80. package/dist/icons/Translate.js.map +1 -0
  81. package/dist/icons/Translate.mjs +19 -0
  82. package/dist/icons/Translate.mjs.map +1 -0
  83. package/dist/icons/Underline.js +16 -0
  84. package/dist/icons/Underline.js.map +1 -0
  85. package/dist/icons/Underline.mjs +14 -0
  86. package/dist/icons/Underline.mjs.map +1 -0
  87. package/dist/icons/Undo.js +21 -0
  88. package/dist/icons/Undo.js.map +1 -0
  89. package/dist/icons/Undo.mjs +19 -0
  90. package/dist/icons/Undo.mjs.map +1 -0
  91. package/dist/icons/index.js +34 -0
  92. package/dist/icons/index.js.map +1 -1
  93. package/dist/icons/index.mjs +17 -0
  94. package/dist/icons/index.mjs.map +1 -1
  95. package/dist/index.d.mts +25 -25
  96. package/dist/index.d.ts +25 -25
  97. package/dist/primitives/Composer/index.js +0 -1
  98. package/dist/primitives/Composer/index.js.map +1 -1
  99. package/dist/primitives/Composer/index.mjs +0 -1
  100. package/dist/primitives/Composer/index.mjs.map +1 -1
  101. package/dist/primitives/index.d.mts +23 -23
  102. package/dist/primitives/index.d.ts +23 -23
  103. package/dist/version.js +1 -1
  104. package/dist/version.js.map +1 -1
  105. package/dist/version.mjs +1 -1
  106. package/dist/version.mjs.map +1 -1
  107. package/package.json +6 -6
  108. package/src/styles/index.css +142 -35
  109. package/styles.css +1 -1
  110. package/styles.css.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Button.mjs","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n variant?: \"default\" | \"outline\" | \"toggle\" | \"primary\";\n size?: \"default\" | \"large\";\n disableable?: boolean;\n}\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n variant = \"default\",\n size = \"default\",\n disableable = true,\n className,\n ...props\n },\n forwardedRef\n ) => {\n return (\n <button\n type=\"button\"\n className={classNames(\n \"lb-button\",\n !disableable && \"lb-button:non-disableable\",\n className\n )}\n data-variant={variant}\n data-size={size}\n {...props}\n ref={forwardedRef}\n />\n );\n }\n);\n"],"names":[],"mappings":";;;;;AAAA;AAaO;AAAe;AAElB;AACY;AACH;AACO;AACd;AACG;AAIL;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACH;AACP;AACC;AACP;AAGN;;"}
1
+ {"version":3,"file":"Button.mjs","sources":["../../../src/components/internal/Button.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface ButtonProps extends ComponentProps<\"button\"> {\n variant?: \"default\" | \"toolbar\" | \"outline\" | \"primary\" | \"secondary\";\n size?: \"default\" | \"large\";\n disableable?: boolean;\n icon?: ReactNode;\n}\n\nexport const CustomButton = forwardRef<\n HTMLButtonElement,\n Omit<ButtonProps, \"icon\">\n>(\n (\n {\n variant = \"default\",\n size = \"default\",\n disableable = true,\n className,\n children,\n ...props\n },\n forwardedRef\n ) => {\n return (\n <button\n type=\"button\"\n className={classNames(\n \"lb-button\",\n !disableable && \"lb-button:non-disableable\",\n className\n )}\n data-variant={variant}\n data-size={size}\n {...props}\n ref={forwardedRef}\n >\n {children}\n </button>\n );\n }\n);\n\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n ({ icon, children, ...props }, forwardedRef) => {\n return (\n <CustomButton {...props} ref={forwardedRef}>\n {icon ? <span className=\"lb-icon-container\">{icon}</span> : null}\n {children ? <span className=\"lb-button-label\">{children}</span> : null}\n </CustomButton>\n );\n }\n);\n"],"names":[],"mappings":";;;;;AAAA;AAcO;AAAqB;AAKxB;AACY;AACH;AACO;AACd;AACA;AACG;AAIL;AACG;AACM;AACM;AACT;AACgB;AAChB;AACF;AACc;AACH;AACP;AACC;AAEJ;AACH;AAGN;AAEO;AAAe;AAElB;AACG;AAAiB;AAAY;AAC3B;AAAQ;AAAe;AAAqB;AAAe;AAC/C;AAAe;AAAmB;AAAmB;AAAA;AACpE;AAGN;;"}
@@ -63,14 +63,25 @@ function Dropdown({
63
63
  ]
64
64
  });
65
65
  }
66
- const DropdownItem = react.forwardRef(({ children, className, ...props }, forwardedRef) => {
67
- return /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.DropdownMenuItem, {
68
- className: classNames.classNames("lb-dropdown-item", className),
69
- ...props,
70
- ref: forwardedRef,
71
- children
72
- });
73
- });
66
+ const DropdownItem = react.forwardRef(
67
+ ({ children, className, icon, ...props }, forwardedRef) => {
68
+ return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuPrimitive__namespace.DropdownMenuItem, {
69
+ className: classNames.classNames("lb-dropdown-item", className),
70
+ ...props,
71
+ ref: forwardedRef,
72
+ children: [
73
+ icon ? /* @__PURE__ */ jsxRuntime.jsx("span", {
74
+ className: "lb-dropdown-item-icon lb-icon-container",
75
+ children: icon
76
+ }) : null,
77
+ children ? /* @__PURE__ */ jsxRuntime.jsx("span", {
78
+ className: "lb-dropdown-item-label",
79
+ children
80
+ }) : null
81
+ ]
82
+ });
83
+ }
84
+ );
74
85
 
75
86
  Object.defineProperty(exports, 'DropdownTrigger', {
76
87
  enumerable: true,
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.js","sources":["../../../src/components/internal/Dropdown.tsx"],"sourcesContent":["\"use client\";\n\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { useOverrides } from \"../../overrides\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface DropdownProps\n extends Pick<\n DropdownMenuPrimitive.DropdownMenuProps,\n \"defaultOpen\" | \"open\" | \"onOpenChange\"\n >,\n Pick<DropdownMenuPrimitive.DropdownMenuTriggerProps, \"children\">,\n Omit<DropdownMenuPrimitive.DropdownMenuContentProps, \"content\"> {\n content: ReactNode;\n}\n\nexport function Dropdown({\n children,\n content,\n defaultOpen,\n open,\n onOpenChange,\n className,\n ...props\n}: DropdownProps) {\n const $ = useOverrides();\n const { portalContainer } = useLiveblocksUIConfig();\n\n return (\n <DropdownMenuPrimitive.Root\n defaultOpen={defaultOpen}\n open={open}\n onOpenChange={onOpenChange}\n dir={$.dir}\n >\n {children}\n <DropdownMenuPrimitive.Portal container={portalContainer}>\n <DropdownMenuPrimitive.Content\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-dropdown\",\n className\n )}\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </DropdownMenuPrimitive.Content>\n </DropdownMenuPrimitive.Portal>\n </DropdownMenuPrimitive.Root>\n );\n}\n\nexport const DropdownItem = forwardRef<\n HTMLDivElement,\n DropdownMenuPrimitive.DropdownMenuItemProps\n>(({ children, className, ...props }, forwardedRef) => {\n return (\n <DropdownMenuPrimitive.DropdownMenuItem\n className={classNames(\"lb-dropdown-item\", className)}\n {...props}\n ref={forwardedRef}\n >\n {children}\n </DropdownMenuPrimitive.DropdownMenuItem>\n );\n});\n\nexport { DropdownMenuTrigger as DropdownTrigger } from \"@radix-ui/react-dropdown-menu\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAwBO;AAAkB;AACvB;AACA;AACA;AACA;AACA;AACA;AAEF;AACE;AACA;AAEA;AACG;AACC;AACA;AACA;AACO;AAEN;AAAA;AACA;AAAwC;AACtC;AACY;AACT;AACA;AACF;AACY;AACM;AACd;AAEH;AACH;AACF;AAAA;AAGN;AAEa;AAIX;AACG;AACoD;AAC/C;AACC;AAEJ;AAGP;;;;;;;"}
1
+ {"version":3,"file":"Dropdown.js","sources":["../../../src/components/internal/Dropdown.tsx"],"sourcesContent":["\"use client\";\n\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { useOverrides } from \"../../overrides\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface DropdownProps\n extends Pick<\n DropdownMenuPrimitive.DropdownMenuProps,\n \"defaultOpen\" | \"open\" | \"onOpenChange\"\n >,\n Pick<DropdownMenuPrimitive.DropdownMenuTriggerProps, \"children\">,\n Omit<DropdownMenuPrimitive.DropdownMenuContentProps, \"content\"> {\n content: ReactNode;\n}\n\ninterface DropdownItemProps\n extends DropdownMenuPrimitive.DropdownMenuItemProps {\n icon?: ReactNode;\n}\n\nexport function Dropdown({\n children,\n content,\n defaultOpen,\n open,\n onOpenChange,\n className,\n ...props\n}: DropdownProps) {\n const $ = useOverrides();\n const { portalContainer } = useLiveblocksUIConfig();\n\n return (\n <DropdownMenuPrimitive.Root\n defaultOpen={defaultOpen}\n open={open}\n onOpenChange={onOpenChange}\n dir={$.dir}\n >\n {children}\n <DropdownMenuPrimitive.Portal container={portalContainer}>\n <DropdownMenuPrimitive.Content\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-dropdown\",\n className\n )}\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </DropdownMenuPrimitive.Content>\n </DropdownMenuPrimitive.Portal>\n </DropdownMenuPrimitive.Root>\n );\n}\n\nexport const DropdownItem = forwardRef<HTMLDivElement, DropdownItemProps>(\n ({ children, className, icon, ...props }, forwardedRef) => {\n return (\n <DropdownMenuPrimitive.DropdownMenuItem\n className={classNames(\"lb-dropdown-item\", className)}\n {...props}\n ref={forwardedRef}\n >\n {icon ? (\n <span className=\"lb-dropdown-item-icon lb-icon-container\">\n {icon}\n </span>\n ) : null}\n {children ? (\n <span className=\"lb-dropdown-item-label\">{children}</span>\n ) : null}\n </DropdownMenuPrimitive.DropdownMenuItem>\n );\n }\n);\n\nexport { DropdownMenuTrigger as DropdownTrigger } from \"@radix-ui/react-dropdown-menu\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AA6BO;AAAkB;AACvB;AACA;AACA;AACA;AACA;AACA;AAEF;AACE;AACA;AAEA;AACG;AACC;AACA;AACA;AACO;AAEN;AAAA;AACA;AAAwC;AACtC;AACY;AACT;AACA;AACF;AACY;AACM;AACd;AAEH;AACH;AACF;AAAA;AAGN;AAEO;AAAqB;AAExB;AACG;AACoD;AAC/C;AACC;AAEJ;AACE;AAAe;AACb;AAED;AAED;AAAe;AAA0B;AACxC;AAAA;AACN;AAGN;;;;;;;"}
@@ -43,14 +43,25 @@ function Dropdown({
43
43
  ]
44
44
  });
45
45
  }
46
- const DropdownItem = forwardRef(({ children, className, ...props }, forwardedRef) => {
47
- return /* @__PURE__ */ jsx(DropdownMenuPrimitive.DropdownMenuItem, {
48
- className: classNames("lb-dropdown-item", className),
49
- ...props,
50
- ref: forwardedRef,
51
- children
52
- });
53
- });
46
+ const DropdownItem = forwardRef(
47
+ ({ children, className, icon, ...props }, forwardedRef) => {
48
+ return /* @__PURE__ */ jsxs(DropdownMenuPrimitive.DropdownMenuItem, {
49
+ className: classNames("lb-dropdown-item", className),
50
+ ...props,
51
+ ref: forwardedRef,
52
+ children: [
53
+ icon ? /* @__PURE__ */ jsx("span", {
54
+ className: "lb-dropdown-item-icon lb-icon-container",
55
+ children: icon
56
+ }) : null,
57
+ children ? /* @__PURE__ */ jsx("span", {
58
+ className: "lb-dropdown-item-label",
59
+ children
60
+ }) : null
61
+ ]
62
+ });
63
+ }
64
+ );
54
65
 
55
66
  export { Dropdown, DropdownItem };
56
67
  //# sourceMappingURL=Dropdown.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.mjs","sources":["../../../src/components/internal/Dropdown.tsx"],"sourcesContent":["\"use client\";\n\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { useOverrides } from \"../../overrides\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface DropdownProps\n extends Pick<\n DropdownMenuPrimitive.DropdownMenuProps,\n \"defaultOpen\" | \"open\" | \"onOpenChange\"\n >,\n Pick<DropdownMenuPrimitive.DropdownMenuTriggerProps, \"children\">,\n Omit<DropdownMenuPrimitive.DropdownMenuContentProps, \"content\"> {\n content: ReactNode;\n}\n\nexport function Dropdown({\n children,\n content,\n defaultOpen,\n open,\n onOpenChange,\n className,\n ...props\n}: DropdownProps) {\n const $ = useOverrides();\n const { portalContainer } = useLiveblocksUIConfig();\n\n return (\n <DropdownMenuPrimitive.Root\n defaultOpen={defaultOpen}\n open={open}\n onOpenChange={onOpenChange}\n dir={$.dir}\n >\n {children}\n <DropdownMenuPrimitive.Portal container={portalContainer}>\n <DropdownMenuPrimitive.Content\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-dropdown\",\n className\n )}\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </DropdownMenuPrimitive.Content>\n </DropdownMenuPrimitive.Portal>\n </DropdownMenuPrimitive.Root>\n );\n}\n\nexport const DropdownItem = forwardRef<\n HTMLDivElement,\n DropdownMenuPrimitive.DropdownMenuItemProps\n>(({ children, className, ...props }, forwardedRef) => {\n return (\n <DropdownMenuPrimitive.DropdownMenuItem\n className={classNames(\"lb-dropdown-item\", className)}\n {...props}\n ref={forwardedRef}\n >\n {children}\n </DropdownMenuPrimitive.DropdownMenuItem>\n );\n});\n\nexport { DropdownMenuTrigger as DropdownTrigger } from \"@radix-ui/react-dropdown-menu\";\n"],"names":[],"mappings":";;;;;;;;;;AAAA;AAwBO;AAAkB;AACvB;AACA;AACA;AACA;AACA;AACA;AAEF;AACE;AACA;AAEA;AACG;AACC;AACA;AACA;AACO;AAEN;AAAA;AACA;AAAwC;AACtC;AACY;AACT;AACA;AACF;AACY;AACM;AACd;AAEH;AACH;AACF;AAAA;AAGN;AAEa;AAIX;AACG;AACoD;AAC/C;AACC;AAEJ;AAGP;;"}
1
+ {"version":3,"file":"Dropdown.mjs","sources":["../../../src/components/internal/Dropdown.tsx"],"sourcesContent":["\"use client\";\n\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { useOverrides } from \"../../overrides\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface DropdownProps\n extends Pick<\n DropdownMenuPrimitive.DropdownMenuProps,\n \"defaultOpen\" | \"open\" | \"onOpenChange\"\n >,\n Pick<DropdownMenuPrimitive.DropdownMenuTriggerProps, \"children\">,\n Omit<DropdownMenuPrimitive.DropdownMenuContentProps, \"content\"> {\n content: ReactNode;\n}\n\ninterface DropdownItemProps\n extends DropdownMenuPrimitive.DropdownMenuItemProps {\n icon?: ReactNode;\n}\n\nexport function Dropdown({\n children,\n content,\n defaultOpen,\n open,\n onOpenChange,\n className,\n ...props\n}: DropdownProps) {\n const $ = useOverrides();\n const { portalContainer } = useLiveblocksUIConfig();\n\n return (\n <DropdownMenuPrimitive.Root\n defaultOpen={defaultOpen}\n open={open}\n onOpenChange={onOpenChange}\n dir={$.dir}\n >\n {children}\n <DropdownMenuPrimitive.Portal container={portalContainer}>\n <DropdownMenuPrimitive.Content\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-dropdown\",\n className\n )}\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n {...props}\n >\n {content}\n </DropdownMenuPrimitive.Content>\n </DropdownMenuPrimitive.Portal>\n </DropdownMenuPrimitive.Root>\n );\n}\n\nexport const DropdownItem = forwardRef<HTMLDivElement, DropdownItemProps>(\n ({ children, className, icon, ...props }, forwardedRef) => {\n return (\n <DropdownMenuPrimitive.DropdownMenuItem\n className={classNames(\"lb-dropdown-item\", className)}\n {...props}\n ref={forwardedRef}\n >\n {icon ? (\n <span className=\"lb-dropdown-item-icon lb-icon-container\">\n {icon}\n </span>\n ) : null}\n {children ? (\n <span className=\"lb-dropdown-item-label\">{children}</span>\n ) : null}\n </DropdownMenuPrimitive.DropdownMenuItem>\n );\n }\n);\n\nexport { DropdownMenuTrigger as DropdownTrigger } from \"@radix-ui/react-dropdown-menu\";\n"],"names":[],"mappings":";;;;;;;;;;AAAA;AA6BO;AAAkB;AACvB;AACA;AACA;AACA;AACA;AACA;AAEF;AACE;AACA;AAEA;AACG;AACC;AACA;AACA;AACO;AAEN;AAAA;AACA;AAAwC;AACtC;AACY;AACT;AACA;AACF;AACY;AACM;AACd;AAEH;AACH;AACF;AAAA;AAGN;AAEO;AAAqB;AAExB;AACG;AACoD;AAC/C;AACC;AAEJ;AACE;AAAe;AACb;AAED;AAED;AAAe;AAA0B;AACxC;AAAA;AACN;AAGN;;"}
@@ -175,9 +175,7 @@ const EmojiPicker = react.forwardRef(
175
175
  placeholder: $.EMOJI_PICKER_SEARCH_PLACEHOLDER,
176
176
  autoFocus: true
177
177
  }),
178
- /* @__PURE__ */ jsxRuntime.jsx(Search.SearchIcon, {
179
- className: "lb-emoji-picker-search-icon"
180
- })
178
+ /* @__PURE__ */ jsxRuntime.jsx(Search.SearchIcon, {})
181
179
  ]
182
180
  })
183
181
  }),
@@ -1 +1 @@
1
- {"version":3,"file":"EmojiPicker.js","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n EmojiPickerContentCategoryHeaderProps,\n EmojiPickerContentEmojiProps,\n EmojiPickerContentEmptyProps,\n EmojiPickerContentErrorProps,\n EmojiPickerContentGridProps,\n EmojiPickerContentLoadingProps,\n EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n className,\n ...props\n}: EmojiPickerContentLoadingProps) {\n return (\n <div\n className={classNames(\"lb-loading lb-emoji-picker-loading\", className)}\n {...props}\n >\n <SpinnerIcon />\n </div>\n );\n}\n\nfunction EmojiPickerEmpty({\n className,\n ...props\n}: EmojiPickerContentEmptyProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-empty lb-emoji-picker-empty\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_EMPTY}\n </div>\n );\n}\n\nfunction EmojiPickerError({\n error,\n className,\n ...props\n}: EmojiPickerContentErrorProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-error lb-emoji-picker-error\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_ERROR(error)}\n </div>\n );\n}\n\nfunction EmojiPickerCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n return (\n <div\n className={classNames(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n </div>\n );\n}\n\nfunction EmojiPickerGrid({\n children,\n className,\n ...props\n}: EmojiPickerContentGridProps) {\n return (\n <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerRow({\n attributes,\n children,\n className,\n ...props\n}: EmojiPickerContentRowProps) {\n const isFirstRow = useMemo(\n () => attributes.categoryRowIndex === 0,\n [attributes.categoryRowIndex]\n );\n const isLastRow = useMemo(\n () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n [attributes.categoryRowIndex, attributes.categoryRowsCount]\n );\n\n return (\n <div\n className={classNames(\"lb-emoji-picker-row\", className)}\n data-first={isFirstRow ? \"\" : undefined}\n data-last={isLastRow ? \"\" : undefined}\n {...props}\n >\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerContentEmojiProps) {\n return (\n <button\n className={classNames(\"lb-emoji-picker-emoji\", className)}\n {...props}\n >\n <Emoji emoji={emoji} />\n </button>\n );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n (\n { onEmojiSelect, onOpenChange, children, className, ...props },\n forwardedRef\n ) => {\n const [isOpen, setOpen] = useState(false);\n const { portalContainer } = useLiveblocksUIConfig();\n const $ = useOverrides();\n\n const handleOpenChange = useCallback(\n (isOpen: boolean) => {\n setOpen(isOpen);\n onOpenChange?.(isOpen);\n },\n [onOpenChange]\n );\n\n const handleEmojiSelect = useCallback(\n (emoji: string) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n return (\n <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n {children}\n <PopoverPrimitive.Portal container={portalContainer}>\n <PopoverPrimitive.Content\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale}\n >\n <div className=\"lb-emoji-picker-header\">\n <div className=\"lb-emoji-picker-search-container\">\n <EmojiPickerPrimitive.Search\n className=\"lb-emoji-picker-search\"\n placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n autoFocus\n />\n <SearchIcon className=\"lb-emoji-picker-search-icon\" />\n </div>\n </div>\n <EmojiPickerPrimitive.Content\n className=\"lb-emoji-picker-content\"\n components={{\n Loading: EmojiPickerLoading,\n Empty: EmojiPickerEmpty,\n Error: EmojiPickerError,\n CategoryHeader: EmojiPickerCategoryHeader,\n Grid: EmojiPickerGrid,\n Row: EmojiPickerRow,\n Emoji: EmojiPickerEmoji,\n }}\n />\n </EmojiPickerPrimitive.Root>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["jsx","classNames","SpinnerIcon","useOverrides","useMemo","Emoji","forwardRef","useState","useLiveblocksUIConfig","useCallback","isOpen","jsxs","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","SearchIcon","EmojiPickerPrimitive.Content"],"mappings":"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"}
1
+ {"version":3,"file":"EmojiPicker.js","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n EmojiPickerContentCategoryHeaderProps,\n EmojiPickerContentEmojiProps,\n EmojiPickerContentEmptyProps,\n EmojiPickerContentErrorProps,\n EmojiPickerContentGridProps,\n EmojiPickerContentLoadingProps,\n EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n className,\n ...props\n}: EmojiPickerContentLoadingProps) {\n return (\n <div\n className={classNames(\"lb-loading lb-emoji-picker-loading\", className)}\n {...props}\n >\n <SpinnerIcon />\n </div>\n );\n}\n\nfunction EmojiPickerEmpty({\n className,\n ...props\n}: EmojiPickerContentEmptyProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-empty lb-emoji-picker-empty\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_EMPTY}\n </div>\n );\n}\n\nfunction EmojiPickerError({\n error,\n className,\n ...props\n}: EmojiPickerContentErrorProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-error lb-emoji-picker-error\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_ERROR(error)}\n </div>\n );\n}\n\nfunction EmojiPickerCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n return (\n <div\n className={classNames(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n </div>\n );\n}\n\nfunction EmojiPickerGrid({\n children,\n className,\n ...props\n}: EmojiPickerContentGridProps) {\n return (\n <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerRow({\n attributes,\n children,\n className,\n ...props\n}: EmojiPickerContentRowProps) {\n const isFirstRow = useMemo(\n () => attributes.categoryRowIndex === 0,\n [attributes.categoryRowIndex]\n );\n const isLastRow = useMemo(\n () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n [attributes.categoryRowIndex, attributes.categoryRowsCount]\n );\n\n return (\n <div\n className={classNames(\"lb-emoji-picker-row\", className)}\n data-first={isFirstRow ? \"\" : undefined}\n data-last={isLastRow ? \"\" : undefined}\n {...props}\n >\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerContentEmojiProps) {\n return (\n <button\n className={classNames(\"lb-emoji-picker-emoji\", className)}\n {...props}\n >\n <Emoji emoji={emoji} />\n </button>\n );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n (\n { onEmojiSelect, onOpenChange, children, className, ...props },\n forwardedRef\n ) => {\n const [isOpen, setOpen] = useState(false);\n const { portalContainer } = useLiveblocksUIConfig();\n const $ = useOverrides();\n\n const handleOpenChange = useCallback(\n (isOpen: boolean) => {\n setOpen(isOpen);\n onOpenChange?.(isOpen);\n },\n [onOpenChange]\n );\n\n const handleEmojiSelect = useCallback(\n (emoji: string) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n return (\n <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n {children}\n <PopoverPrimitive.Portal container={portalContainer}>\n <PopoverPrimitive.Content\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale}\n >\n <div className=\"lb-emoji-picker-header\">\n <div className=\"lb-emoji-picker-search-container\">\n <EmojiPickerPrimitive.Search\n className=\"lb-emoji-picker-search\"\n placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n autoFocus\n />\n <SearchIcon />\n </div>\n </div>\n <EmojiPickerPrimitive.Content\n className=\"lb-emoji-picker-content\"\n components={{\n Loading: EmojiPickerLoading,\n Empty: EmojiPickerEmpty,\n Error: EmojiPickerError,\n CategoryHeader: EmojiPickerCategoryHeader,\n Grid: EmojiPickerGrid,\n Row: EmojiPickerRow,\n Emoji: EmojiPickerEmoji,\n }}\n />\n </EmojiPickerPrimitive.Root>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["jsx","classNames","SpinnerIcon","useOverrides","useMemo","Emoji","forwardRef","useState","useLiveblocksUIConfig","useCallback","isOpen","jsxs","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","SearchIcon","EmojiPickerPrimitive.Content"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,SAAS,kBAAmB,CAAA;AAAA,EAC1B,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAmC,EAAA;AACjC,EAAA,uBACGA,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,oCAAA,EAAsC,SAAS,CAAA;AAAA,IACpE,GAAG,KAAA;AAAA,IAEJ,yCAACC,mBAAY,EAAA,EAAA,CAAA;AAAA,GACf,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,gBAAiB,CAAA;AAAA,EACxB,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAiC,EAAA;AAC/B,EAAA,MAAM,IAAIC,sBAAa,EAAA,CAAA;AAEvB,EAAA,uBACGH,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,gCAAA,EAAkC,SAAS,CAAA;AAAA,IAChE,GAAG,KAAA;AAAA,IAEH,QAAE,EAAA,CAAA,CAAA,kBAAA;AAAA,GACL,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,gBAAiB,CAAA;AAAA,EACxB,KAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAiC,EAAA;AAC/B,EAAA,MAAM,IAAIE,sBAAa,EAAA,CAAA;AAEvB,EAAA,uBACGH,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,gCAAA,EAAkC,SAAS,CAAA;AAAA,IAChE,GAAG,KAAA;AAAA,IAEH,QAAA,EAAA,CAAA,CAAE,mBAAmB,KAAK,CAAA;AAAA,GAC7B,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,yBAA0B,CAAA;AAAA,EACjC,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAA0C,EAAA;AACxC,EAAA,uBACGD,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,iCAAA,EAAmC,SAAS,CAAA;AAAA,IACjE,GAAG,KAAA;AAAA,IAEJ,QAAC,kBAAAD,cAAA,CAAA,MAAA,EAAA;AAAA,MAAK,SAAU,EAAA,uCAAA;AAAA,MAAyC,QAAA,EAAA,QAAA;AAAA,KAAS,CAAA;AAAA,GACpE,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,eAAgB,CAAA;AAAA,EACvB,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAgC,EAAA;AAC9B,EAAA,uBACGA,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAWC,qBAAW,CAAA,sBAAA,EAAwB,SAAS,CAAA;AAAA,IAAI,GAAG,KAAA;AAAA,IAChE,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,cAAe,CAAA;AAAA,EACtB,UAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAA+B,EAAA;AAC7B,EAAA,MAAM,UAAa,GAAAG,aAAA;AAAA,IACjB,MAAM,WAAW,gBAAqB,KAAA,CAAA;AAAA,IACtC,CAAC,WAAW,gBAAgB,CAAA;AAAA,GAC9B,CAAA;AACA,EAAA,MAAM,SAAY,GAAAA,aAAA;AAAA,IAChB,MAAM,UAAA,CAAW,gBAAqB,KAAA,UAAA,CAAW,iBAAoB,GAAA,CAAA;AAAA,IACrE,CAAC,UAAA,CAAW,gBAAkB,EAAA,UAAA,CAAW,iBAAiB,CAAA;AAAA,GAC5D,CAAA;AAEA,EAAA,uBACGJ,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,qBAAA,EAAuB,SAAS,CAAA;AAAA,IACtD,YAAA,EAAY,aAAa,EAAK,GAAA,KAAA,CAAA;AAAA,IAC9B,WAAA,EAAW,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,IAC3B,GAAG,KAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,gBAAiB,CAAA;AAAA,EACxB,KAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAiC,EAAA;AAC/B,EAAA,uBACGD,cAAA,CAAA,QAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,uBAAA,EAAyB,SAAS,CAAA;AAAA,IACvD,GAAG,KAAA;AAAA,IAEJ,QAAC,kBAAAD,cAAA,CAAAK,WAAA,EAAA;AAAA,MAAM,KAAA;AAAA,KAAc,CAAA;AAAA,GACvB,CAAA,CAAA;AAEJ,CAAA;AAEO,MAAM,WAAc,GAAAC,gBAAA;AAAA,EACzB,CACE,EAAE,aAAe,EAAA,YAAA,EAAc,UAAU,SAAc,EAAA,GAAA,KAAA,IACvD,YACG,KAAA;AACH,IAAA,MAAM,CAAC,MAAA,EAAQ,OAAO,CAAA,GAAIC,eAAS,KAAK,CAAA,CAAA;AACxC,IAAM,MAAA,EAAE,eAAgB,EAAA,GAAIC,4BAAsB,EAAA,CAAA;AAClD,IAAA,MAAM,IAAIL,sBAAa,EAAA,CAAA;AAEvB,IAAA,MAAM,gBAAmB,GAAAM,iBAAA;AAAA,MACvB,CAACC,OAAoB,KAAA;AACnB,QAAA,OAAA,CAAQA,OAAM,CAAA,CAAA;AACd,QAAA,YAAA,GAAeA,OAAM,CAAA,CAAA;AAAA,OACvB;AAAA,MACA,CAAC,YAAY,CAAA;AAAA,KACf,CAAA;AAEA,IAAA,MAAM,iBAAoB,GAAAD,iBAAA;AAAA,MACxB,CAAC,KAAkB,KAAA;AACjB,QAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACb,QAAA,aAAA,GAAgB,KAAK,CAAA,CAAA;AAAA,OACvB;AAAA,MACA,CAAC,aAAa,CAAA;AAAA,KAChB,CAAA;AAEA,IACE,uBAAAE,eAAA,CAACC,4BAAiB,IAAjB,EAAA;AAAA,MAAsB,IAAM,EAAA,MAAA;AAAA,MAAQ,YAAc,EAAA,gBAAA;AAAA,MAChD,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBACDZ,cAAA,CAACY,4BAAiB,MAAjB,EAAA;AAAA,UAAwB,SAAW,EAAA,eAAA;AAAA,UAClC,QAAA,kBAAAZ,cAAA,CAACY,4BAAiB,OAAjB,EAAA;AAAA,YACC,IAAK,EAAA,KAAA;AAAA,YACL,KAAM,EAAA,QAAA;AAAA,YACN,UAAY,EAAAC,sCAAA;AAAA,YACZ,gBAAkB,EAAAC,4CAAA;AAAA,YAClB,SAAW,EAAAb,qBAAA;AAAA,cACT,gDAAA;AAAA,cACA,SAAA;AAAA,aACF;AAAA,YACC,GAAG,KAAA;AAAA,YACJ,GAAK,EAAA,YAAA;AAAA,YAEL,QAAA,kBAAAU,eAAA,CAACI,UAAA,EAAA;AAAA,cACC,aAAe,EAAA,iBAAA;AAAA,cACf,QAAQ,CAAE,CAAA,MAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAACf,cAAA,CAAA,KAAA,EAAA;AAAA,kBAAI,SAAU,EAAA,wBAAA;AAAA,kBACb,QAAC,kBAAAW,eAAA,CAAA,KAAA,EAAA;AAAA,oBAAI,SAAU,EAAA,kCAAA;AAAA,oBACb,QAAA,EAAA;AAAA,sCAAAX,cAAA,CAACgB,YAAA,EAAA;AAAA,wBACC,SAAU,EAAA,wBAAA;AAAA,wBACV,aAAa,CAAE,CAAA,+BAAA;AAAA,wBACf,SAAS,EAAA,IAAA;AAAA,uBACX,CAAA;AAAA,qDACCC,iBAAW,EAAA,EAAA,CAAA;AAAA,qBAAA;AAAA,mBACd,CAAA;AAAA,iBACF,CAAA;AAAA,gCACAjB,cAAA,CAACkB,aAAA,EAAA;AAAA,kBACC,SAAU,EAAA,yBAAA;AAAA,kBACV,UAAY,EAAA;AAAA,oBACV,OAAS,EAAA,kBAAA;AAAA,oBACT,KAAO,EAAA,gBAAA;AAAA,oBACP,KAAO,EAAA,gBAAA;AAAA,oBACP,cAAgB,EAAA,yBAAA;AAAA,oBAChB,IAAM,EAAA,eAAA;AAAA,oBACN,GAAK,EAAA,cAAA;AAAA,oBACL,KAAO,EAAA,gBAAA;AAAA,mBACT;AAAA,iBACF,CAAA;AAAA,eAAA;AAAA,aACF,CAAA;AAAA,WACF,CAAA;AAAA,SACF,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;;;;"}
@@ -155,9 +155,7 @@ const EmojiPicker = forwardRef(
155
155
  placeholder: $.EMOJI_PICKER_SEARCH_PLACEHOLDER,
156
156
  autoFocus: true
157
157
  }),
158
- /* @__PURE__ */ jsx(SearchIcon, {
159
- className: "lb-emoji-picker-search-icon"
160
- })
158
+ /* @__PURE__ */ jsx(SearchIcon, {})
161
159
  ]
162
160
  })
163
161
  }),
@@ -1 +1 @@
1
- {"version":3,"file":"EmojiPicker.mjs","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n EmojiPickerContentCategoryHeaderProps,\n EmojiPickerContentEmojiProps,\n EmojiPickerContentEmptyProps,\n EmojiPickerContentErrorProps,\n EmojiPickerContentGridProps,\n EmojiPickerContentLoadingProps,\n EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n className,\n ...props\n}: EmojiPickerContentLoadingProps) {\n return (\n <div\n className={classNames(\"lb-loading lb-emoji-picker-loading\", className)}\n {...props}\n >\n <SpinnerIcon />\n </div>\n );\n}\n\nfunction EmojiPickerEmpty({\n className,\n ...props\n}: EmojiPickerContentEmptyProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-empty lb-emoji-picker-empty\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_EMPTY}\n </div>\n );\n}\n\nfunction EmojiPickerError({\n error,\n className,\n ...props\n}: EmojiPickerContentErrorProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-error lb-emoji-picker-error\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_ERROR(error)}\n </div>\n );\n}\n\nfunction EmojiPickerCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n return (\n <div\n className={classNames(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n </div>\n );\n}\n\nfunction EmojiPickerGrid({\n children,\n className,\n ...props\n}: EmojiPickerContentGridProps) {\n return (\n <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerRow({\n attributes,\n children,\n className,\n ...props\n}: EmojiPickerContentRowProps) {\n const isFirstRow = useMemo(\n () => attributes.categoryRowIndex === 0,\n [attributes.categoryRowIndex]\n );\n const isLastRow = useMemo(\n () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n [attributes.categoryRowIndex, attributes.categoryRowsCount]\n );\n\n return (\n <div\n className={classNames(\"lb-emoji-picker-row\", className)}\n data-first={isFirstRow ? \"\" : undefined}\n data-last={isLastRow ? \"\" : undefined}\n {...props}\n >\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerContentEmojiProps) {\n return (\n <button\n className={classNames(\"lb-emoji-picker-emoji\", className)}\n {...props}\n >\n <Emoji emoji={emoji} />\n </button>\n );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n (\n { onEmojiSelect, onOpenChange, children, className, ...props },\n forwardedRef\n ) => {\n const [isOpen, setOpen] = useState(false);\n const { portalContainer } = useLiveblocksUIConfig();\n const $ = useOverrides();\n\n const handleOpenChange = useCallback(\n (isOpen: boolean) => {\n setOpen(isOpen);\n onOpenChange?.(isOpen);\n },\n [onOpenChange]\n );\n\n const handleEmojiSelect = useCallback(\n (emoji: string) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n return (\n <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n {children}\n <PopoverPrimitive.Portal container={portalContainer}>\n <PopoverPrimitive.Content\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale}\n >\n <div className=\"lb-emoji-picker-header\">\n <div className=\"lb-emoji-picker-search-container\">\n <EmojiPickerPrimitive.Search\n className=\"lb-emoji-picker-search\"\n placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n autoFocus\n />\n <SearchIcon className=\"lb-emoji-picker-search-icon\" />\n </div>\n </div>\n <EmojiPickerPrimitive.Content\n className=\"lb-emoji-picker-content\"\n components={{\n Loading: EmojiPickerLoading,\n Empty: EmojiPickerEmpty,\n Error: EmojiPickerError,\n CategoryHeader: EmojiPickerCategoryHeader,\n Grid: EmojiPickerGrid,\n Row: EmojiPickerRow,\n Emoji: EmojiPickerEmoji,\n }}\n />\n </EmojiPickerPrimitive.Root>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["isOpen","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","EmojiPickerPrimitive.Content"],"mappings":"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"}
1
+ {"version":3,"file":"EmojiPicker.mjs","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useCallback, useMemo, useState } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n FLOATING_ELEMENT_COLLISION_PADDING,\n FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { SearchIcon } from \"../../icons/Search\";\nimport { SpinnerIcon } from \"../../icons/Spinner\";\nimport { useOverrides } from \"../../overrides\";\nimport * as EmojiPickerPrimitive from \"../../primitives/EmojiPicker\";\nimport type {\n EmojiPickerContentCategoryHeaderProps,\n EmojiPickerContentEmojiProps,\n EmojiPickerContentEmptyProps,\n EmojiPickerContentErrorProps,\n EmojiPickerContentGridProps,\n EmojiPickerContentLoadingProps,\n EmojiPickerContentRowProps,\n} from \"../../primitives/EmojiPicker/types\";\nimport { classNames } from \"../../utils/class-names\";\nimport { Emoji } from \"./Emoji\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerLoading({\n className,\n ...props\n}: EmojiPickerContentLoadingProps) {\n return (\n <div\n className={classNames(\"lb-loading lb-emoji-picker-loading\", className)}\n {...props}\n >\n <SpinnerIcon />\n </div>\n );\n}\n\nfunction EmojiPickerEmpty({\n className,\n ...props\n}: EmojiPickerContentEmptyProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-empty lb-emoji-picker-empty\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_EMPTY}\n </div>\n );\n}\n\nfunction EmojiPickerError({\n error,\n className,\n ...props\n}: EmojiPickerContentErrorProps) {\n const $ = useOverrides();\n\n return (\n <div\n className={classNames(\"lb-error lb-emoji-picker-error\", className)}\n {...props}\n >\n {$.EMOJI_PICKER_ERROR(error)}\n </div>\n );\n}\n\nfunction EmojiPickerCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerContentCategoryHeaderProps) {\n return (\n <div\n className={classNames(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">{category}</span>\n </div>\n );\n}\n\nfunction EmojiPickerGrid({\n children,\n className,\n ...props\n}: EmojiPickerContentGridProps) {\n return (\n <div className={classNames(\"lb-emoji-picker-grid\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerRow({\n attributes,\n children,\n className,\n ...props\n}: EmojiPickerContentRowProps) {\n const isFirstRow = useMemo(\n () => attributes.categoryRowIndex === 0,\n [attributes.categoryRowIndex]\n );\n const isLastRow = useMemo(\n () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,\n [attributes.categoryRowIndex, attributes.categoryRowsCount]\n );\n\n return (\n <div\n className={classNames(\"lb-emoji-picker-row\", className)}\n data-first={isFirstRow ? \"\" : undefined}\n data-last={isLastRow ? \"\" : undefined}\n {...props}\n >\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerContentEmojiProps) {\n return (\n <button\n className={classNames(\"lb-emoji-picker-emoji\", className)}\n {...props}\n >\n <Emoji emoji={emoji} />\n </button>\n );\n}\n\nexport const EmojiPicker = forwardRef<HTMLDivElement, EmojiPickerProps>(\n (\n { onEmojiSelect, onOpenChange, children, className, ...props },\n forwardedRef\n ) => {\n const [isOpen, setOpen] = useState(false);\n const { portalContainer } = useLiveblocksUIConfig();\n const $ = useOverrides();\n\n const handleOpenChange = useCallback(\n (isOpen: boolean) => {\n setOpen(isOpen);\n onOpenChange?.(isOpen);\n },\n [onOpenChange]\n );\n\n const handleEmojiSelect = useCallback(\n (emoji: string) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n return (\n <PopoverPrimitive.Root open={isOpen} onOpenChange={handleOpenChange}>\n {children}\n <PopoverPrimitive.Portal container={portalContainer}>\n <PopoverPrimitive.Content\n side=\"top\"\n align=\"center\"\n sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n className={classNames(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale}\n >\n <div className=\"lb-emoji-picker-header\">\n <div className=\"lb-emoji-picker-search-container\">\n <EmojiPickerPrimitive.Search\n className=\"lb-emoji-picker-search\"\n placeholder={$.EMOJI_PICKER_SEARCH_PLACEHOLDER}\n autoFocus\n />\n <SearchIcon />\n </div>\n </div>\n <EmojiPickerPrimitive.Content\n className=\"lb-emoji-picker-content\"\n components={{\n Loading: EmojiPickerLoading,\n Empty: EmojiPickerEmpty,\n Error: EmojiPickerError,\n CategoryHeader: EmojiPickerCategoryHeader,\n Grid: EmojiPickerGrid,\n Row: EmojiPickerRow,\n Emoji: EmojiPickerEmoji,\n }}\n />\n </EmojiPickerPrimitive.Root>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n }\n);\n\nexport { PopoverTrigger as EmojiPickerTrigger } from \"@radix-ui/react-popover\";\n"],"names":["isOpen","EmojiPickerPrimitive.Root","EmojiPickerPrimitive.Search","EmojiPickerPrimitive.Content"],"mappings":";;;;;;;;;;;;;AA8BA,SAAS,kBAAmB,CAAA;AAAA,EAC1B,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAmC,EAAA;AACjC,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,oCAAA,EAAsC,SAAS,CAAA;AAAA,IACpE,GAAG,KAAA;AAAA,IAEJ,8BAAC,WAAY,EAAA,EAAA,CAAA;AAAA,GACf,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,gBAAiB,CAAA;AAAA,EACxB,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAiC,EAAA;AAC/B,EAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AAEvB,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,gCAAA,EAAkC,SAAS,CAAA;AAAA,IAChE,GAAG,KAAA;AAAA,IAEH,QAAE,EAAA,CAAA,CAAA,kBAAA;AAAA,GACL,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,gBAAiB,CAAA;AAAA,EACxB,KAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAiC,EAAA;AAC/B,EAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AAEvB,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,gCAAA,EAAkC,SAAS,CAAA;AAAA,IAChE,GAAG,KAAA;AAAA,IAEH,QAAA,EAAA,CAAA,CAAE,mBAAmB,KAAK,CAAA;AAAA,GAC7B,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,yBAA0B,CAAA;AAAA,EACjC,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAA0C,EAAA;AACxC,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,iCAAA,EAAmC,SAAS,CAAA;AAAA,IACjE,GAAG,KAAA;AAAA,IAEJ,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,MAAK,SAAU,EAAA,uCAAA;AAAA,MAAyC,QAAA,EAAA,QAAA;AAAA,KAAS,CAAA;AAAA,GACpE,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,eAAgB,CAAA;AAAA,EACvB,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAgC,EAAA;AAC9B,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAW,UAAW,CAAA,sBAAA,EAAwB,SAAS,CAAA;AAAA,IAAI,GAAG,KAAA;AAAA,IAChE,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,cAAe,CAAA;AAAA,EACtB,UAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAA+B,EAAA;AAC7B,EAAA,MAAM,UAAa,GAAA,OAAA;AAAA,IACjB,MAAM,WAAW,gBAAqB,KAAA,CAAA;AAAA,IACtC,CAAC,WAAW,gBAAgB,CAAA;AAAA,GAC9B,CAAA;AACA,EAAA,MAAM,SAAY,GAAA,OAAA;AAAA,IAChB,MAAM,UAAA,CAAW,gBAAqB,KAAA,UAAA,CAAW,iBAAoB,GAAA,CAAA;AAAA,IACrE,CAAC,UAAA,CAAW,gBAAkB,EAAA,UAAA,CAAW,iBAAiB,CAAA;AAAA,GAC5D,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,qBAAA,EAAuB,SAAS,CAAA;AAAA,IACtD,YAAA,EAAY,aAAa,EAAK,GAAA,KAAA,CAAA;AAAA,IAC9B,WAAA,EAAW,YAAY,EAAK,GAAA,KAAA,CAAA;AAAA,IAC3B,GAAG,KAAA;AAAA,IAEH,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,gBAAiB,CAAA;AAAA,EACxB,KAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAiC,EAAA;AAC/B,EAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,IACC,SAAA,EAAW,UAAW,CAAA,uBAAA,EAAyB,SAAS,CAAA;AAAA,IACvD,GAAG,KAAA;AAAA,IAEJ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MAAM,KAAA;AAAA,KAAc,CAAA;AAAA,GACvB,CAAA,CAAA;AAEJ,CAAA;AAEO,MAAM,WAAc,GAAA,UAAA;AAAA,EACzB,CACE,EAAE,aAAe,EAAA,YAAA,EAAc,UAAU,SAAc,EAAA,GAAA,KAAA,IACvD,YACG,KAAA;AACH,IAAA,MAAM,CAAC,MAAA,EAAQ,OAAO,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AACxC,IAAM,MAAA,EAAE,eAAgB,EAAA,GAAI,qBAAsB,EAAA,CAAA;AAClD,IAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AAEvB,IAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,MACvB,CAACA,OAAoB,KAAA;AACnB,QAAA,OAAA,CAAQA,OAAM,CAAA,CAAA;AACd,QAAA,YAAA,GAAeA,OAAM,CAAA,CAAA;AAAA,OACvB;AAAA,MACA,CAAC,YAAY,CAAA;AAAA,KACf,CAAA;AAEA,IAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,MACxB,CAAC,KAAkB,KAAA;AACjB,QAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACb,QAAA,aAAA,GAAgB,KAAK,CAAA,CAAA;AAAA,OACvB;AAAA,MACA,CAAC,aAAa,CAAA;AAAA,KAChB,CAAA;AAEA,IACE,uBAAA,IAAA,CAAC,iBAAiB,IAAjB,EAAA;AAAA,MAAsB,IAAM,EAAA,MAAA;AAAA,MAAQ,YAAc,EAAA,gBAAA;AAAA,MAChD,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,wBACD,GAAA,CAAC,iBAAiB,MAAjB,EAAA;AAAA,UAAwB,SAAW,EAAA,eAAA;AAAA,UAClC,QAAA,kBAAA,GAAA,CAAC,iBAAiB,OAAjB,EAAA;AAAA,YACC,IAAK,EAAA,KAAA;AAAA,YACL,KAAM,EAAA,QAAA;AAAA,YACN,UAAY,EAAA,4BAAA;AAAA,YACZ,gBAAkB,EAAA,kCAAA;AAAA,YAClB,SAAW,EAAA,UAAA;AAAA,cACT,gDAAA;AAAA,cACA,SAAA;AAAA,aACF;AAAA,YACC,GAAG,KAAA;AAAA,YACJ,GAAK,EAAA,YAAA;AAAA,YAEL,QAAA,kBAAA,IAAA,CAACC,eAAA,EAAA;AAAA,cACC,aAAe,EAAA,iBAAA;AAAA,cACf,QAAQ,CAAE,CAAA,MAAA;AAAA,cAEV,QAAA,EAAA;AAAA,gCAAC,GAAA,CAAA,KAAA,EAAA;AAAA,kBAAI,SAAU,EAAA,wBAAA;AAAA,kBACb,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA;AAAA,oBAAI,SAAU,EAAA,kCAAA;AAAA,oBACb,QAAA,EAAA;AAAA,sCAAA,GAAA,CAACC,iBAAA,EAAA;AAAA,wBACC,SAAU,EAAA,wBAAA;AAAA,wBACV,aAAa,CAAE,CAAA,+BAAA;AAAA,wBACf,SAAS,EAAA,IAAA;AAAA,uBACX,CAAA;AAAA,0CACC,UAAW,EAAA,EAAA,CAAA;AAAA,qBAAA;AAAA,mBACd,CAAA;AAAA,iBACF,CAAA;AAAA,gCACA,GAAA,CAACC,kBAAA,EAAA;AAAA,kBACC,SAAU,EAAA,yBAAA;AAAA,kBACV,UAAY,EAAA;AAAA,oBACV,OAAS,EAAA,kBAAA;AAAA,oBACT,KAAO,EAAA,gBAAA;AAAA,oBACP,KAAO,EAAA,gBAAA;AAAA,oBACP,cAAgB,EAAA,yBAAA;AAAA,oBAChB,IAAM,EAAA,eAAA;AAAA,oBACN,GAAK,EAAA,cAAA;AAAA,oBACL,KAAO,EAAA,gBAAA;AAAA,mBACT;AAAA,iBACF,CAAA;AAAA,eAAA;AAAA,aACF,CAAA;AAAA,WACF,CAAA;AAAA,SACF,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;"}
@@ -29,16 +29,43 @@ function _interopNamespaceDefault(e) {
29
29
  var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespaceDefault(TooltipPrimitive);
30
30
 
31
31
 
32
+ const ALT_KEY = { title: "Alt", key: "\u2325" };
33
+ const COMMAND_KEY = { title: "Command", key: "\u2318" };
34
+ const CONTROL_KEY = { title: "Ctrl", key: "\u2303" };
35
+ const SHIFT_KEY = { title: "Shift", key: "\u21E7" };
36
+ const ENTER_KEY = { title: "Enter", key: "\u23CE" };
37
+ const SPACE_KEY = { title: "Space", key: "\u2423" };
38
+ const ESCAPE_KEY = { title: "Escape", key: "\u238B" };
32
39
  const KEYS = {
33
- alt: () => ({ title: "Alt", key: "\u2325" }),
34
- mod: () => isApple.isApple() ? { title: "Command", key: "\u2318" } : { title: "Ctrl", key: "\u2303" },
35
- shift: () => {
36
- return { title: "Shift", key: "\u21E7" };
37
- },
38
- enter: () => {
39
- return { title: "Enter", key: "\u23CE" };
40
- }
40
+ alt: () => ALT_KEY,
41
+ mod: () => isApple.isApple() ? COMMAND_KEY : CONTROL_KEY,
42
+ control: () => CONTROL_KEY,
43
+ ctrl: () => CONTROL_KEY,
44
+ command: () => COMMAND_KEY,
45
+ cmd: () => COMMAND_KEY,
46
+ shift: () => SHIFT_KEY,
47
+ enter: () => ENTER_KEY,
48
+ " ": () => SPACE_KEY,
49
+ space: () => SPACE_KEY,
50
+ escape: () => ESCAPE_KEY,
51
+ esc: () => ESCAPE_KEY
41
52
  };
53
+ function getShortcutKbdFromKeymap(keymap) {
54
+ const keys = keymap.split("-");
55
+ return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, {
56
+ children: keys.map((key, index) => {
57
+ const lowerKey = key.toLowerCase();
58
+ if (lowerKey in KEYS) {
59
+ return /* @__PURE__ */ jsxRuntime.jsx(ShortcutTooltipKey, {
60
+ name: lowerKey
61
+ }, index);
62
+ }
63
+ return /* @__PURE__ */ jsxRuntime.jsx("span", {
64
+ children: key
65
+ }, index);
66
+ })
67
+ });
68
+ }
42
69
  const Tooltip = react.forwardRef(
43
70
  ({ children, content, multiline, className, ...props }, forwardedRef) => {
44
71
  const { portalContainer } = config.useLiveblocksUIConfig();
@@ -71,13 +98,16 @@ const Tooltip = react.forwardRef(
71
98
  }
72
99
  );
73
100
  const ShortcutTooltip = react.forwardRef(({ children, content, shortcut, ...props }, forwardedRef) => {
101
+ const shortcutKbd = react.useMemo(() => {
102
+ return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;
103
+ }, [shortcut]);
74
104
  return /* @__PURE__ */ jsxRuntime.jsx(Tooltip, {
75
105
  content: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
76
106
  children: [
77
107
  content,
78
- shortcut && /* @__PURE__ */ jsxRuntime.jsx("kbd", {
108
+ shortcutKbd && /* @__PURE__ */ jsxRuntime.jsx("kbd", {
79
109
  className: "lb-tooltip-shortcut",
80
- children: shortcut
110
+ children: shortcutKbd
81
111
  })
82
112
  ]
83
113
  }),
@@ -86,10 +116,7 @@ const ShortcutTooltip = react.forwardRef(({ children, content, shortcut, ...prop
86
116
  children
87
117
  });
88
118
  });
89
- function ShortcutTooltipKey({
90
- name,
91
- ...props
92
- }) {
119
+ function ShortcutTooltipKey({ name, ...props }) {
93
120
  const { title, key } = react.useMemo(() => KEYS[name]?.(), [name]);
94
121
  return /* @__PURE__ */ jsxRuntime.jsx("abbr", {
95
122
  title,
@@ -103,6 +130,5 @@ Object.defineProperty(exports, 'TooltipProvider', {
103
130
  get: function () { return TooltipPrimitive.TooltipProvider; }
104
131
  });
105
132
  exports.ShortcutTooltip = ShortcutTooltip;
106
- exports.ShortcutTooltipKey = ShortcutTooltipKey;
107
133
  exports.Tooltip = Tooltip;
108
134
  //# sourceMappingURL=Tooltip.js.map
@@ -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 KEYS = {\n alt: () => ({ title: \"Alt\", key: \"⌥\" }),\n mod: () =>\n isApple() ? { title: \"Command\", key: \"⌘\" } : { title: \"Ctrl\", key: \"⌃\" },\n shift: () => {\n return { title: \"Shift\", key: \"⇧\" };\n },\n enter: () => {\n return { title: \"Enter\", key: \"⏎\" };\n },\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?: ReactNode;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n name: keyof typeof KEYS;\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 return (\n <Tooltip\n content={\n <>\n {content}\n {shortcut && <kbd className=\"lb-tooltip-shortcut\">{shortcut}</kbd>}\n </>\n }\n {...props}\n ref={forwardedRef}\n >\n {children}\n </Tooltip>\n );\n});\n\nexport function ShortcutTooltipKey({\n name,\n ...props\n}: 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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAcA;AAAa;AAC0B;AAEoC;AAEvE;AAAkC;AACpC;AAEE;AAAkC;AAEtC;AAiBO;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;AACG;AAEG;AACG;AAAA;AACa;AAAc;AAAuB;AAAS;AAAA;AAC9D;AAEE;AACC;AAEJ;AAGP;AAEO;AAA4B;AACjC;AAEF;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 { 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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;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,5 +1,5 @@
1
1
  "use client";
2
- import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
+ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
3
3
  import * as TooltipPrimitive from '@radix-ui/react-tooltip';
4
4
  export { TooltipProvider } from '@radix-ui/react-tooltip';
5
5
  import { forwardRef, useMemo } from 'react';
@@ -9,16 +9,43 @@ import { classNames } from '../../utils/class-names.mjs';
9
9
  import { isApple } from '../../utils/is-apple.mjs';
10
10
 
11
11
 
12
+ const ALT_KEY = { title: "Alt", key: "\u2325" };
13
+ const COMMAND_KEY = { title: "Command", key: "\u2318" };
14
+ const CONTROL_KEY = { title: "Ctrl", key: "\u2303" };
15
+ const SHIFT_KEY = { title: "Shift", key: "\u21E7" };
16
+ const ENTER_KEY = { title: "Enter", key: "\u23CE" };
17
+ const SPACE_KEY = { title: "Space", key: "\u2423" };
18
+ const ESCAPE_KEY = { title: "Escape", key: "\u238B" };
12
19
  const KEYS = {
13
- alt: () => ({ title: "Alt", key: "\u2325" }),
14
- mod: () => isApple() ? { title: "Command", key: "\u2318" } : { title: "Ctrl", key: "\u2303" },
15
- shift: () => {
16
- return { title: "Shift", key: "\u21E7" };
17
- },
18
- enter: () => {
19
- return { title: "Enter", key: "\u23CE" };
20
- }
20
+ alt: () => ALT_KEY,
21
+ mod: () => isApple() ? COMMAND_KEY : CONTROL_KEY,
22
+ control: () => CONTROL_KEY,
23
+ ctrl: () => CONTROL_KEY,
24
+ command: () => COMMAND_KEY,
25
+ cmd: () => COMMAND_KEY,
26
+ shift: () => SHIFT_KEY,
27
+ enter: () => ENTER_KEY,
28
+ " ": () => SPACE_KEY,
29
+ space: () => SPACE_KEY,
30
+ escape: () => ESCAPE_KEY,
31
+ esc: () => ESCAPE_KEY
21
32
  };
33
+ function getShortcutKbdFromKeymap(keymap) {
34
+ const keys = keymap.split("-");
35
+ return /* @__PURE__ */ jsx(Fragment, {
36
+ children: keys.map((key, index) => {
37
+ const lowerKey = key.toLowerCase();
38
+ if (lowerKey in KEYS) {
39
+ return /* @__PURE__ */ jsx(ShortcutTooltipKey, {
40
+ name: lowerKey
41
+ }, index);
42
+ }
43
+ return /* @__PURE__ */ jsx("span", {
44
+ children: key
45
+ }, index);
46
+ })
47
+ });
48
+ }
22
49
  const Tooltip = forwardRef(
23
50
  ({ children, content, multiline, className, ...props }, forwardedRef) => {
24
51
  const { portalContainer } = useLiveblocksUIConfig();
@@ -51,13 +78,16 @@ const Tooltip = forwardRef(
51
78
  }
52
79
  );
53
80
  const ShortcutTooltip = forwardRef(({ children, content, shortcut, ...props }, forwardedRef) => {
81
+ const shortcutKbd = useMemo(() => {
82
+ return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;
83
+ }, [shortcut]);
54
84
  return /* @__PURE__ */ jsx(Tooltip, {
55
85
  content: /* @__PURE__ */ jsxs(Fragment, {
56
86
  children: [
57
87
  content,
58
- shortcut && /* @__PURE__ */ jsx("kbd", {
88
+ shortcutKbd && /* @__PURE__ */ jsx("kbd", {
59
89
  className: "lb-tooltip-shortcut",
60
- children: shortcut
90
+ children: shortcutKbd
61
91
  })
62
92
  ]
63
93
  }),
@@ -66,10 +96,7 @@ const ShortcutTooltip = forwardRef(({ children, content, shortcut, ...props }, f
66
96
  children
67
97
  });
68
98
  });
69
- function ShortcutTooltipKey({
70
- name,
71
- ...props
72
- }) {
99
+ function ShortcutTooltipKey({ name, ...props }) {
73
100
  const { title, key } = useMemo(() => KEYS[name]?.(), [name]);
74
101
  return /* @__PURE__ */ jsx("abbr", {
75
102
  title,
@@ -78,5 +105,5 @@ function ShortcutTooltipKey({
78
105
  });
79
106
  }
80
107
 
81
- export { ShortcutTooltip, ShortcutTooltipKey, Tooltip };
108
+ export { ShortcutTooltip, Tooltip };
82
109
  //# sourceMappingURL=Tooltip.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.mjs","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 KEYS = {\n alt: () => ({ title: \"Alt\", key: \"⌥\" }),\n mod: () =>\n isApple() ? { title: \"Command\", key: \"⌘\" } : { title: \"Ctrl\", key: \"⌃\" },\n shift: () => {\n return { title: \"Shift\", key: \"⇧\" };\n },\n enter: () => {\n return { title: \"Enter\", key: \"⏎\" };\n },\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?: ReactNode;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n name: keyof typeof KEYS;\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 return (\n <Tooltip\n content={\n <>\n {content}\n {shortcut && <kbd className=\"lb-tooltip-shortcut\">{shortcut}</kbd>}\n </>\n }\n {...props}\n ref={forwardedRef}\n >\n {children}\n </Tooltip>\n );\n});\n\nexport function ShortcutTooltipKey({\n name,\n ...props\n}: 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":";;;;;;;;;;AAAA;AAcA;AAAa;AAC0B;AAEoC;AAEvE;AAAkC;AACpC;AAEE;AAAkC;AAEtC;AAiBO;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;AACG;AAEG;AACG;AAAA;AACa;AAAc;AAAuB;AAAS;AAAA;AAC9D;AAEE;AACC;AAEJ;AAGP;AAEO;AAA4B;AACjC;AAEF;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;"}
1
+ {"version":3,"file":"Tooltip.mjs","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":";;;;;;;;;;AAAA;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;;"}
@@ -0,0 +1,16 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var Icon = require('../components/internal/Icon.js');
5
+
6
+ function ChevronDownIcon(props) {
7
+ return /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, {
8
+ ...props,
9
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", {
10
+ d: "M14.5 8.5 10 13 5.5 8.5"
11
+ })
12
+ });
13
+ }
14
+
15
+ exports.ChevronDownIcon = ChevronDownIcon;
16
+ //# sourceMappingURL=ChevronDown.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronDown.js","sources":["../../src/icons/ChevronDown.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { Icon } from \"../components/internal/Icon\";\n\nexport function ChevronDownIcon(props: ComponentProps<\"svg\">) {\n return (\n <Icon {...props}>\n <path d=\"M14.5 8.5 10 13 5.5 8.5\" />\n </Icon>\n );\n}\n"],"names":["jsx","Icon"],"mappings":";;;;;AAIO,SAAS,gBAAgB,KAA8B,EAAA;AAC5D,EAAA,uBACGA,cAAA,CAAAC,SAAA,EAAA;AAAA,IAAM,GAAG,KAAA;AAAA,IACR,QAAC,kBAAAD,cAAA,CAAA,MAAA,EAAA;AAAA,MAAK,CAAE,EAAA,yBAAA;AAAA,KAA0B,CAAA;AAAA,GACpC,CAAA,CAAA;AAEJ;;;;"}
@@ -0,0 +1,14 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { Icon } from '../components/internal/Icon.mjs';
3
+
4
+ function ChevronDownIcon(props) {
5
+ return /* @__PURE__ */ jsx(Icon, {
6
+ ...props,
7
+ children: /* @__PURE__ */ jsx("path", {
8
+ d: "M14.5 8.5 10 13 5.5 8.5"
9
+ })
10
+ });
11
+ }
12
+
13
+ export { ChevronDownIcon };
14
+ //# sourceMappingURL=ChevronDown.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronDown.mjs","sources":["../../src/icons/ChevronDown.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { Icon } from \"../components/internal/Icon\";\n\nexport function ChevronDownIcon(props: ComponentProps<\"svg\">) {\n return (\n <Icon {...props}>\n <path d=\"M14.5 8.5 10 13 5.5 8.5\" />\n </Icon>\n );\n}\n"],"names":[],"mappings":";;;AAIO,SAAS,gBAAgB,KAA8B,EAAA;AAC5D,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAM,GAAG,KAAA;AAAA,IACR,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,MAAK,CAAE,EAAA,yBAAA;AAAA,KAA0B,CAAA;AAAA,GACpC,CAAA,CAAA;AAEJ;;;;"}
@@ -0,0 +1,16 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var Icon = require('../components/internal/Icon.js');
5
+
6
+ function ChevronLeftIcon(props) {
7
+ return /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, {
8
+ ...props,
9
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", {
10
+ d: "M11.5 5.5 7 10l4.5 4.5"
11
+ })
12
+ });
13
+ }
14
+
15
+ exports.ChevronLeftIcon = ChevronLeftIcon;
16
+ //# sourceMappingURL=ChevronLeft.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronLeft.js","sources":["../../src/icons/ChevronLeft.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { Icon } from \"../components/internal/Icon\";\n\nexport function ChevronLeftIcon(props: ComponentProps<\"svg\">) {\n return (\n <Icon {...props}>\n <path d=\"M11.5 5.5 7 10l4.5 4.5\" />\n </Icon>\n );\n}\n"],"names":["jsx","Icon"],"mappings":";;;;;AAIO,SAAS,gBAAgB,KAA8B,EAAA;AAC5D,EAAA,uBACGA,cAAA,CAAAC,SAAA,EAAA;AAAA,IAAM,GAAG,KAAA;AAAA,IACR,QAAC,kBAAAD,cAAA,CAAA,MAAA,EAAA;AAAA,MAAK,CAAE,EAAA,wBAAA;AAAA,KAAyB,CAAA;AAAA,GACnC,CAAA,CAAA;AAEJ;;;;"}
@@ -0,0 +1,14 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { Icon } from '../components/internal/Icon.mjs';
3
+
4
+ function ChevronLeftIcon(props) {
5
+ return /* @__PURE__ */ jsx(Icon, {
6
+ ...props,
7
+ children: /* @__PURE__ */ jsx("path", {
8
+ d: "M11.5 5.5 7 10l4.5 4.5"
9
+ })
10
+ });
11
+ }
12
+
13
+ export { ChevronLeftIcon };
14
+ //# sourceMappingURL=ChevronLeft.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronLeft.mjs","sources":["../../src/icons/ChevronLeft.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { Icon } from \"../components/internal/Icon\";\n\nexport function ChevronLeftIcon(props: ComponentProps<\"svg\">) {\n return (\n <Icon {...props}>\n <path d=\"M11.5 5.5 7 10l4.5 4.5\" />\n </Icon>\n );\n}\n"],"names":[],"mappings":";;;AAIO,SAAS,gBAAgB,KAA8B,EAAA;AAC5D,EAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,IAAM,GAAG,KAAA;AAAA,IACR,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA;AAAA,MAAK,CAAE,EAAA,wBAAA;AAAA,KAAyB,CAAA;AAAA,GACnC,CAAA,CAAA;AAEJ;;;;"}
@@ -0,0 +1,16 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var Icon = require('../components/internal/Icon.js');
5
+
6
+ function ChevronRightIcon(props) {
7
+ return /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, {
8
+ ...props,
9
+ children: /* @__PURE__ */ jsxRuntime.jsx("path", {
10
+ d: "M8.5 5.5 13 10l-4.5 4.5"
11
+ })
12
+ });
13
+ }
14
+
15
+ exports.ChevronRightIcon = ChevronRightIcon;
16
+ //# sourceMappingURL=ChevronRight.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ChevronRight.js","sources":["../../src/icons/ChevronRight.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\n\nimport { Icon } from \"../components/internal/Icon\";\n\nexport function ChevronRightIcon(props: ComponentProps<\"svg\">) {\n return (\n <Icon {...props}>\n <path d=\"M8.5 5.5 13 10l-4.5 4.5\" />\n </Icon>\n );\n}\n"],"names":["jsx","Icon"],"mappings":";;;;;AAIO,SAAS,iBAAiB,KAA8B,EAAA;AAC7D,EAAA,uBACGA,cAAA,CAAAC,SAAA,EAAA;AAAA,IAAM,GAAG,KAAA;AAAA,IACR,QAAC,kBAAAD,cAAA,CAAA,MAAA,EAAA;AAAA,MAAK,CAAE,EAAA,yBAAA;AAAA,KAA0B,CAAA;AAAA,GACpC,CAAA,CAAA;AAEJ;;;;"}
@@ -0,0 +1,14 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { Icon } from '../components/internal/Icon.mjs';
3
+
4
+ function ChevronRightIcon(props) {
5
+ return /* @__PURE__ */ jsx(Icon, {
6
+ ...props,
7
+ children: /* @__PURE__ */ jsx("path", {
8
+ d: "M8.5 5.5 13 10l-4.5 4.5"
9
+ })
10
+ });
11
+ }
12
+
13
+ export { ChevronRightIcon };
14
+ //# sourceMappingURL=ChevronRight.mjs.map