@liveblocks/react-ui 3.15.0-components1 → 3.15.0-thread2
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.
- package/dist/_private/index.cjs +7 -1
- package/dist/_private/index.cjs.map +1 -1
- package/dist/_private/index.d.cts +10 -4
- package/dist/_private/index.d.ts +10 -4
- package/dist/_private/index.js +3 -1
- package/dist/_private/index.js.map +1 -1
- package/dist/components/AiChat.cjs +10 -2
- package/dist/components/AiChat.cjs.map +1 -1
- package/dist/components/AiChat.js +10 -2
- package/dist/components/AiChat.js.map +1 -1
- package/dist/components/Comment.cjs +277 -232
- package/dist/components/Comment.cjs.map +1 -1
- package/dist/components/Comment.js +263 -237
- package/dist/components/Comment.js.map +1 -1
- package/dist/components/Composer.cjs +4 -2
- package/dist/components/Composer.cjs.map +1 -1
- package/dist/components/Composer.js +5 -3
- package/dist/components/Composer.js.map +1 -1
- package/dist/components/InboxNotification.cjs +6 -4
- package/dist/components/InboxNotification.cjs.map +1 -1
- package/dist/components/InboxNotification.js +7 -5
- package/dist/components/InboxNotification.js.map +1 -1
- package/dist/components/Thread.cjs +71 -45
- package/dist/components/Thread.cjs.map +1 -1
- package/dist/components/Thread.js +56 -49
- package/dist/components/Thread.js.map +1 -1
- package/dist/components/internal/AiComposer.cjs +2 -1
- package/dist/components/internal/AiComposer.cjs.map +1 -1
- package/dist/components/internal/AiComposer.js +2 -1
- package/dist/components/internal/AiComposer.js.map +1 -1
- package/dist/components/internal/CodeBlock.cjs +2 -1
- package/dist/components/internal/CodeBlock.cjs.map +1 -1
- package/dist/components/internal/CodeBlock.js +2 -1
- package/dist/components/internal/CodeBlock.js.map +1 -1
- package/dist/components/internal/Dropdown.cjs +28 -7
- package/dist/components/internal/Dropdown.cjs.map +1 -1
- package/dist/components/internal/Dropdown.js +7 -7
- package/dist/components/internal/Dropdown.js.map +1 -1
- package/dist/components/internal/EmojiPicker.cjs +27 -6
- package/dist/components/internal/EmojiPicker.cjs.map +1 -1
- package/dist/components/internal/EmojiPicker.js +6 -6
- package/dist/components/internal/EmojiPicker.js.map +1 -1
- package/dist/components/internal/List.cjs +2 -2
- package/dist/components/internal/List.cjs.map +1 -1
- package/dist/components/internal/List.js +2 -2
- package/dist/components/internal/List.js.map +1 -1
- package/dist/components/internal/Tooltip.cjs +28 -7
- package/dist/components/internal/Tooltip.cjs.map +1 -1
- package/dist/components/internal/Tooltip.js +7 -7
- package/dist/components/internal/Tooltip.js.map +1 -1
- package/dist/index.cjs +0 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +197 -213
- package/dist/index.d.ts +197 -213
- package/dist/index.js +0 -6
- package/dist/index.js.map +1 -1
- package/dist/primitives/AiComposer/index.cjs +4 -5
- package/dist/primitives/AiComposer/index.cjs.map +1 -1
- package/dist/primitives/AiComposer/index.js +4 -5
- package/dist/primitives/AiComposer/index.js.map +1 -1
- package/dist/primitives/AiMessage/index.cjs +2 -2
- package/dist/primitives/AiMessage/index.cjs.map +1 -1
- package/dist/primitives/AiMessage/index.js +2 -2
- package/dist/primitives/AiMessage/index.js.map +1 -1
- package/dist/primitives/Collapsible/index.cjs +4 -4
- package/dist/primitives/Collapsible/index.cjs.map +1 -1
- package/dist/primitives/Collapsible/index.js +4 -4
- package/dist/primitives/Collapsible/index.js.map +1 -1
- package/dist/primitives/Comment/index.cjs +4 -4
- package/dist/primitives/Comment/index.cjs.map +1 -1
- package/dist/primitives/Comment/index.js +4 -4
- package/dist/primitives/Comment/index.js.map +1 -1
- package/dist/primitives/Composer/index.cjs +35 -23
- package/dist/primitives/Composer/index.cjs.map +1 -1
- package/dist/primitives/Composer/index.js +16 -23
- package/dist/primitives/Composer/index.js.map +1 -1
- package/dist/primitives/Duration.cjs +2 -2
- package/dist/primitives/Duration.cjs.map +1 -1
- package/dist/primitives/Duration.js +2 -2
- package/dist/primitives/Duration.js.map +1 -1
- package/dist/primitives/FileSize.cjs +2 -2
- package/dist/primitives/FileSize.cjs.map +1 -1
- package/dist/primitives/FileSize.js +2 -2
- package/dist/primitives/FileSize.js.map +1 -1
- package/dist/primitives/Markdown.cjs +2 -2
- package/dist/primitives/Markdown.cjs.map +1 -1
- package/dist/primitives/Markdown.js +2 -2
- package/dist/primitives/Markdown.js.map +1 -1
- package/dist/primitives/Timestamp.cjs +2 -2
- package/dist/primitives/Timestamp.cjs.map +1 -1
- package/dist/primitives/Timestamp.js +2 -2
- package/dist/primitives/Timestamp.js.map +1 -1
- package/dist/utils/Portal.cjs +2 -2
- package/dist/utils/Portal.cjs.map +1 -1
- package/dist/utils/Portal.js +2 -2
- package/dist/utils/Portal.js.map +1 -1
- package/dist/utils/use-stable-component.cjs +32 -0
- package/dist/utils/use-stable-component.cjs.map +1 -0
- package/dist/utils/use-stable-component.js +30 -0
- package/dist/utils/use-stable-component.js.map +1 -0
- package/dist/version.cjs +1 -1
- package/dist/version.cjs.map +1 -1
- package/dist/version.js +1 -1
- package/dist/version.js.map +1 -1
- package/package.json +10 -6
- package/src/styles/dark/index.css +1 -1
- package/src/styles/index.css +4 -252
- package/styles/dark/attributes.css +1 -1
- package/styles/dark/attributes.css.map +1 -1
- package/styles/dark/media-query.css +1 -1
- package/styles/dark/media-query.css.map +1 -1
- package/styles.css +1 -1
- package/styles.css.map +1 -1
- package/dist/components/AvatarStack.cjs +0 -115
- package/dist/components/AvatarStack.cjs.map +0 -1
- package/dist/components/AvatarStack.js +0 -113
- package/dist/components/AvatarStack.js.map +0 -1
- package/dist/components/CommentPin.cjs +0 -27
- package/dist/components/CommentPin.cjs.map +0 -1
- package/dist/components/CommentPin.js +0 -25
- package/dist/components/CommentPin.js.map +0 -1
- package/dist/components/Cursor.cjs +0 -40
- package/dist/components/Cursor.cjs.map +0 -1
- package/dist/components/Cursor.js +0 -38
- package/dist/components/Cursor.js.map +0 -1
- package/dist/components/Cursors.cjs +0 -252
- package/dist/components/Cursors.cjs.map +0 -1
- package/dist/components/Cursors.js +0 -250
- package/dist/components/Cursors.js.map +0 -1
- package/dist/components/FloatingComposer.cjs +0 -82
- package/dist/components/FloatingComposer.cjs.map +0 -1
- package/dist/components/FloatingComposer.js +0 -80
- package/dist/components/FloatingComposer.js.map +0 -1
- package/dist/components/FloatingThread.cjs +0 -82
- package/dist/components/FloatingThread.cjs.map +0 -1
- package/dist/components/FloatingThread.js +0 -80
- package/dist/components/FloatingThread.js.map +0 -1
- package/dist/utils/animation-loop.cjs +0 -44
- package/dist/utils/animation-loop.cjs.map +0 -1
- package/dist/utils/animation-loop.js +0 -42
- package/dist/utils/animation-loop.js.map +0 -1
- package/dist/utils/use-pre-resolve-user.cjs +0 -18
- package/dist/utils/use-pre-resolve-user.cjs.map +0 -1
- package/dist/utils/use-pre-resolve-user.js +0 -16
- package/dist/utils/use-pre-resolve-user.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlock.cjs","sources":["../../../src/components/internal/CodeBlock.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { CheckIcon, CopyIcon } from \"../../icons\";\nimport type { GlobalOverrides } from \"../../overrides\";\nimport { useOverrides } from \"../../overrides\";\nimport { Button } from \"./Button\";\nimport { Tooltip, TooltipProvider } from \"./Tooltip\";\n\nconst COPY_DELAY = 1500;\n\ninterface CodeBlockProps extends Omit<ComponentProps<\"div\">, \"title\"> {\n title: string;\n code: string;\n overrides?: Partial<GlobalOverrides>;\n}\n\nexport function CodeBlock({ title, code, overrides }: CodeBlockProps) {\n const $ = useOverrides(overrides);\n const [isCopied, setCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n if (isCopied) {\n timeoutRef.current = setTimeout(() => {\n setCopied(false);\n }, COPY_DELAY);\n }\n\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, [isCopied]);\n\n const handleCopy = useCallback(() => {\n try {\n navigator.clipboard.writeText(code);\n setCopied(true);\n } catch (error) {\n console.error(error);\n }\n }, [code]);\n\n return (\n <TooltipProvider>\n <div className=\"lb-root lb-code-block\">\n <div className=\"lb-code-block-header\">\n <span className=\"lb-code-block-title\">{title}</span>\n <div className=\"lb-code-block-header-actions\">\n <Tooltip content={isCopied ? null : $.COPY_TO_CLIPBOARD}>\n <Button\n className=\"lb-code-block-header-action\"\n icon={isCopied ? <CheckIcon /> : <CopyIcon />}\n onClick={handleCopy}\n aria-label={$.COPY_TO_CLIPBOARD}\n />\n </Tooltip>\n </div>\n </div>\n <pre className=\"lb-code-block-content\">\n <code>{code}</code>\n </pre>\n </div>\n </TooltipProvider>\n );\n}\n"],"names":["overrides","useOverrides","useState","useRef","useEffect","useCallback","jsx","TooltipProvider","jsxs","Tooltip","Button","CheckIcon","CopyIcon"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CodeBlock.cjs","sources":["../../../src/components/internal/CodeBlock.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { CheckIcon, CopyIcon } from \"../../icons\";\nimport type { GlobalOverrides } from \"../../overrides\";\nimport { useOverrides } from \"../../overrides\";\nimport { Button } from \"./Button\";\nimport { Tooltip, TooltipProvider } from \"./Tooltip\";\n\nconst COPY_DELAY = 1500;\n\ninterface CodeBlockProps extends Omit<ComponentProps<\"div\">, \"title\"> {\n title: string;\n code: string;\n overrides?: Partial<GlobalOverrides>;\n}\n\nexport function CodeBlock({ title, code, overrides }: CodeBlockProps) {\n const $ = useOverrides(overrides);\n const [isCopied, setCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n if (isCopied) {\n timeoutRef.current = setTimeout(() => {\n setCopied(false);\n }, COPY_DELAY);\n }\n\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, [isCopied]);\n\n const handleCopy = useCallback(() => {\n try {\n navigator.clipboard.writeText(code);\n setCopied(true);\n } catch (error) {\n console.error(error);\n }\n }, [code]);\n\n return (\n <TooltipProvider>\n <div className=\"lb-root lb-code-block\">\n <div className=\"lb-code-block-header\">\n <span className=\"lb-code-block-title\">{title}</span>\n <div className=\"lb-code-block-header-actions\">\n <Tooltip content={isCopied ? null : $.COPY_TO_CLIPBOARD}>\n <Button\n className=\"lb-code-block-header-action\"\n icon={isCopied ? <CheckIcon /> : <CopyIcon />}\n onClick={handleCopy}\n aria-label={$.COPY_TO_CLIPBOARD}\n />\n </Tooltip>\n </div>\n </div>\n <pre className=\"lb-code-block-content\">\n <code>{code}</code>\n </pre>\n </div>\n </TooltipProvider>\n );\n}\n"],"names":["overrides","useOverrides","useState","useRef","useEffect","useCallback","jsx","TooltipProvider","jsxs","Tooltip","Button","CheckIcon","CopyIcon"],"mappings":";;;;;;;;;;;;AASA,MAAM,UAAa,GAAA,IAAA,CAAA;AAQZ,SAAS,SAAU,CAAA,EAAE,KAAO,EAAA,IAAA,aAAMA,aAA6B,EAAA;AACpE,EAAM,MAAA,CAAA,GAAIC,uBAAaD,WAAS,CAAA,CAAA;AAChC,EAAA,MAAM,CAAC,QAAA,EAAU,SAAS,CAAA,GAAIE,eAAS,KAAK,CAAA,CAAA;AAC5C,EAAM,MAAA,UAAA,GAAaC,aAA6C,IAAI,CAAA,CAAA;AAEpE,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,QAAU,EAAA;AACZ,MAAW,UAAA,CAAA,OAAA,GAAU,WAAW,MAAM;AACpC,QAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AAAA,SACd,UAAU,CAAA,CAAA;AAAA,KACf;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,WAAW,OAAS,EAAA;AACtB,QAAA,YAAA,CAAa,WAAW,OAAO,CAAA,CAAA;AAAA,OACjC;AAAA,KACF,CAAA;AAAA,GACF,EAAG,CAAC,QAAQ,CAAC,CAAA,CAAA;AAEb,EAAM,MAAA,UAAA,GAAaC,kBAAY,MAAM;AACnC,IAAI,IAAA;AACF,MAAU,SAAA,CAAA,SAAA,CAAU,UAAU,IAAI,CAAA,CAAA;AAClC,MAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AAAA,aACP,KAAO,EAAA;AACd,MAAA,OAAA,CAAQ,MAAM,KAAK,CAAA,CAAA;AAAA,KACrB;AAAA,GACF,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAET,EAAA,uBACGC,cAAA,CAAAC,gCAAA,EAAA,EACC,QAAC,kBAAAC,eAAA,CAAA,KAAA,EAAA,EAAI,WAAU,uBACb,EAAA,QAAA,EAAA;AAAA,oBAACA,eAAA,CAAA,KAAA,EAAA,EAAI,WAAU,sBACb,EAAA,QAAA,EAAA;AAAA,sBAACF,cAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,qBAAA,EAAuB,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,sBAC7CA,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,8BACb,EAAA,QAAA,kBAAAA,cAAA,CAACG,mBAAQ,OAAS,EAAA,QAAA,GAAW,IAAO,GAAA,CAAA,CAAE,iBACpC,EAAA,QAAA,kBAAAH,cAAA;AAAA,QAACI,aAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,6BAAA;AAAA,UACV,MAAM,QAAW,mBAAAJ,cAAA,CAACK,eAAU,EAAA,EAAA,CAAA,kCAAMC,aAAS,EAAA,EAAA,CAAA;AAAA,UAC3C,OAAS,EAAA,UAAA;AAAA,UACT,cAAY,CAAE,CAAA,iBAAA;AAAA,SAAA;AAAA,SAElB,CACF,EAAA,CAAA;AAAA,KACF,EAAA,CAAA;AAAA,mCACC,KAAI,EAAA,EAAA,SAAA,EAAU,yBACb,QAAC,kBAAAN,cAAA,CAAA,MAAA,EAAA,EAAM,gBAAK,CACd,EAAA,CAAA;AAAA,GAAA,EACF,CACF,EAAA,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -3,7 +3,8 @@ import { useState, useRef, useEffect, useCallback } from 'react';
|
|
|
3
3
|
import '../../icons/index.js';
|
|
4
4
|
import { useOverrides } from '../../overrides.js';
|
|
5
5
|
import { Button } from './Button.js';
|
|
6
|
-
import {
|
|
6
|
+
import { Tooltip } from './Tooltip.js';
|
|
7
|
+
import { TooltipProvider } from '@radix-ui/react-tooltip';
|
|
7
8
|
import { CheckIcon } from '../../icons/Check.js';
|
|
8
9
|
import { CopyIcon } from '../../icons/Copy.js';
|
|
9
10
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlock.js","sources":["../../../src/components/internal/CodeBlock.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { CheckIcon, CopyIcon } from \"../../icons\";\nimport type { GlobalOverrides } from \"../../overrides\";\nimport { useOverrides } from \"../../overrides\";\nimport { Button } from \"./Button\";\nimport { Tooltip, TooltipProvider } from \"./Tooltip\";\n\nconst COPY_DELAY = 1500;\n\ninterface CodeBlockProps extends Omit<ComponentProps<\"div\">, \"title\"> {\n title: string;\n code: string;\n overrides?: Partial<GlobalOverrides>;\n}\n\nexport function CodeBlock({ title, code, overrides }: CodeBlockProps) {\n const $ = useOverrides(overrides);\n const [isCopied, setCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n if (isCopied) {\n timeoutRef.current = setTimeout(() => {\n setCopied(false);\n }, COPY_DELAY);\n }\n\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, [isCopied]);\n\n const handleCopy = useCallback(() => {\n try {\n navigator.clipboard.writeText(code);\n setCopied(true);\n } catch (error) {\n console.error(error);\n }\n }, [code]);\n\n return (\n <TooltipProvider>\n <div className=\"lb-root lb-code-block\">\n <div className=\"lb-code-block-header\">\n <span className=\"lb-code-block-title\">{title}</span>\n <div className=\"lb-code-block-header-actions\">\n <Tooltip content={isCopied ? null : $.COPY_TO_CLIPBOARD}>\n <Button\n className=\"lb-code-block-header-action\"\n icon={isCopied ? <CheckIcon /> : <CopyIcon />}\n onClick={handleCopy}\n aria-label={$.COPY_TO_CLIPBOARD}\n />\n </Tooltip>\n </div>\n </div>\n <pre className=\"lb-code-block-content\">\n <code>{code}</code>\n </pre>\n </div>\n </TooltipProvider>\n );\n}\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CodeBlock.js","sources":["../../../src/components/internal/CodeBlock.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { useCallback, useEffect, useRef, useState } from \"react\";\n\nimport { CheckIcon, CopyIcon } from \"../../icons\";\nimport type { GlobalOverrides } from \"../../overrides\";\nimport { useOverrides } from \"../../overrides\";\nimport { Button } from \"./Button\";\nimport { Tooltip, TooltipProvider } from \"./Tooltip\";\n\nconst COPY_DELAY = 1500;\n\ninterface CodeBlockProps extends Omit<ComponentProps<\"div\">, \"title\"> {\n title: string;\n code: string;\n overrides?: Partial<GlobalOverrides>;\n}\n\nexport function CodeBlock({ title, code, overrides }: CodeBlockProps) {\n const $ = useOverrides(overrides);\n const [isCopied, setCopied] = useState(false);\n const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n useEffect(() => {\n if (isCopied) {\n timeoutRef.current = setTimeout(() => {\n setCopied(false);\n }, COPY_DELAY);\n }\n\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, [isCopied]);\n\n const handleCopy = useCallback(() => {\n try {\n navigator.clipboard.writeText(code);\n setCopied(true);\n } catch (error) {\n console.error(error);\n }\n }, [code]);\n\n return (\n <TooltipProvider>\n <div className=\"lb-root lb-code-block\">\n <div className=\"lb-code-block-header\">\n <span className=\"lb-code-block-title\">{title}</span>\n <div className=\"lb-code-block-header-actions\">\n <Tooltip content={isCopied ? null : $.COPY_TO_CLIPBOARD}>\n <Button\n className=\"lb-code-block-header-action\"\n icon={isCopied ? <CheckIcon /> : <CopyIcon />}\n onClick={handleCopy}\n aria-label={$.COPY_TO_CLIPBOARD}\n />\n </Tooltip>\n </div>\n </div>\n <pre className=\"lb-code-block-content\">\n <code>{code}</code>\n </pre>\n </div>\n </TooltipProvider>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;AASA,MAAM,UAAa,GAAA,IAAA,CAAA;AAQZ,SAAS,SAAU,CAAA,EAAE,KAAO,EAAA,IAAA,EAAM,WAA6B,EAAA;AACpE,EAAM,MAAA,CAAA,GAAI,aAAa,SAAS,CAAA,CAAA;AAChC,EAAA,MAAM,CAAC,QAAA,EAAU,SAAS,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AAC5C,EAAM,MAAA,UAAA,GAAa,OAA6C,IAAI,CAAA,CAAA;AAEpE,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,QAAU,EAAA;AACZ,MAAW,UAAA,CAAA,OAAA,GAAU,WAAW,MAAM;AACpC,QAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AAAA,SACd,UAAU,CAAA,CAAA;AAAA,KACf;AAEA,IAAA,OAAO,MAAM;AACX,MAAA,IAAI,WAAW,OAAS,EAAA;AACtB,QAAA,YAAA,CAAa,WAAW,OAAO,CAAA,CAAA;AAAA,OACjC;AAAA,KACF,CAAA;AAAA,GACF,EAAG,CAAC,QAAQ,CAAC,CAAA,CAAA;AAEb,EAAM,MAAA,UAAA,GAAa,YAAY,MAAM;AACnC,IAAI,IAAA;AACF,MAAU,SAAA,CAAA,SAAA,CAAU,UAAU,IAAI,CAAA,CAAA;AAClC,MAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AAAA,aACP,KAAO,EAAA;AACd,MAAA,OAAA,CAAQ,MAAM,KAAK,CAAA,CAAA;AAAA,KACrB;AAAA,GACF,EAAG,CAAC,IAAI,CAAC,CAAA,CAAA;AAET,EAAA,uBACG,GAAA,CAAA,eAAA,EAAA,EACC,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA,EAAI,WAAU,uBACb,EAAA,QAAA,EAAA;AAAA,oBAAC,IAAA,CAAA,KAAA,EAAA,EAAI,WAAU,sBACb,EAAA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,qBAAA,EAAuB,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,sBAC7C,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,8BACb,EAAA,QAAA,kBAAA,GAAA,CAAC,WAAQ,OAAS,EAAA,QAAA,GAAW,IAAO,GAAA,CAAA,CAAE,iBACpC,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,SAAU,EAAA,6BAAA;AAAA,UACV,MAAM,QAAW,mBAAA,GAAA,CAAC,SAAU,EAAA,EAAA,CAAA,uBAAM,QAAS,EAAA,EAAA,CAAA;AAAA,UAC3C,OAAS,EAAA,UAAA;AAAA,UACT,cAAY,CAAE,CAAA,iBAAA;AAAA,SAAA;AAAA,SAElB,CACF,EAAA,CAAA;AAAA,KACF,EAAA,CAAA;AAAA,wBACC,KAAI,EAAA,EAAA,SAAA,EAAU,yBACb,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA,EAAM,gBAAK,CACd,EAAA,CAAA;AAAA,GAAA,EACF,CACF,EAAA,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -2,13 +2,32 @@
|
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
-
var
|
|
5
|
+
var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
|
|
6
6
|
var react = require('react');
|
|
7
7
|
var config = require('../../config.cjs');
|
|
8
8
|
var constants = require('../../constants.cjs');
|
|
9
9
|
var overrides = require('../../overrides.cjs');
|
|
10
10
|
var cn = require('../../utils/cn.cjs');
|
|
11
11
|
|
|
12
|
+
function _interopNamespaceDefault(e) {
|
|
13
|
+
var n = Object.create(null);
|
|
14
|
+
if (e) {
|
|
15
|
+
Object.keys(e).forEach(function (k) {
|
|
16
|
+
if (k !== 'default') {
|
|
17
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
18
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () { return e[k]; }
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
n.default = e;
|
|
26
|
+
return Object.freeze(n);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespaceDefault(DropdownMenuPrimitive);
|
|
30
|
+
|
|
12
31
|
|
|
13
32
|
function Dropdown({
|
|
14
33
|
children,
|
|
@@ -22,7 +41,7 @@ function Dropdown({
|
|
|
22
41
|
const $ = overrides.useOverrides();
|
|
23
42
|
const { portalContainer } = config.useLiveblocksUiConfig();
|
|
24
43
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
25
|
-
|
|
44
|
+
DropdownMenuPrimitive__namespace.Root,
|
|
26
45
|
{
|
|
27
46
|
defaultOpen,
|
|
28
47
|
open,
|
|
@@ -30,8 +49,8 @@ function Dropdown({
|
|
|
30
49
|
dir: $.dir,
|
|
31
50
|
children: [
|
|
32
51
|
children,
|
|
33
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
34
|
-
|
|
52
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { container: portalContainer, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
53
|
+
DropdownMenuPrimitive__namespace.Content,
|
|
35
54
|
{
|
|
36
55
|
className: cn.cn(
|
|
37
56
|
"lb-root lb-portal lb-elevation lb-dropdown",
|
|
@@ -50,7 +69,7 @@ function Dropdown({
|
|
|
50
69
|
const DropdownItem = react.forwardRef(
|
|
51
70
|
({ children, className, icon, ...props }, forwardedRef) => {
|
|
52
71
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
53
|
-
|
|
72
|
+
DropdownMenuPrimitive__namespace.DropdownMenuItem,
|
|
54
73
|
{
|
|
55
74
|
className: cn.cn("lb-dropdown-item", className),
|
|
56
75
|
...props,
|
|
@@ -63,9 +82,11 @@ const DropdownItem = react.forwardRef(
|
|
|
63
82
|
);
|
|
64
83
|
}
|
|
65
84
|
);
|
|
66
|
-
const DropdownTrigger = radixUi.DropdownMenu.Trigger;
|
|
67
85
|
|
|
86
|
+
Object.defineProperty(exports, 'DropdownTrigger', {
|
|
87
|
+
enumerable: true,
|
|
88
|
+
get: function () { return DropdownMenuPrimitive.DropdownMenuTrigger; }
|
|
89
|
+
});
|
|
68
90
|
exports.Dropdown = Dropdown;
|
|
69
91
|
exports.DropdownItem = DropdownItem;
|
|
70
|
-
exports.DropdownTrigger = DropdownTrigger;
|
|
71
92
|
//# sourceMappingURL=Dropdown.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.cjs","sources":["../../../src/components/internal/Dropdown.tsx"],"sourcesContent":["\"use client\";\n\nimport
|
|
1
|
+
{"version":3,"file":"Dropdown.cjs","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 { cn } from \"../../utils/cn\";\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={cn(\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={cn(\"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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BO;AAAkB;AACvB;AACA;AACA;AACA;AACA;AACA;AAEF;AACE;AACA;AAEA;AACE;AAAuB;AAAtB;AACC;AACA;AACA;AACO;AAEN;AAAA;AAEC;AAAuB;AAAtB;AACY;AACT;AACA;AACF;AACY;AACM;AACd;AAEH;AAAA;AAEL;AAAA;AAAA;AAGN;AAEO;AAAqB;AAExB;AACE;AAAuB;AAAtB;AAC4C;AACvC;AACC;AAEJ;AAIG;AAGA;AAAA;AAAA;AACN;AAGN;;;;;;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
-
import
|
|
3
|
+
import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
|
|
4
|
+
export { DropdownMenuTrigger as DropdownTrigger } from '@radix-ui/react-dropdown-menu';
|
|
4
5
|
import { forwardRef } from 'react';
|
|
5
6
|
import { useLiveblocksUiConfig } from '../../config.js';
|
|
6
7
|
import { FLOATING_ELEMENT_SIDE_OFFSET, FLOATING_ELEMENT_COLLISION_PADDING } from '../../constants.js';
|
|
@@ -20,7 +21,7 @@ function Dropdown({
|
|
|
20
21
|
const $ = useOverrides();
|
|
21
22
|
const { portalContainer } = useLiveblocksUiConfig();
|
|
22
23
|
return /* @__PURE__ */ jsxs(
|
|
23
|
-
|
|
24
|
+
DropdownMenuPrimitive.Root,
|
|
24
25
|
{
|
|
25
26
|
defaultOpen,
|
|
26
27
|
open,
|
|
@@ -28,8 +29,8 @@ function Dropdown({
|
|
|
28
29
|
dir: $.dir,
|
|
29
30
|
children: [
|
|
30
31
|
children,
|
|
31
|
-
/* @__PURE__ */ jsx(
|
|
32
|
-
|
|
32
|
+
/* @__PURE__ */ jsx(DropdownMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx(
|
|
33
|
+
DropdownMenuPrimitive.Content,
|
|
33
34
|
{
|
|
34
35
|
className: cn(
|
|
35
36
|
"lb-root lb-portal lb-elevation lb-dropdown",
|
|
@@ -48,7 +49,7 @@ function Dropdown({
|
|
|
48
49
|
const DropdownItem = forwardRef(
|
|
49
50
|
({ children, className, icon, ...props }, forwardedRef) => {
|
|
50
51
|
return /* @__PURE__ */ jsxs(
|
|
51
|
-
|
|
52
|
+
DropdownMenuPrimitive.DropdownMenuItem,
|
|
52
53
|
{
|
|
53
54
|
className: cn("lb-dropdown-item", className),
|
|
54
55
|
...props,
|
|
@@ -61,7 +62,6 @@ const DropdownItem = forwardRef(
|
|
|
61
62
|
);
|
|
62
63
|
}
|
|
63
64
|
);
|
|
64
|
-
const DropdownTrigger = DropdownMenu.Trigger;
|
|
65
65
|
|
|
66
|
-
export { Dropdown, DropdownItem
|
|
66
|
+
export { Dropdown, DropdownItem };
|
|
67
67
|
//# sourceMappingURL=Dropdown.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dropdown.js","sources":["../../../src/components/internal/Dropdown.tsx"],"sourcesContent":["\"use client\";\n\nimport
|
|
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 { cn } from \"../../utils/cn\";\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={cn(\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={cn(\"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":";;;;;;;;;;;AA6BO;AAAkB;AACvB;AACA;AACA;AACA;AACA;AACA;AAEF;AACE;AACA;AAEA;AACE;AAAuB;AAAtB;AACC;AACA;AACA;AACO;AAEN;AAAA;AAEC;AAAuB;AAAtB;AACY;AACT;AACA;AACF;AACY;AACM;AACd;AAEH;AAAA;AAEL;AAAA;AAAA;AAGN;AAEO;AAAqB;AAExB;AACE;AAAuB;AAAtB;AAC4C;AACvC;AACC;AAEJ;AAIG;AAGA;AAAA;AAAA;AACN;AAGN;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var PopoverPrimitive = require('@radix-ui/react-popover');
|
|
4
5
|
var frimousse = require('frimousse');
|
|
5
|
-
var radixUi = require('radix-ui');
|
|
6
6
|
var react = require('react');
|
|
7
7
|
var config = require('../../config.cjs');
|
|
8
8
|
var constants = require('../../constants.cjs');
|
|
@@ -13,6 +13,25 @@ var cn = require('../../utils/cn.cjs');
|
|
|
13
13
|
var Emoji = require('./Emoji.cjs');
|
|
14
14
|
var Tooltip = require('./Tooltip.cjs');
|
|
15
15
|
|
|
16
|
+
function _interopNamespaceDefault(e) {
|
|
17
|
+
var n = Object.create(null);
|
|
18
|
+
if (e) {
|
|
19
|
+
Object.keys(e).forEach(function (k) {
|
|
20
|
+
if (k !== 'default') {
|
|
21
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
22
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
23
|
+
enumerable: true,
|
|
24
|
+
get: function () { return e[k]; }
|
|
25
|
+
});
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
n.default = e;
|
|
30
|
+
return Object.freeze(n);
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespaceDefault(PopoverPrimitive);
|
|
34
|
+
|
|
16
35
|
function EmojiPickerListEmoji({
|
|
17
36
|
emoji,
|
|
18
37
|
className,
|
|
@@ -63,10 +82,10 @@ const EmojiPicker = react.forwardRef(
|
|
|
63
82
|
const stopPropagation = react.useCallback((event) => {
|
|
64
83
|
event.stopPropagation();
|
|
65
84
|
}, []);
|
|
66
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
85
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(PopoverPrimitive__namespace.Root, { open: isOpen, onOpenChange: handleOpenChange, children: [
|
|
67
86
|
children,
|
|
68
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
69
|
-
|
|
87
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverPrimitive__namespace.Portal, { container: portalContainer, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
88
|
+
PopoverPrimitive__namespace.Content,
|
|
70
89
|
{
|
|
71
90
|
side: "top",
|
|
72
91
|
align: "center",
|
|
@@ -130,8 +149,10 @@ const EmojiPicker = react.forwardRef(
|
|
|
130
149
|
] });
|
|
131
150
|
}
|
|
132
151
|
);
|
|
133
|
-
const EmojiPickerTrigger = radixUi.Popover.Trigger;
|
|
134
152
|
|
|
153
|
+
Object.defineProperty(exports, 'EmojiPickerTrigger', {
|
|
154
|
+
enumerable: true,
|
|
155
|
+
get: function () { return PopoverPrimitive.PopoverTrigger; }
|
|
156
|
+
});
|
|
135
157
|
exports.EmojiPicker = EmojiPicker;
|
|
136
|
-
exports.EmojiPickerTrigger = EmojiPickerTrigger;
|
|
137
158
|
//# sourceMappingURL=EmojiPicker.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiPicker.cjs","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import {\n type Emoji as FrimousseEmoji,\n EmojiPicker as EmojiPickerPrimitive,\n type EmojiPickerListCategoryHeaderProps,\n type EmojiPickerListEmojiProps,\n type EmojiPickerListRowProps,\n type Locale,\n} from \"frimousse\";\nimport { Popover as PopoverPrimitive } from \"radix-ui\";\nimport type { ComponentPropsWithoutRef, SyntheticEvent } from \"react\";\nimport { forwardRef, useCallback, 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 { cn } from \"../../utils/cn\";\nimport { Emoji } from \"./Emoji\";\nimport { Tooltip } from \"./Tooltip\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerListEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerListEmojiProps) {\n return (\n <button className={cn(\"lb-emoji-picker-emoji\", className)} {...props}>\n <Emoji emoji={emoji.emoji} />\n </button>\n );\n}\n\nfunction EmojiPickerListRow({\n children,\n className,\n ...props\n}: EmojiPickerListRowProps) {\n return (\n <div className={cn(\"lb-emoji-picker-row\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerListCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerListCategoryHeaderProps) {\n return (\n <div\n className={cn(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">\n {category.label}\n </span>\n </div>\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, emojibaseUrl } = 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 }: FrimousseEmoji) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n const stopPropagation = useCallback((event: SyntheticEvent) => {\n event.stopPropagation();\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={cn(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n asChild\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale as Locale}\n columns={10}\n emojiVersion={15.1}\n emojibaseUrl={emojibaseUrl}\n onClick={stopPropagation}\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.Viewport className=\"lb-emoji-picker-content\">\n <EmojiPickerPrimitive.Loading className=\"lb-loading lb-emoji-picker-loading\">\n <SpinnerIcon />\n </EmojiPickerPrimitive.Loading>\n <EmojiPickerPrimitive.Empty className=\"lb-empty lb-emoji-picker-empty\">\n {$.EMOJI_PICKER_EMPTY}\n </EmojiPickerPrimitive.Empty>\n <EmojiPickerPrimitive.List\n className=\"lb-emoji-picker-list\"\n components={{\n CategoryHeader: EmojiPickerListCategoryHeader,\n Row: EmojiPickerListRow,\n Emoji: EmojiPickerListEmoji,\n }}\n />\n </EmojiPickerPrimitive.Viewport>\n <div className=\"lb-emoji-picker-footer\">\n <EmojiPickerPrimitive.ActiveEmoji>\n {({ emoji }) =>\n emoji ? (\n <>\n <div className=\"lb-emoji-picker-active-emoji\">\n {emoji.emoji}\n </div>\n <span className=\"lb-emoji-picker-active-emoji-label\">\n {emoji.label}\n </span>\n </>\n ) : (\n <span className=\"lb-emoji-picker-active-emoji-label lb-emoji-picker-active-emoji-label-placeholder\">\n Select an emoji…\n </span>\n )\n }\n </EmojiPickerPrimitive.ActiveEmoji>\n <Tooltip content={$.EMOJI_PICKER_CHANGE_SKIN_TONE}>\n <EmojiPickerPrimitive.SkinToneSelector className=\"lb-button lb-emoji-picker-skin-tone-selector\" />\n </Tooltip>\n </div>\n </EmojiPickerPrimitive.Root>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n }\n);\n\nexport const EmojiPickerTrigger = PopoverPrimitive.Trigger;\n"],"names":["jsx","cn","Emoji","forwardRef","useState","useLiveblocksUiConfig","useOverrides","useCallback","isOpen","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","jsxs","EmojiPickerPrimitive","SearchIcon","SpinnerIcon","Fragment","Tooltip"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"EmojiPicker.cjs","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport {\n type Emoji as FrimousseEmoji,\n EmojiPicker as EmojiPickerPrimitive,\n type EmojiPickerListCategoryHeaderProps,\n type EmojiPickerListEmojiProps,\n type EmojiPickerListRowProps,\n type Locale,\n} from \"frimousse\";\nimport type { ComponentPropsWithoutRef, SyntheticEvent } from \"react\";\nimport { forwardRef, useCallback, 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 { cn } from \"../../utils/cn\";\nimport { Emoji } from \"./Emoji\";\nimport { Tooltip } from \"./Tooltip\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerListEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerListEmojiProps) {\n return (\n <button className={cn(\"lb-emoji-picker-emoji\", className)} {...props}>\n <Emoji emoji={emoji.emoji} />\n </button>\n );\n}\n\nfunction EmojiPickerListRow({\n children,\n className,\n ...props\n}: EmojiPickerListRowProps) {\n return (\n <div className={cn(\"lb-emoji-picker-row\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerListCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerListCategoryHeaderProps) {\n return (\n <div\n className={cn(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">\n {category.label}\n </span>\n </div>\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, emojibaseUrl } = 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 }: FrimousseEmoji) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n const stopPropagation = useCallback((event: SyntheticEvent) => {\n event.stopPropagation();\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={cn(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n asChild\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale as Locale}\n columns={10}\n emojiVersion={15.1}\n emojibaseUrl={emojibaseUrl}\n onClick={stopPropagation}\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.Viewport className=\"lb-emoji-picker-content\">\n <EmojiPickerPrimitive.Loading className=\"lb-loading lb-emoji-picker-loading\">\n <SpinnerIcon />\n </EmojiPickerPrimitive.Loading>\n <EmojiPickerPrimitive.Empty className=\"lb-empty lb-emoji-picker-empty\">\n {$.EMOJI_PICKER_EMPTY}\n </EmojiPickerPrimitive.Empty>\n <EmojiPickerPrimitive.List\n className=\"lb-emoji-picker-list\"\n components={{\n CategoryHeader: EmojiPickerListCategoryHeader,\n Row: EmojiPickerListRow,\n Emoji: EmojiPickerListEmoji,\n }}\n />\n </EmojiPickerPrimitive.Viewport>\n <div className=\"lb-emoji-picker-footer\">\n <EmojiPickerPrimitive.ActiveEmoji>\n {({ emoji }) =>\n emoji ? (\n <>\n <div className=\"lb-emoji-picker-active-emoji\">\n {emoji.emoji}\n </div>\n <span className=\"lb-emoji-picker-active-emoji-label\">\n {emoji.label}\n </span>\n </>\n ) : (\n <span className=\"lb-emoji-picker-active-emoji-label lb-emoji-picker-active-emoji-label-placeholder\">\n Select an emoji…\n </span>\n )\n }\n </EmojiPickerPrimitive.ActiveEmoji>\n <Tooltip content={$.EMOJI_PICKER_CHANGE_SKIN_TONE}>\n <EmojiPickerPrimitive.SkinToneSelector className=\"lb-button lb-emoji-picker-skin-tone-selector\" />\n </Tooltip>\n </div>\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","cn","Emoji","forwardRef","useState","useLiveblocksUiConfig","useOverrides","useCallback","isOpen","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","jsxs","EmojiPickerPrimitive","SearchIcon","SpinnerIcon","Fragment","Tooltip"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
|
+
import * as PopoverPrimitive from '@radix-ui/react-popover';
|
|
3
|
+
export { PopoverTrigger as EmojiPickerTrigger } from '@radix-ui/react-popover';
|
|
2
4
|
import { EmojiPicker as EmojiPicker$1 } from 'frimousse';
|
|
3
|
-
import { Popover } from 'radix-ui';
|
|
4
5
|
import { forwardRef, useState, useCallback } from 'react';
|
|
5
6
|
import { useLiveblocksUiConfig } from '../../config.js';
|
|
6
7
|
import { FLOATING_ELEMENT_SIDE_OFFSET, FLOATING_ELEMENT_COLLISION_PADDING } from '../../constants.js';
|
|
@@ -61,10 +62,10 @@ const EmojiPicker = forwardRef(
|
|
|
61
62
|
const stopPropagation = useCallback((event) => {
|
|
62
63
|
event.stopPropagation();
|
|
63
64
|
}, []);
|
|
64
|
-
return /* @__PURE__ */ jsxs(
|
|
65
|
+
return /* @__PURE__ */ jsxs(PopoverPrimitive.Root, { open: isOpen, onOpenChange: handleOpenChange, children: [
|
|
65
66
|
children,
|
|
66
|
-
/* @__PURE__ */ jsx(
|
|
67
|
-
|
|
67
|
+
/* @__PURE__ */ jsx(PopoverPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx(
|
|
68
|
+
PopoverPrimitive.Content,
|
|
68
69
|
{
|
|
69
70
|
side: "top",
|
|
70
71
|
align: "center",
|
|
@@ -128,7 +129,6 @@ const EmojiPicker = forwardRef(
|
|
|
128
129
|
] });
|
|
129
130
|
}
|
|
130
131
|
);
|
|
131
|
-
const EmojiPickerTrigger = Popover.Trigger;
|
|
132
132
|
|
|
133
|
-
export { EmojiPicker
|
|
133
|
+
export { EmojiPicker };
|
|
134
134
|
//# sourceMappingURL=EmojiPicker.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmojiPicker.js","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import {\n type Emoji as FrimousseEmoji,\n EmojiPicker as EmojiPickerPrimitive,\n type EmojiPickerListCategoryHeaderProps,\n type EmojiPickerListEmojiProps,\n type EmojiPickerListRowProps,\n type Locale,\n} from \"frimousse\";\nimport { Popover as PopoverPrimitive } from \"radix-ui\";\nimport type { ComponentPropsWithoutRef, SyntheticEvent } from \"react\";\nimport { forwardRef, useCallback, 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 { cn } from \"../../utils/cn\";\nimport { Emoji } from \"./Emoji\";\nimport { Tooltip } from \"./Tooltip\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerListEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerListEmojiProps) {\n return (\n <button className={cn(\"lb-emoji-picker-emoji\", className)} {...props}>\n <Emoji emoji={emoji.emoji} />\n </button>\n );\n}\n\nfunction EmojiPickerListRow({\n children,\n className,\n ...props\n}: EmojiPickerListRowProps) {\n return (\n <div className={cn(\"lb-emoji-picker-row\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerListCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerListCategoryHeaderProps) {\n return (\n <div\n className={cn(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">\n {category.label}\n </span>\n </div>\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, emojibaseUrl } = 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 }: FrimousseEmoji) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n const stopPropagation = useCallback((event: SyntheticEvent) => {\n event.stopPropagation();\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={cn(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n asChild\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale as Locale}\n columns={10}\n emojiVersion={15.1}\n emojibaseUrl={emojibaseUrl}\n onClick={stopPropagation}\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.Viewport className=\"lb-emoji-picker-content\">\n <EmojiPickerPrimitive.Loading className=\"lb-loading lb-emoji-picker-loading\">\n <SpinnerIcon />\n </EmojiPickerPrimitive.Loading>\n <EmojiPickerPrimitive.Empty className=\"lb-empty lb-emoji-picker-empty\">\n {$.EMOJI_PICKER_EMPTY}\n </EmojiPickerPrimitive.Empty>\n <EmojiPickerPrimitive.List\n className=\"lb-emoji-picker-list\"\n components={{\n CategoryHeader: EmojiPickerListCategoryHeader,\n Row: EmojiPickerListRow,\n Emoji: EmojiPickerListEmoji,\n }}\n />\n </EmojiPickerPrimitive.Viewport>\n <div className=\"lb-emoji-picker-footer\">\n <EmojiPickerPrimitive.ActiveEmoji>\n {({ emoji }) =>\n emoji ? (\n <>\n <div className=\"lb-emoji-picker-active-emoji\">\n {emoji.emoji}\n </div>\n <span className=\"lb-emoji-picker-active-emoji-label\">\n {emoji.label}\n </span>\n </>\n ) : (\n <span className=\"lb-emoji-picker-active-emoji-label lb-emoji-picker-active-emoji-label-placeholder\">\n Select an emoji…\n </span>\n )\n }\n </EmojiPickerPrimitive.ActiveEmoji>\n <Tooltip content={$.EMOJI_PICKER_CHANGE_SKIN_TONE}>\n <EmojiPickerPrimitive.SkinToneSelector className=\"lb-button lb-emoji-picker-skin-tone-selector\" />\n </Tooltip>\n </div>\n </EmojiPickerPrimitive.Root>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </PopoverPrimitive.Root>\n );\n }\n);\n\nexport const EmojiPickerTrigger = PopoverPrimitive.Trigger;\n"],"names":["isOpen","PopoverPrimitive","EmojiPickerPrimitive"],"mappings":";;;;;;;;;;;;;AA6BA,SAAS,oBAAqB,CAAA;AAAA,EAC5B,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG,KAAA;AACL,CAA8B,EAAA;AAC5B,EAAA,uBACG,GAAA,CAAA,QAAA,EAAA,EAAO,SAAW,EAAA,EAAA,CAAG,yBAAyB,SAAS,CAAA,EAAI,GAAG,KAAA,EAC7D,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAM,KAAO,EAAA,KAAA,CAAM,OAAO,CAC7B,EAAA,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,kBAAmB,CAAA;AAAA,EAC1B,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG,KAAA;AACL,CAA4B,EAAA;AAC1B,EACE,uBAAA,GAAA,CAAC,SAAI,SAAW,EAAA,EAAA,CAAG,uBAAuB,SAAS,CAAA,EAAI,GAAG,KAAA,EACvD,QACH,EAAA,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,6BAA8B,CAAA;AAAA,EACrC,QAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG,KAAA;AACL,CAAuC,EAAA;AACrC,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAG,CAAA,iCAAA,EAAmC,SAAS,CAAA;AAAA,MACzD,GAAG,KAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,uCAAA,EACb,mBAAS,KACZ,EAAA,CAAA;AAAA,KAAA;AAAA,GACF,CAAA;AAEJ,CAAA;AAEO,MAAM,WAAc,GAAA,UAAA;AAAA,EACzB,CACE,EAAE,aAAe,EAAA,YAAA,EAAc,UAAU,SAAW,EAAA,GAAG,KAAM,EAAA,EAC7D,YACG,KAAA;AACH,IAAA,MAAM,CAAC,MAAA,EAAQ,OAAO,CAAA,GAAI,SAAS,KAAK,CAAA,CAAA;AACxC,IAAA,MAAM,EAAE,eAAA,EAAiB,YAAa,EAAA,GAAI,qBAAsB,EAAA,CAAA;AAChE,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,EAAE,KAAA,EAA4B,KAAA;AAC7B,QAAA,OAAA,CAAQ,KAAK,CAAA,CAAA;AACb,QAAA,aAAA,GAAgB,KAAK,CAAA,CAAA;AAAA,OACvB;AAAA,MACA,CAAC,aAAa,CAAA;AAAA,KAChB,CAAA;AAEA,IAAM,MAAA,eAAA,GAAkB,WAAY,CAAA,CAAC,KAA0B,KAAA;AAC7D,MAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,KACxB,EAAG,EAAE,CAAA,CAAA;AAEL,IAAA,4BACGC,OAAiB,CAAA,IAAA,EAAjB,EAAsB,IAAM,EAAA,MAAA,EAAQ,cAAc,gBAChD,EAAA,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,sBACA,GAAA,CAAAA,OAAA,CAAiB,MAAjB,EAAA,EAAwB,WAAW,eAClC,EAAA,QAAA,kBAAA,GAAA;AAAA,QAACA,OAAiB,CAAA,OAAA;AAAA,QAAjB;AAAA,UACC,IAAK,EAAA,KAAA;AAAA,UACL,KAAM,EAAA,QAAA;AAAA,UACN,UAAY,EAAA,4BAAA;AAAA,UACZ,gBAAkB,EAAA,kCAAA;AAAA,UAClB,SAAW,EAAA,EAAA;AAAA,YACT,gDAAA;AAAA,YACA,SAAA;AAAA,WACF;AAAA,UACC,GAAG,KAAA;AAAA,UACJ,GAAK,EAAA,YAAA;AAAA,UACL,OAAO,EAAA,IAAA;AAAA,UAEP,QAAA,kBAAA,IAAA;AAAA,YAACC,aAAqB,CAAA,IAAA;AAAA,YAArB;AAAA,cACC,aAAe,EAAA,iBAAA;AAAA,cACf,QAAQ,CAAE,CAAA,MAAA;AAAA,cACV,OAAS,EAAA,EAAA;AAAA,cACT,YAAc,EAAA,IAAA;AAAA,cACd,YAAA;AAAA,cACA,OAAS,EAAA,eAAA;AAAA,cAET,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,SAAI,SAAU,EAAA,wBAAA,EACb,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA,EAAI,WAAU,kCACb,EAAA,QAAA,EAAA;AAAA,kCAAA,GAAA;AAAA,oBAACA,aAAqB,CAAA,MAAA;AAAA,oBAArB;AAAA,sBACC,SAAU,EAAA,wBAAA;AAAA,sBACV,aAAa,CAAE,CAAA,+BAAA;AAAA,sBACf,SAAS,EAAA,IAAA;AAAA,qBAAA;AAAA,mBACX;AAAA,sCACC,UAAW,EAAA,EAAA,CAAA;AAAA,iBAAA,EACd,CACF,EAAA,CAAA;AAAA,gCACC,IAAA,CAAAA,aAAA,CAAqB,QAArB,EAAA,EAA8B,WAAU,yBACvC,EAAA,QAAA,EAAA;AAAA,kCAAA,GAAA,CAACA,cAAqB,OAArB,EAAA,EAA6B,WAAU,oCACtC,EAAA,QAAA,kBAAA,GAAA,CAAC,eAAY,CACf,EAAA,CAAA;AAAA,sCACCA,aAAqB,CAAA,KAAA,EAArB,EAA2B,SAAU,EAAA,gCAAA,EACnC,YAAE,kBACL,EAAA,CAAA;AAAA,kCACA,GAAA;AAAA,oBAACA,aAAqB,CAAA,IAAA;AAAA,oBAArB;AAAA,sBACC,SAAU,EAAA,sBAAA;AAAA,sBACV,UAAY,EAAA;AAAA,wBACV,cAAgB,EAAA,6BAAA;AAAA,wBAChB,GAAK,EAAA,kBAAA;AAAA,wBACL,KAAO,EAAA,oBAAA;AAAA,uBACT;AAAA,qBAAA;AAAA,mBACF;AAAA,iBACF,EAAA,CAAA;AAAA,gCACA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,wBACb,EAAA,QAAA,EAAA;AAAA,kCAAC,GAAA,CAAAA,aAAA,CAAqB,aAArB,EACE,QAAA,EAAA,CAAC,EAAE,KAAM,EAAA,KACR,wBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oCAAA,GAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,8BACZ,EAAA,QAAA,EAAA,KAAA,CAAM,KACT,EAAA,CAAA;AAAA,oCACC,GAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,oCAAA,EACb,gBAAM,KACT,EAAA,CAAA;AAAA,mBAAA,EACF,oBAEC,GAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,mFAAA,EAAoF,mCAEpG,CAGN,EAAA,CAAA;AAAA,kCACA,GAAA,CAAC,OAAQ,EAAA,EAAA,OAAA,EAAS,CAAE,CAAA,6BAAA,EAClB,QAAC,kBAAA,GAAA,CAAAA,aAAA,CAAqB,gBAArB,EAAA,EAAsC,SAAU,EAAA,8CAAA,EAA+C,CAClG,EAAA,CAAA;AAAA,iBACF,EAAA,CAAA;AAAA,eAAA;AAAA,aAAA;AAAA,WACF;AAAA,SAAA;AAAA,OAEJ,EAAA,CAAA;AAAA,KACF,EAAA,CAAA,CAAA;AAAA,GAEJ;AACF,EAAA;AAEO,MAAM,qBAAqBD,OAAiB,CAAA;;;;"}
|
|
1
|
+
{"version":3,"file":"EmojiPicker.js","sources":["../../../src/components/internal/EmojiPicker.tsx"],"sourcesContent":["import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport {\n type Emoji as FrimousseEmoji,\n EmojiPicker as EmojiPickerPrimitive,\n type EmojiPickerListCategoryHeaderProps,\n type EmojiPickerListEmojiProps,\n type EmojiPickerListRowProps,\n type Locale,\n} from \"frimousse\";\nimport type { ComponentPropsWithoutRef, SyntheticEvent } from \"react\";\nimport { forwardRef, useCallback, 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 { cn } from \"../../utils/cn\";\nimport { Emoji } from \"./Emoji\";\nimport { Tooltip } from \"./Tooltip\";\n\nexport interface EmojiPickerProps extends ComponentPropsWithoutRef<\"div\"> {\n onOpenChange?: (open: boolean) => void;\n onEmojiSelect?: (emoji: string) => void;\n}\n\nfunction EmojiPickerListEmoji({\n emoji,\n className,\n ...props\n}: EmojiPickerListEmojiProps) {\n return (\n <button className={cn(\"lb-emoji-picker-emoji\", className)} {...props}>\n <Emoji emoji={emoji.emoji} />\n </button>\n );\n}\n\nfunction EmojiPickerListRow({\n children,\n className,\n ...props\n}: EmojiPickerListRowProps) {\n return (\n <div className={cn(\"lb-emoji-picker-row\", className)} {...props}>\n {children}\n </div>\n );\n}\n\nfunction EmojiPickerListCategoryHeader({\n category,\n className,\n ...props\n}: EmojiPickerListCategoryHeaderProps) {\n return (\n <div\n className={cn(\"lb-emoji-picker-category-header\", className)}\n {...props}\n >\n <span className=\"lb-emoji-picker-category-header-title\">\n {category.label}\n </span>\n </div>\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, emojibaseUrl } = 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 }: FrimousseEmoji) => {\n setOpen(false);\n onEmojiSelect?.(emoji);\n },\n [onEmojiSelect]\n );\n\n const stopPropagation = useCallback((event: SyntheticEvent) => {\n event.stopPropagation();\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={cn(\n \"lb-root lb-portal lb-elevation lb-emoji-picker\",\n className\n )}\n {...props}\n ref={forwardedRef}\n asChild\n >\n <EmojiPickerPrimitive.Root\n onEmojiSelect={handleEmojiSelect}\n locale={$.locale as Locale}\n columns={10}\n emojiVersion={15.1}\n emojibaseUrl={emojibaseUrl}\n onClick={stopPropagation}\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.Viewport className=\"lb-emoji-picker-content\">\n <EmojiPickerPrimitive.Loading className=\"lb-loading lb-emoji-picker-loading\">\n <SpinnerIcon />\n </EmojiPickerPrimitive.Loading>\n <EmojiPickerPrimitive.Empty className=\"lb-empty lb-emoji-picker-empty\">\n {$.EMOJI_PICKER_EMPTY}\n </EmojiPickerPrimitive.Empty>\n <EmojiPickerPrimitive.List\n className=\"lb-emoji-picker-list\"\n components={{\n CategoryHeader: EmojiPickerListCategoryHeader,\n Row: EmojiPickerListRow,\n Emoji: EmojiPickerListEmoji,\n }}\n />\n </EmojiPickerPrimitive.Viewport>\n <div className=\"lb-emoji-picker-footer\">\n <EmojiPickerPrimitive.ActiveEmoji>\n {({ emoji }) =>\n emoji ? (\n <>\n <div className=\"lb-emoji-picker-active-emoji\">\n {emoji.emoji}\n </div>\n <span className=\"lb-emoji-picker-active-emoji-label\">\n {emoji.label}\n </span>\n </>\n ) : (\n <span className=\"lb-emoji-picker-active-emoji-label lb-emoji-picker-active-emoji-label-placeholder\">\n Select an emoji…\n </span>\n )\n }\n </EmojiPickerPrimitive.ActiveEmoji>\n <Tooltip content={$.EMOJI_PICKER_CHANGE_SKIN_TONE}>\n <EmojiPickerPrimitive.SkinToneSelector className=\"lb-button lb-emoji-picker-skin-tone-selector\" />\n </Tooltip>\n </div>\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"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
-
var
|
|
4
|
+
var reactSlot = require('@radix-ui/react-slot');
|
|
5
5
|
var react = require('react');
|
|
6
6
|
var overrides = require('../../overrides.cjs');
|
|
7
7
|
var cn = require('../../utils/cn.cjs');
|
|
@@ -9,7 +9,7 @@ var intl = require('../../utils/intl.cjs');
|
|
|
9
9
|
|
|
10
10
|
const List = react.forwardRef(
|
|
11
11
|
({ values, formatRemaining, truncate, locale, className, asChild, ...props }, forwardedRef) => {
|
|
12
|
-
const Component = asChild ?
|
|
12
|
+
const Component = asChild ? reactSlot.Slot : "span";
|
|
13
13
|
const $ = overrides.useOverrides();
|
|
14
14
|
const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;
|
|
15
15
|
const formattedList = react.useMemo(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.cjs","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot
|
|
1
|
+
{"version":3,"file":"List.cjs","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport type { ComponentPropsWithSlot } from \"../../types\";\nimport { cn } from \"../../utils/cn\";\nimport { listFormat } from \"../../utils/intl\";\n\nexport interface ListProps extends ComponentPropsWithSlot<\"span\"> {\n values: ReactNode[];\n formatRemaining?: (amount: number) => string;\n truncate?: number;\n locale?: string;\n}\n\nexport const List = forwardRef<HTMLSpanElement, ListProps>(\n (\n { values, formatRemaining, truncate, locale, className, asChild, ...props },\n forwardedRef\n ) => {\n const Component = asChild ? Slot : \"span\";\n const $ = useOverrides();\n const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;\n const formattedList = useMemo(() => {\n const elements =\n truncate && truncate < values.length - 1\n ? [\n ...values.slice(0, truncate),\n formatRemainingWithDefault(values.length - truncate),\n ]\n : [...values];\n const placeholders = Array(elements.length).fill(\".\");\n const parts = listFormat(locale).formatToParts(placeholders);\n\n return parts.map((part) =>\n part.type === \"element\" ? elements.shift() : part.value\n );\n }, [formatRemainingWithDefault, locale, truncate, values]);\n\n return (\n <Component\n className={cn(\"lb-list\", className)}\n {...props}\n ref={forwardedRef}\n >\n {formattedList}\n </Component>\n );\n }\n);\n"],"names":["forwardRef","Slot","useOverrides","useMemo","listFormat","jsx","cn"],"mappings":";;;;;;;;;AAgBO,MAAM,IAAO,GAAAA,gBAAA;AAAA,EAClB,CACE,EAAE,MAAA,EAAQ,eAAiB,EAAA,QAAA,EAAU,MAAQ,EAAA,SAAA,EAAW,OAAS,EAAA,GAAG,KAAM,EAAA,EAC1E,YACG,KAAA;AACH,IAAM,MAAA,SAAA,GAAY,UAAUC,cAAO,GAAA,MAAA,CAAA;AACnC,IAAA,MAAM,IAAIC,sBAAa,EAAA,CAAA;AACvB,IAAM,MAAA,0BAAA,GAA6B,mBAAmB,CAAE,CAAA,cAAA,CAAA;AACxD,IAAM,MAAA,aAAA,GAAgBC,cAAQ,MAAM;AAClC,MAAA,MAAM,QACJ,GAAA,QAAA,IAAY,QAAW,GAAA,MAAA,CAAO,SAAS,CACnC,GAAA;AAAA,QACE,GAAG,MAAA,CAAO,KAAM,CAAA,CAAA,EAAG,QAAQ,CAAA;AAAA,QAC3B,0BAAA,CAA2B,MAAO,CAAA,MAAA,GAAS,QAAQ,CAAA;AAAA,OACrD,GACA,CAAC,GAAG,MAAM,CAAA,CAAA;AAChB,MAAA,MAAM,eAAe,KAAM,CAAA,QAAA,CAAS,MAAM,CAAA,CAAE,KAAK,GAAG,CAAA,CAAA;AACpD,MAAA,MAAM,KAAQ,GAAAC,eAAA,CAAW,MAAM,CAAA,CAAE,cAAc,YAAY,CAAA,CAAA;AAE3D,MAAA,OAAO,KAAM,CAAA,GAAA;AAAA,QAAI,CAAC,SAChB,IAAK,CAAA,IAAA,KAAS,YAAY,QAAS,CAAA,KAAA,KAAU,IAAK,CAAA,KAAA;AAAA,OACpD,CAAA;AAAA,OACC,CAAC,0BAAA,EAA4B,MAAQ,EAAA,QAAA,EAAU,MAAM,CAAC,CAAA,CAAA;AAEzD,IACE,uBAAAC,cAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAWC,KAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,QACjC,GAAG,KAAA;AAAA,QACJ,GAAK,EAAA,YAAA;AAAA,QAEJ,QAAA,EAAA,aAAA;AAAA,OAAA;AAAA,KACH,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { Slot } from 'radix-ui';
|
|
2
|
+
import { Slot } from '@radix-ui/react-slot';
|
|
3
3
|
import { forwardRef, useMemo } from 'react';
|
|
4
4
|
import { useOverrides } from '../../overrides.js';
|
|
5
5
|
import { cn } from '../../utils/cn.js';
|
|
@@ -7,7 +7,7 @@ import { listFormat } from '../../utils/intl.js';
|
|
|
7
7
|
|
|
8
8
|
const List = forwardRef(
|
|
9
9
|
({ values, formatRemaining, truncate, locale, className, asChild, ...props }, forwardedRef) => {
|
|
10
|
-
const Component = asChild ? Slot
|
|
10
|
+
const Component = asChild ? Slot : "span";
|
|
11
11
|
const $ = useOverrides();
|
|
12
12
|
const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;
|
|
13
13
|
const formattedList = useMemo(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"List.js","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot
|
|
1
|
+
{"version":3,"file":"List.js","sources":["../../../src/components/internal/List.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport type { ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport type { ComponentPropsWithSlot } from \"../../types\";\nimport { cn } from \"../../utils/cn\";\nimport { listFormat } from \"../../utils/intl\";\n\nexport interface ListProps extends ComponentPropsWithSlot<\"span\"> {\n values: ReactNode[];\n formatRemaining?: (amount: number) => string;\n truncate?: number;\n locale?: string;\n}\n\nexport const List = forwardRef<HTMLSpanElement, ListProps>(\n (\n { values, formatRemaining, truncate, locale, className, asChild, ...props },\n forwardedRef\n ) => {\n const Component = asChild ? Slot : \"span\";\n const $ = useOverrides();\n const formatRemainingWithDefault = formatRemaining ?? $.LIST_REMAINING;\n const formattedList = useMemo(() => {\n const elements =\n truncate && truncate < values.length - 1\n ? [\n ...values.slice(0, truncate),\n formatRemainingWithDefault(values.length - truncate),\n ]\n : [...values];\n const placeholders = Array(elements.length).fill(\".\");\n const parts = listFormat(locale).formatToParts(placeholders);\n\n return parts.map((part) =>\n part.type === \"element\" ? elements.shift() : part.value\n );\n }, [formatRemainingWithDefault, locale, truncate, values]);\n\n return (\n <Component\n className={cn(\"lb-list\", className)}\n {...props}\n ref={forwardedRef}\n >\n {formattedList}\n </Component>\n );\n }\n);\n"],"names":[],"mappings":";;;;;;;AAgBO,MAAM,IAAO,GAAA,UAAA;AAAA,EAClB,CACE,EAAE,MAAA,EAAQ,eAAiB,EAAA,QAAA,EAAU,MAAQ,EAAA,SAAA,EAAW,OAAS,EAAA,GAAG,KAAM,EAAA,EAC1E,YACG,KAAA;AACH,IAAM,MAAA,SAAA,GAAY,UAAU,IAAO,GAAA,MAAA,CAAA;AACnC,IAAA,MAAM,IAAI,YAAa,EAAA,CAAA;AACvB,IAAM,MAAA,0BAAA,GAA6B,mBAAmB,CAAE,CAAA,cAAA,CAAA;AACxD,IAAM,MAAA,aAAA,GAAgB,QAAQ,MAAM;AAClC,MAAA,MAAM,QACJ,GAAA,QAAA,IAAY,QAAW,GAAA,MAAA,CAAO,SAAS,CACnC,GAAA;AAAA,QACE,GAAG,MAAA,CAAO,KAAM,CAAA,CAAA,EAAG,QAAQ,CAAA;AAAA,QAC3B,0BAAA,CAA2B,MAAO,CAAA,MAAA,GAAS,QAAQ,CAAA;AAAA,OACrD,GACA,CAAC,GAAG,MAAM,CAAA,CAAA;AAChB,MAAA,MAAM,eAAe,KAAM,CAAA,QAAA,CAAS,MAAM,CAAA,CAAE,KAAK,GAAG,CAAA,CAAA;AACpD,MAAA,MAAM,KAAQ,GAAA,UAAA,CAAW,MAAM,CAAA,CAAE,cAAc,YAAY,CAAA,CAAA;AAE3D,MAAA,OAAO,KAAM,CAAA,GAAA;AAAA,QAAI,CAAC,SAChB,IAAK,CAAA,IAAA,KAAS,YAAY,QAAS,CAAA,KAAA,KAAU,IAAK,CAAA,KAAA;AAAA,OACpD,CAAA;AAAA,OACC,CAAC,0BAAA,EAA4B,MAAQ,EAAA,QAAA,EAAU,MAAM,CAAC,CAAA,CAAA;AAEzD,IACE,uBAAA,GAAA;AAAA,MAAC,SAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,QACjC,GAAG,KAAA;AAAA,QACJ,GAAK,EAAA,YAAA;AAAA,QAEJ,QAAA,EAAA,aAAA;AAAA,OAAA;AAAA,KACH,CAAA;AAAA,GAEJ;AACF;;;;"}
|
|
@@ -2,13 +2,32 @@
|
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
-
var
|
|
5
|
+
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
9
|
var cn = require('../../utils/cn.cjs');
|
|
10
10
|
var isApple = require('../../utils/is-apple.cjs');
|
|
11
11
|
|
|
12
|
+
function _interopNamespaceDefault(e) {
|
|
13
|
+
var n = Object.create(null);
|
|
14
|
+
if (e) {
|
|
15
|
+
Object.keys(e).forEach(function (k) {
|
|
16
|
+
if (k !== 'default') {
|
|
17
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
18
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () { return e[k]; }
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
}
|
|
25
|
+
n.default = e;
|
|
26
|
+
return Object.freeze(n);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespaceDefault(TooltipPrimitive);
|
|
30
|
+
|
|
12
31
|
|
|
13
32
|
const ALT_KEY = { title: "Alt", key: "\u2325" };
|
|
14
33
|
const COMMAND_KEY = { title: "Command", key: "\u2318" };
|
|
@@ -50,10 +69,10 @@ function getShortcutKbdFromKeymap(keymap) {
|
|
|
50
69
|
const Tooltip = react.forwardRef(
|
|
51
70
|
({ children, content, multiline, className, ...props }, forwardedRef) => {
|
|
52
71
|
const { portalContainer } = config.useLiveblocksUiConfig();
|
|
53
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
54
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
55
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
56
|
-
|
|
72
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(TooltipPrimitive__namespace.Root, { disableHoverableContent: true, children: [
|
|
73
|
+
/* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Trigger, { asChild: true, ref: forwardedRef, children }),
|
|
74
|
+
/* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive__namespace.Portal, { container: portalContainer, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
75
|
+
TooltipPrimitive__namespace.Content,
|
|
57
76
|
{
|
|
58
77
|
className: cn.cn(
|
|
59
78
|
"lb-root lb-portal lb-tooltip",
|
|
@@ -92,9 +111,11 @@ function ShortcutTooltipKey({ name, ...props }) {
|
|
|
92
111
|
const { title, key } = react.useMemo(() => KEYS[name]?.(), [name]);
|
|
93
112
|
return /* @__PURE__ */ jsxRuntime.jsx("abbr", { title, ...props, children: key });
|
|
94
113
|
}
|
|
95
|
-
const TooltipProvider = radixUi.Tooltip.Provider;
|
|
96
114
|
|
|
115
|
+
Object.defineProperty(exports, 'TooltipProvider', {
|
|
116
|
+
enumerable: true,
|
|
117
|
+
get: function () { return TooltipPrimitive.TooltipProvider; }
|
|
118
|
+
});
|
|
97
119
|
exports.ShortcutTooltip = ShortcutTooltip;
|
|
98
120
|
exports.Tooltip = Tooltip;
|
|
99
|
-
exports.TooltipProvider = TooltipProvider;
|
|
100
121
|
//# sourceMappingURL=Tooltip.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport
|
|
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;AAGM;AAEA;AACE;AACE;AAAC;AAAA;AAEO;AAAA;AADD;AAEP;AAIJ;AAA8B;AAItC;AAEO;AAAgB;AAEnB;AAEA;AAEI;AAEA;AAEE;AAAkB;AAAjB;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AAAA;AAEL;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACE;AAAC;AAAA;AAGM;AAAA;AAEmD;AAEtD;AAEE;AACC;AAEJ;AAAA;AAGP;AAEA;AACE;AAEA;AAKF;;;;;;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
|
|
3
|
-
import
|
|
3
|
+
import * as TooltipPrimitive from '@radix-ui/react-tooltip';
|
|
4
|
+
export { TooltipProvider } from '@radix-ui/react-tooltip';
|
|
4
5
|
import { forwardRef, useMemo } from 'react';
|
|
5
6
|
import { useLiveblocksUiConfig } from '../../config.js';
|
|
6
7
|
import { FLOATING_ELEMENT_SIDE_OFFSET, FLOATING_ELEMENT_COLLISION_PADDING } from '../../constants.js';
|
|
@@ -48,10 +49,10 @@ function getShortcutKbdFromKeymap(keymap) {
|
|
|
48
49
|
const Tooltip = forwardRef(
|
|
49
50
|
({ children, content, multiline, className, ...props }, forwardedRef) => {
|
|
50
51
|
const { portalContainer } = useLiveblocksUiConfig();
|
|
51
|
-
return /* @__PURE__ */ jsxs(
|
|
52
|
-
/* @__PURE__ */ jsx(
|
|
53
|
-
/* @__PURE__ */ jsx(
|
|
54
|
-
|
|
52
|
+
return /* @__PURE__ */ jsxs(TooltipPrimitive.Root, { disableHoverableContent: true, children: [
|
|
53
|
+
/* @__PURE__ */ jsx(TooltipPrimitive.Trigger, { asChild: true, ref: forwardedRef, children }),
|
|
54
|
+
/* @__PURE__ */ jsx(TooltipPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ jsx(
|
|
55
|
+
TooltipPrimitive.Content,
|
|
55
56
|
{
|
|
56
57
|
className: cn(
|
|
57
58
|
"lb-root lb-portal lb-tooltip",
|
|
@@ -90,7 +91,6 @@ function ShortcutTooltipKey({ name, ...props }) {
|
|
|
90
91
|
const { title, key } = useMemo(() => KEYS[name]?.(), [name]);
|
|
91
92
|
return /* @__PURE__ */ jsx("abbr", { title, ...props, children: key });
|
|
92
93
|
}
|
|
93
|
-
const TooltipProvider = Tooltip$1.Provider;
|
|
94
94
|
|
|
95
|
-
export { ShortcutTooltip, Tooltip
|
|
95
|
+
export { ShortcutTooltip, Tooltip };
|
|
96
96
|
//# sourceMappingURL=Tooltip.js.map
|