@liveblocks/react-ui 2.21.0-emails3 → 2.21.0

package/dist/components/internal/EmojiPicker.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"EmojiPicker.cjs","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":"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"}
+{"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 } 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 { classNames } from \"../../utils/class-names\";\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\n      className={classNames(\"lb-emoji-picker-emoji\", className)}\n      {...props}\n    >\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={classNames(\"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={classNames(\"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 } = 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    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            asChild\n          >\n            <EmojiPickerPrimitive.Root\n              onEmojiSelect={handleEmojiSelect}\n              locale={$.locale as Locale}\n              emojiVersion={15.1}\n              columns={10}\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","classNames","Emoji","forwardRef","useState","useLiveblocksUIConfig","useOverrides","useCallback","isOpen","jsxs","PopoverPrimitive","FLOATING_ELEMENT_SIDE_OFFSET","FLOATING_ELEMENT_COLLISION_PADDING","EmojiPickerPrimitive","SearchIcon","SpinnerIcon","Fragment","Tooltip"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,SAAS,oBAAqB,CAAA;AAAA,EAC5B,KAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAA8B,EAAA;AAC5B,EAAA,uBACGA,cAAA,CAAA,QAAA,EAAA;AAAA,IACC,SAAA,EAAWC,qBAAW,CAAA,uBAAA,EAAyB,SAAS,CAAA;AAAA,IACvD,GAAG,KAAA;AAAA,IAEJ,QAAC,kBAAAD,cAAA,CAAAE,WAAA,EAAA;AAAA,MAAM,OAAO,KAAM,CAAA,KAAA;AAAA,KAAO,CAAA;AAAA,GAC7B,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,kBAAmB,CAAA;AAAA,EAC1B,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAA4B,EAAA;AAC1B,EAAA,uBACGF,cAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAA,EAAWC,qBAAW,CAAA,qBAAA,EAAuB,SAAS,CAAA;AAAA,IAAI,GAAG,KAAA;AAAA,IAC/D,QAAA;AAAA,GACH,CAAA,CAAA;AAEJ,CAAA;AAEA,SAAS,6BAA8B,CAAA;AAAA,EACrC,QAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,KAAA;AACL,CAAuC,EAAA;AACrC,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,MACb,QAAS,EAAA,QAAA,CAAA,KAAA;AAAA,KACZ,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ,CAAA;AAEO,MAAM,WAAc,GAAAG,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,IAAIC,sBAAa,EAAA,CAAA;AAEvB,IAAA,MAAM,gBAAmB,GAAAC,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,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,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,wBACDV,cAAA,CAACU,4BAAiB,MAAjB,EAAA;AAAA,UAAwB,SAAW,EAAA,eAAA;AAAA,UAClC,QAAA,kBAAAV,cAAA,CAACU,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,EAAAX,qBAAA;AAAA,cACT,gDAAA;AAAA,cACA,SAAA;AAAA,aACF;AAAA,YACC,GAAG,KAAA;AAAA,YACJ,GAAK,EAAA,YAAA;AAAA,YACL,OAAO,EAAA,IAAA;AAAA,YAEP,QAAA,kBAAAQ,eAAA,CAACI,sBAAqB,IAArB,EAAA;AAAA,cACC,aAAe,EAAA,iBAAA;AAAA,cACf,QAAQ,CAAE,CAAA,MAAA;AAAA,cACV,YAAc,EAAA,IAAA;AAAA,cACd,OAAS,EAAA,EAAA;AAAA,cAET,QAAA,EAAA;AAAA,gCAACb,cAAA,CAAA,KAAA,EAAA;AAAA,kBAAI,SAAU,EAAA,wBAAA;AAAA,kBACb,QAAC,kBAAAS,eAAA,CAAA,KAAA,EAAA;AAAA,oBAAI,SAAU,EAAA,kCAAA;AAAA,oBACb,QAAA,EAAA;AAAA,sCAAAT,cAAA,CAACa,sBAAqB,MAArB,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,gCACAL,eAAA,CAACI,sBAAqB,QAArB,EAAA;AAAA,kBAA8B,SAAU,EAAA,yBAAA;AAAA,kBACvC,QAAA,EAAA;AAAA,oCAAAb,cAAA,CAACa,sBAAqB,OAArB,EAAA;AAAA,sBAA6B,SAAU,EAAA,oCAAA;AAAA,sBACtC,yCAACE,mBAAY,EAAA,EAAA,CAAA;AAAA,qBACf,CAAA;AAAA,oCACAf,cAAA,CAACa,sBAAqB,KAArB,EAAA;AAAA,sBAA2B,SAAU,EAAA,gCAAA;AAAA,sBACnC,QAAE,EAAA,CAAA,CAAA,kBAAA;AAAA,qBACL,CAAA;AAAA,oCACAb,cAAA,CAACa,sBAAqB,IAArB,EAAA;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,qBACF,CAAA;AAAA,mBAAA;AAAA,iBACF,CAAA;AAAA,gCACCJ,eAAA,CAAA,KAAA,EAAA;AAAA,kBAAI,SAAU,EAAA,wBAAA;AAAA,kBACb,QAAA,EAAA;AAAA,oCAAAT,cAAA,CAACa,sBAAqB,WAArB,EAAA;AAAA,sBACE,QAAC,EAAA,CAAA,EAAE,KAAM,EAAA,KACR,KACE,mBAAAJ,eAAA,CAAAO,mBAAA,EAAA;AAAA,wBACE,QAAA,EAAA;AAAA,0CAAChB,cAAA,CAAA,KAAA,EAAA;AAAA,4BAAI,SAAU,EAAA,8BAAA;AAAA,4BACZ,QAAM,EAAA,KAAA,CAAA,KAAA;AAAA,2BACT,CAAA;AAAA,0CACCA,cAAA,CAAA,MAAA,EAAA;AAAA,4BAAK,SAAU,EAAA,oCAAA;AAAA,4BACb,QAAM,EAAA,KAAA,CAAA,KAAA;AAAA,2BACT,CAAA;AAAA,yBAAA;AAAA,uBACF,oBAECA,cAAA,CAAA,MAAA,EAAA;AAAA,wBAAK,SAAU,EAAA,mFAAA;AAAA,wBAAoF,QAAA,EAAA,uBAAA;AAAA,uBAEpG,CAAA;AAAA,qBAGN,CAAA;AAAA,oCACCA,cAAA,CAAAiB,eAAA,EAAA;AAAA,sBAAQ,SAAS,CAAE,CAAA,6BAAA;AAAA,sBAClB,QAAA,kBAAAjB,cAAA,CAACa,sBAAqB,gBAArB,EAAA;AAAA,wBAAsC,SAAU,EAAA,8CAAA;AAAA,uBAA+C,CAAA;AAAA,qBAClG,CAAA;AAAA,mBAAA;AAAA,iBACF,CAAA;AAAA,eAAA;AAAA,aACF,CAAA;AAAA,WACF,CAAA;AAAA,SACF,CAAA;AAAA,OAAA;AAAA,KACF,CAAA,CAAA;AAAA,GAEJ;AACF;;;;;;;;"}

package/dist/components/internal/EmojiPicker.js

@@ -1,50 +1,42 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 export { PopoverTrigger as EmojiPickerTrigger } from '@radix-ui/react-popover';
-import { useMemo, forwardRef, useState, useCallback } from 'react';
+import { EmojiPicker as EmojiPicker$1 } from 'frimousse';
+import { forwardRef, useState, useCallback } from 'react';
 import { useLiveblocksUIConfig } from '../../config.js';
 import { FLOATING_ELEMENT_SIDE_OFFSET, FLOATING_ELEMENT_COLLISION_PADDING } from '../../constants.js';
 import { SearchIcon } from '../../icons/Search.js';
 import { SpinnerIcon } from '../../icons/Spinner.js';
 import { useOverrides } from '../../overrides.js';
-import { Root as EmojiPickerRoot, Search as EmojiPickerSearch, Content as EmojiPickerContent } from '../../primitives/EmojiPicker/index.js';
 import { classNames } from '../../utils/class-names.js';
 import { Emoji } from './Emoji.js';
+import { Tooltip } from './Tooltip.js';
 
-function EmojiPickerLoading({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx("div", {
-    className: classNames("lb-loading lb-emoji-picker-loading", className),
-    ...props,
-    children: /* @__PURE__ */ jsx(SpinnerIcon, {})
-  });
-}
-function EmojiPickerEmpty({
+function EmojiPickerListEmoji({
+  emoji,
   className,
   ...props
 }) {
-  const $ = useOverrides();
-  return /* @__PURE__ */ jsx("div", {
-    className: classNames("lb-empty lb-emoji-picker-empty", className),
+  return /* @__PURE__ */ jsx("button", {
+    className: classNames("lb-emoji-picker-emoji", className),
     ...props,
-    children: $.EMOJI_PICKER_EMPTY
+    children: /* @__PURE__ */ jsx(Emoji, {
+      emoji: emoji.emoji
+    })
   });
 }
-function EmojiPickerError({
-  error,
+function EmojiPickerListRow({
+  children,
   className,
   ...props
 }) {
-  const $ = useOverrides();
   return /* @__PURE__ */ jsx("div", {
-    className: classNames("lb-error lb-emoji-picker-error", className),
+    className: classNames("lb-emoji-picker-row", className),
     ...props,
-    children: $.EMOJI_PICKER_ERROR(error)
+    children
   });
 }
-function EmojiPickerCategoryHeader({
+function EmojiPickerListCategoryHeader({
   category,
   className,
   ...props
@@ -54,53 +46,7 @@ function EmojiPickerCategoryHeader({
     ...props,
     children: /* @__PURE__ */ jsx("span", {
       className: "lb-emoji-picker-category-header-title",
-      children: category
-    })
-  });
-}
-function EmojiPickerGrid({
-  children,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx("div", {
-    className: classNames("lb-emoji-picker-grid", className),
-    ...props,
-    children
-  });
-}
-function EmojiPickerRow({
-  attributes,
-  children,
-  className,
-  ...props
-}) {
-  const isFirstRow = useMemo(
-    () => attributes.categoryRowIndex === 0,
-    [attributes.categoryRowIndex]
-  );
-  const isLastRow = useMemo(
-    () => attributes.categoryRowIndex === attributes.categoryRowsCount - 1,
-    [attributes.categoryRowIndex, attributes.categoryRowsCount]
-  );
-  return /* @__PURE__ */ jsx("div", {
-    className: classNames("lb-emoji-picker-row", className),
-    "data-first": isFirstRow ? "" : void 0,
-    "data-last": isLastRow ? "" : void 0,
-    ...props,
-    children
-  });
-}
-function EmojiPickerEmoji({
-  emoji,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx("button", {
-    className: classNames("lb-emoji-picker-emoji", className),
-    ...props,
-    children: /* @__PURE__ */ jsx(Emoji, {
-      emoji
+      children: category.label
     })
   });
 }
@@ -117,7 +63,7 @@ const EmojiPicker = forwardRef(
       [onOpenChange]
     );
     const handleEmojiSelect = useCallback(
-      (emoji) => {
+      ({ emoji }) => {
         setOpen(false);
         onEmojiSelect?.(emoji);
       },
@@ -141,16 +87,19 @@ const EmojiPicker = forwardRef(
             ),
             ...props,
             ref: forwardedRef,
-            children: /* @__PURE__ */ jsxs(EmojiPickerRoot, {
+            asChild: true,
+            children: /* @__PURE__ */ jsxs(EmojiPicker$1.Root, {
               onEmojiSelect: handleEmojiSelect,
               locale: $.locale,
+              emojiVersion: 15.1,
+              columns: 10,
               children: [
                 /* @__PURE__ */ jsx("div", {
                   className: "lb-emoji-picker-header",
                   children: /* @__PURE__ */ jsxs("div", {
                     className: "lb-emoji-picker-search-container",
                     children: [
-                      /* @__PURE__ */ jsx(EmojiPickerSearch, {
+                      /* @__PURE__ */ jsx(EmojiPicker$1.Search, {
                         className: "lb-emoji-picker-search",
                         placeholder: $.EMOJI_PICKER_SEARCH_PLACEHOLDER,
                         autoFocus: true
@@ -159,17 +108,54 @@ const EmojiPicker = forwardRef(
                     ]
                   })
                 }),
-                /* @__PURE__ */ jsx(EmojiPickerContent, {
+                /* @__PURE__ */ jsxs(EmojiPicker$1.Viewport, {
                   className: "lb-emoji-picker-content",
-                  components: {
-                    Loading: EmojiPickerLoading,
-                    Empty: EmojiPickerEmpty,
-                    Error: EmojiPickerError,
-                    CategoryHeader: EmojiPickerCategoryHeader,
-                    Grid: EmojiPickerGrid,
-                    Row: EmojiPickerRow,
-                    Emoji: EmojiPickerEmoji
-                  }
+                  children: [
+                    /* @__PURE__ */ jsx(EmojiPicker$1.Loading, {
+                      className: "lb-loading lb-emoji-picker-loading",
+                      children: /* @__PURE__ */ jsx(SpinnerIcon, {})
+                    }),
+                    /* @__PURE__ */ jsx(EmojiPicker$1.Empty, {
+                      className: "lb-empty lb-emoji-picker-empty",
+                      children: $.EMOJI_PICKER_EMPTY
+                    }),
+                    /* @__PURE__ */ jsx(EmojiPicker$1.List, {
+                      className: "lb-emoji-picker-list",
+                      components: {
+                        CategoryHeader: EmojiPickerListCategoryHeader,
+                        Row: EmojiPickerListRow,
+                        Emoji: EmojiPickerListEmoji
+                      }
+                    })
+                  ]
+                }),
+                /* @__PURE__ */ jsxs("div", {
+                  className: "lb-emoji-picker-footer",
+                  children: [
+                    /* @__PURE__ */ jsx(EmojiPicker$1.ActiveEmoji, {
+                      children: ({ emoji }) => emoji ? /* @__PURE__ */ jsxs(Fragment, {
+                        children: [
+                          /* @__PURE__ */ jsx("div", {
+                            className: "lb-emoji-picker-active-emoji",
+                            children: emoji.emoji
+                          }),
+                          /* @__PURE__ */ jsx("span", {
+                            className: "lb-emoji-picker-active-emoji-label",
+                            children: emoji.label
+                          })
+                        ]
+                      }) : /* @__PURE__ */ jsx("span", {
+                        className: "lb-emoji-picker-active-emoji-label lb-emoji-picker-active-emoji-label-placeholder",
+                        children: "Select an emoji\u2026"
+                      })
+                    }),
+                    /* @__PURE__ */ jsx(Tooltip, {
+                      content: $.EMOJI_PICKER_CHANGE_SKIN_TONE,
+                      children: /* @__PURE__ */ jsx(EmojiPicker$1.SkinToneSelector, {
+                        className: "lb-button lb-emoji-picker-skin-tone-selector"
+                      })
+                    })
+                  ]
                 })
               ]
             })

package/dist/components/internal/EmojiPicker.js.map

@@ -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 />\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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"}
+{"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 } 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 { classNames } from \"../../utils/class-names\";\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\n      className={classNames(\"lb-emoji-picker-emoji\", className)}\n      {...props}\n    >\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={classNames(\"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={classNames(\"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 } = 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    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            asChild\n          >\n            <EmojiPickerPrimitive.Root\n              onEmojiSelect={handleEmojiSelect}\n              locale={$.locale as Locale}\n              emojiVersion={15.1}\n              columns={10}\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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"}

package/dist/components/internal/Room.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Room.cjs","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n  roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n  const { info, isLoading } = useRoomInfo(roomId);\n  const resolvedRoomName = useMemo(() => {\n    return info?.name ?? roomId;\n  }, [info?.name, roomId]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-room\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedRoomName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAAA;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
+{"version":3,"file":"Room.cjs","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n  roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n  const { info, isLoading } = useRoomInfo(roomId);\n  const resolvedRoomName = useMemo(() => {\n    return info?.name ?? roomId;\n  }, [info?.name, roomId]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-room\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedRoomName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}

package/dist/components/internal/Room.js.map

@@ -1 +1 @@
-{"version":3,"file":"Room.js","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n  roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n  const { info, isLoading } = useRoomInfo(roomId);\n  const resolvedRoomName = useMemo(() => {\n    return info?.name ?? roomId;\n  }, [info?.name, roomId]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-room\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedRoomName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAAA;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
+{"version":3,"file":"Room.js","sources":["../../../src/components/internal/Room.tsx"],"sourcesContent":["\"use client\";\n\nimport { useRoomInfo } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface RoomProps extends ComponentProps<\"span\"> {\n  roomId: string;\n}\n\nexport function Room({ roomId, className, ...props }: RoomProps) {\n  const { info, isLoading } = useRoomInfo(roomId);\n  const resolvedRoomName = useMemo(() => {\n    return info?.name ?? roomId;\n  }, [info?.name, roomId]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-room\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedRoomName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAYO;AACL;AACA;AACE;AAAqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}

package/dist/components/internal/Tooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { classNames } from \"../../utils/class-names\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n  alt: () => ALT_KEY,\n  mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n  control: () => CONTROL_KEY,\n  ctrl: () => CONTROL_KEY,\n  command: () => COMMAND_KEY,\n  cmd: () => COMMAND_KEY,\n  shift: () => SHIFT_KEY,\n  enter: () => ENTER_KEY,\n  \" \": () => SPACE_KEY,\n  space: () => SPACE_KEY,\n  escape: () => ESCAPE_KEY,\n  esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n  extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n    Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n  content: ReactNode;\n  multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n  shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n  name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n  const keys = keymap.split(\"-\");\n\n  return (\n    <>\n      {keys.map((key, index) => {\n        const lowerKey = key.toLowerCase();\n\n        if (lowerKey in KEYS) {\n          return (\n            <ShortcutTooltipKey\n              key={index}\n              name={lowerKey as keyof typeof KEYS}\n            />\n          );\n        }\n\n        return <span key={index}>{key}</span>;\n      })}\n    </>\n  );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n  ({ children, content, multiline, className, ...props }, forwardedRef) => {\n    const { portalContainer } = useLiveblocksUIConfig();\n\n    return (\n      <TooltipPrimitive.Root disableHoverableContent>\n        <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipPrimitive.Portal container={portalContainer}>\n          <TooltipPrimitive.Content\n            className={classNames(\n              \"lb-root lb-portal lb-tooltip\",\n              multiline && \"lb-tooltip:multiline\",\n              className\n            )}\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            {...props}\n          >\n            {content}\n          </TooltipPrimitive.Content>\n        </TooltipPrimitive.Portal>\n      </TooltipPrimitive.Root>\n    );\n  }\n);\n\nexport const ShortcutTooltip = forwardRef<\n  HTMLButtonElement,\n  ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n  const shortcutKbd = useMemo(() => {\n    return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n  }, [shortcut]);\n\n  return (\n    <Tooltip\n      content={\n        <>\n          {content}\n          {shortcutKbd && (\n            <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n          )}\n        </>\n      }\n      {...props}\n      ref={forwardedRef}\n    >\n      {children}\n    </Tooltip>\n  );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n  const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n  return (\n    <abbr title={title} {...props}>\n      {key}\n    </abbr>\n  );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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;;;;;;;"}
+{"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { classNames } from \"../../utils/class-names\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n  alt: () => ALT_KEY,\n  mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n  control: () => CONTROL_KEY,\n  ctrl: () => CONTROL_KEY,\n  command: () => COMMAND_KEY,\n  cmd: () => COMMAND_KEY,\n  shift: () => SHIFT_KEY,\n  enter: () => ENTER_KEY,\n  \" \": () => SPACE_KEY,\n  space: () => SPACE_KEY,\n  escape: () => ESCAPE_KEY,\n  esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n  extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n    Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n  content: ReactNode;\n  multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n  shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n  name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n  const keys = keymap.split(\"-\");\n\n  return (\n    <>\n      {keys.map((key, index) => {\n        const lowerKey = key.toLowerCase();\n\n        if (lowerKey in KEYS) {\n          return (\n            <ShortcutTooltipKey\n              key={index}\n              name={lowerKey as keyof typeof KEYS}\n            />\n          );\n        }\n\n        return <span key={index}>{key}</span>;\n      })}\n    </>\n  );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n  ({ children, content, multiline, className, ...props }, forwardedRef) => {\n    const { portalContainer } = useLiveblocksUIConfig();\n\n    return (\n      <TooltipPrimitive.Root disableHoverableContent>\n        <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipPrimitive.Portal container={portalContainer}>\n          <TooltipPrimitive.Content\n            className={classNames(\n              \"lb-root lb-portal lb-tooltip\",\n              multiline && \"lb-tooltip:multiline\",\n              className\n            )}\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            {...props}\n          >\n            {content}\n          </TooltipPrimitive.Content>\n        </TooltipPrimitive.Portal>\n      </TooltipPrimitive.Root>\n    );\n  }\n);\n\nexport const ShortcutTooltip = forwardRef<\n  HTMLButtonElement,\n  ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n  const shortcutKbd = useMemo(() => {\n    return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n  }, [shortcut]);\n\n  return (\n    <Tooltip\n      content={\n        <>\n          {content}\n          {shortcutKbd && (\n            <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n          )}\n        </>\n      }\n      {...props}\n      ref={forwardedRef}\n    >\n      {children}\n    </Tooltip>\n  );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n  const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n  return (\n    <abbr title={title} {...props}>\n      {key}\n    </abbr>\n  );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAa;AACA;AAC2B;AACvB;AACH;AACG;AACJ;AACE;AACA;AACF;AACE;AACC;AAEhB;AAiBA;AACE;AAEA;AACE;AAEI;AAEA;AACE;AACG;AAEO;AACR;AAIJ;AAAQ;AAAkB;AAAI;AAC/B;AAGP;AAEO;AAAgB;AAEnB;AAEA;AACG;AAA6C;AAC5C;AAAC;AAAgC;AAAM;AACpC;AACH;AACC;AAAmC;AACjC;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AACH;AACF;AAAA;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACG;AAEG;AACG;AAAA;AAEE;AAAc;AAAuB;AAAY;AAAA;AAEtD;AAEE;AACC;AAEJ;AAGP;AAEA;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;;;;;;"}

package/dist/components/internal/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { classNames } from \"../../utils/class-names\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n  alt: () => ALT_KEY,\n  mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n  control: () => CONTROL_KEY,\n  ctrl: () => CONTROL_KEY,\n  command: () => COMMAND_KEY,\n  cmd: () => COMMAND_KEY,\n  shift: () => SHIFT_KEY,\n  enter: () => ENTER_KEY,\n  \" \": () => SPACE_KEY,\n  space: () => SPACE_KEY,\n  escape: () => ESCAPE_KEY,\n  esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n  extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n    Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n  content: ReactNode;\n  multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n  shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n  name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n  const keys = keymap.split(\"-\");\n\n  return (\n    <>\n      {keys.map((key, index) => {\n        const lowerKey = key.toLowerCase();\n\n        if (lowerKey in KEYS) {\n          return (\n            <ShortcutTooltipKey\n              key={index}\n              name={lowerKey as keyof typeof KEYS}\n            />\n          );\n        }\n\n        return <span key={index}>{key}</span>;\n      })}\n    </>\n  );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n  ({ children, content, multiline, className, ...props }, forwardedRef) => {\n    const { portalContainer } = useLiveblocksUIConfig();\n\n    return (\n      <TooltipPrimitive.Root disableHoverableContent>\n        <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipPrimitive.Portal container={portalContainer}>\n          <TooltipPrimitive.Content\n            className={classNames(\n              \"lb-root lb-portal lb-tooltip\",\n              multiline && \"lb-tooltip:multiline\",\n              className\n            )}\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            {...props}\n          >\n            {content}\n          </TooltipPrimitive.Content>\n        </TooltipPrimitive.Portal>\n      </TooltipPrimitive.Root>\n    );\n  }\n);\n\nexport const ShortcutTooltip = forwardRef<\n  HTMLButtonElement,\n  ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n  const shortcutKbd = useMemo(() => {\n    return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n  }, [shortcut]);\n\n  return (\n    <Tooltip\n      content={\n        <>\n          {content}\n          {shortcutKbd && (\n            <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n          )}\n        </>\n      }\n      {...props}\n      ref={forwardedRef}\n    >\n      {children}\n    </Tooltip>\n  );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n  const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n  return (\n    <abbr title={title} {...props}>\n      {key}\n    </abbr>\n  );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;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;;"}
+{"version":3,"file":"Tooltip.js","sources":["../../../src/components/internal/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef, useMemo } from \"react\";\n\nimport { useLiveblocksUIConfig } from \"../../config\";\nimport {\n  FLOATING_ELEMENT_COLLISION_PADDING,\n  FLOATING_ELEMENT_SIDE_OFFSET,\n} from \"../../constants\";\nimport { classNames } from \"../../utils/class-names\";\nimport { isApple } from \"../../utils/is-apple\";\n\nconst ALT_KEY = { title: \"Alt\", key: \"⌥\" };\nconst COMMAND_KEY = { title: \"Command\", key: \"⌘\" };\nconst CONTROL_KEY = { title: \"Ctrl\", key: \"⌃\" };\nconst SHIFT_KEY = { title: \"Shift\", key: \"⇧\" };\nconst ENTER_KEY = { title: \"Enter\", key: \"⏎\" };\nconst SPACE_KEY = { title: \"Space\", key: \"␣\" };\nconst ESCAPE_KEY = { title: \"Escape\", key: \"⎋\" };\n\nconst KEYS = {\n  alt: () => ALT_KEY,\n  mod: () => (isApple() ? COMMAND_KEY : CONTROL_KEY),\n  control: () => CONTROL_KEY,\n  ctrl: () => CONTROL_KEY,\n  command: () => COMMAND_KEY,\n  cmd: () => COMMAND_KEY,\n  shift: () => SHIFT_KEY,\n  enter: () => ENTER_KEY,\n  \" \": () => SPACE_KEY,\n  space: () => SPACE_KEY,\n  escape: () => ESCAPE_KEY,\n  esc: () => ESCAPE_KEY,\n} as const;\n\nexport interface TooltipProps\n  extends Pick<TooltipPrimitive.TooltipTriggerProps, \"children\">,\n    Omit<TooltipPrimitive.TooltipContentProps, \"content\"> {\n  content: ReactNode;\n  multiline?: boolean;\n}\n\nexport interface ShortcutTooltipProps extends TooltipProps {\n  shortcut?: string;\n}\n\nexport interface ShortcutTooltipKeyProps extends ComponentProps<\"abbr\"> {\n  name: keyof typeof KEYS;\n}\n\nfunction getShortcutKbdFromKeymap(keymap: string) {\n  const keys = keymap.split(\"-\");\n\n  return (\n    <>\n      {keys.map((key, index) => {\n        const lowerKey = key.toLowerCase();\n\n        if (lowerKey in KEYS) {\n          return (\n            <ShortcutTooltipKey\n              key={index}\n              name={lowerKey as keyof typeof KEYS}\n            />\n          );\n        }\n\n        return <span key={index}>{key}</span>;\n      })}\n    </>\n  );\n}\n\nexport const Tooltip = forwardRef<HTMLButtonElement, TooltipProps>(\n  ({ children, content, multiline, className, ...props }, forwardedRef) => {\n    const { portalContainer } = useLiveblocksUIConfig();\n\n    return (\n      <TooltipPrimitive.Root disableHoverableContent>\n        <TooltipPrimitive.Trigger asChild ref={forwardedRef}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipPrimitive.Portal container={portalContainer}>\n          <TooltipPrimitive.Content\n            className={classNames(\n              \"lb-root lb-portal lb-tooltip\",\n              multiline && \"lb-tooltip:multiline\",\n              className\n            )}\n            side=\"top\"\n            align=\"center\"\n            sideOffset={FLOATING_ELEMENT_SIDE_OFFSET}\n            collisionPadding={FLOATING_ELEMENT_COLLISION_PADDING}\n            {...props}\n          >\n            {content}\n          </TooltipPrimitive.Content>\n        </TooltipPrimitive.Portal>\n      </TooltipPrimitive.Root>\n    );\n  }\n);\n\nexport const ShortcutTooltip = forwardRef<\n  HTMLButtonElement,\n  ShortcutTooltipProps\n>(({ children, content, shortcut, ...props }, forwardedRef) => {\n  const shortcutKbd = useMemo(() => {\n    return shortcut ? getShortcutKbdFromKeymap(shortcut) : null;\n  }, [shortcut]);\n\n  return (\n    <Tooltip\n      content={\n        <>\n          {content}\n          {shortcutKbd && (\n            <kbd className=\"lb-tooltip-shortcut\">{shortcutKbd}</kbd>\n          )}\n        </>\n      }\n      {...props}\n      ref={forwardedRef}\n    >\n      {children}\n    </Tooltip>\n  );\n});\n\nfunction ShortcutTooltipKey({ name, ...props }: ShortcutTooltipKeyProps) {\n  const { title, key } = useMemo(() => KEYS[name]?.(), [name]);\n\n  return (\n    <abbr title={title} {...props}>\n      {key}\n    </abbr>\n  );\n}\n\nexport { TooltipProvider } from \"@radix-ui/react-tooltip\";\n"],"names":[],"mappings":";;;;;;;;;;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAa;AACA;AAC2B;AACvB;AACH;AACG;AACJ;AACE;AACA;AACF;AACE;AACC;AAEhB;AAiBA;AACE;AAEA;AACE;AAEI;AAEA;AACE;AACG;AAEO;AACR;AAIJ;AAAQ;AAAkB;AAAI;AAC/B;AAGP;AAEO;AAAgB;AAEnB;AAEA;AACG;AAA6C;AAC5C;AAAC;AAAgC;AAAM;AACpC;AACH;AACC;AAAmC;AACjC;AACY;AACT;AACa;AACb;AACF;AACK;AACC;AACM;AACM;AACd;AAEH;AACH;AACF;AAAA;AACF;AAGN;AAEa;AAIX;AACE;AAAuD;AAGzD;AACG;AAEG;AACG;AAAA;AAEE;AAAc;AAAuB;AAAY;AAAA;AAEtD;AAEE;AACC;AAEJ;AAGP;AAEA;AACE;AAEA;AACG;AAAK;AAAkB;AACrB;AAGP;;"}

package/dist/components/internal/User.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"User.cjs","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    return replaceSelf && currentId === userId\n      ? $.USER_SELF\n      : (user?.name ?? $.USER_UNKNOWN);\n  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAAA;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
+{"version":3,"file":"User.cjs","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    return replaceSelf && currentId === userId\n      ? $.USER_SELF\n      : (user?.name ?? $.USER_UNKNOWN);\n  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}

package/dist/components/internal/User.js.map

@@ -1 +1 @@
-{"version":3,"file":"User.js","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    return replaceSelf && currentId === userId\n      ? $.USER_SELF\n      : (user?.name ?? $.USER_UNKNOWN);\n  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAAA;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}
+{"version":3,"file":"User.js","sources":["../../../src/components/internal/User.tsx"],"sourcesContent":["\"use client\";\n\nimport { useUser } from \"@liveblocks/react\";\nimport type { ComponentProps } from \"react\";\nimport { useMemo } from \"react\";\n\nimport { useOverrides } from \"../../overrides\";\nimport { useCurrentUserId } from \"../../shared\";\nimport { classNames } from \"../../utils/class-names\";\n\nexport interface UserProps extends ComponentProps<\"span\"> {\n  /**\n   * The user ID to display the user name for.\n   */\n  userId: string;\n\n  /**\n   * Whether to replace the user name with \"you\" ($.USER_SELF) for the current user.\n   */\n  replaceSelf?: boolean;\n}\n\nexport function User({ userId, replaceSelf, className, ...props }: UserProps) {\n  const currentId = useCurrentUserId();\n  const { user, isLoading } = useUser(userId);\n  const $ = useOverrides();\n  const resolvedUserName = useMemo(() => {\n    return replaceSelf && currentId === userId\n      ? $.USER_SELF\n      : (user?.name ?? $.USER_UNKNOWN);\n  }, [replaceSelf, currentId, userId, $.USER_SELF, $.USER_UNKNOWN, user?.name]);\n\n  return (\n    <span\n      className={classNames(\"lb-name lb-user\", className)}\n      data-loading={isLoading ? \"\" : undefined}\n      {...props}\n    >\n      {isLoading ? null : resolvedUserName}\n    </span>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AAsBO;AACL;AACA;AACA;AACA;AACE;AAEqB;AAGvB;AACG;AACmD;AACnB;AAC3B;AAEgB;AAG1B;;"}

package/dist/components.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"components.cjs","sources":["../src/components.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n  ComponentPropsWithoutRef,\n  ComponentType,\n  PropsWithChildren,\n} from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nexport interface GlobalComponents {\n  Anchor: ComponentType<ComponentPropsWithoutRef<\"a\">> | \"a\";\n}\n\nexport type Components = GlobalComponents;\n\ntype ComponentsProviderProps = PropsWithChildren<{\n  components?: Partial<Components>;\n}>;\n\nexport const defaultComponents: Components = {\n  Anchor: \"a\",\n};\n\nexport const ComponentsContext = createContext<Components | undefined>(\n  undefined\n);\n\nexport function useComponents(components?: Partial<Components>): Components {\n  const contextComponents = useContext(ComponentsContext);\n\n  return useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...components,\n    }),\n    [contextComponents, components]\n  );\n}\n\nexport function ComponentsProvider({\n  children,\n  components: providerComponents,\n}: ComponentsProviderProps) {\n  const contextComponents = useContext(ComponentsContext);\n  const components = useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...providerComponents,\n    }),\n    [contextComponents, providerComponents]\n  );\n\n  return (\n    <ComponentsContext.Provider value={components}>\n      {children}\n    </ComponentsContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAAA;AAmBO;AAAsC;AAE7C;AAEO;AAA0B;AAEjC;AAEO;AACL;AAEA;AAAO;AACE;AACF;AACA;AACA;AACL;AAC8B;AAElC;AAEO;AAA4B;AACjC;AAEF;AACE;AACA;AAAmB;AACV;AACF;AACA;AACA;AACL;AACsC;AAGxC;AACG;AAAkC;AAChC;AAGP;;;;;"}
+{"version":3,"file":"components.cjs","sources":["../src/components.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n  ComponentPropsWithoutRef,\n  ComponentType,\n  PropsWithChildren,\n} from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nexport interface GlobalComponents {\n  Anchor: ComponentType<ComponentPropsWithoutRef<\"a\">> | \"a\";\n}\n\nexport type Components = GlobalComponents;\n\ntype ComponentsProviderProps = PropsWithChildren<{\n  components?: Partial<Components>;\n}>;\n\nexport const defaultComponents: Components = {\n  Anchor: \"a\",\n};\n\nexport const ComponentsContext = createContext<Components | undefined>(\n  undefined\n);\n\nexport function useComponents(components?: Partial<Components>): Components {\n  const contextComponents = useContext(ComponentsContext);\n\n  return useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...components,\n    }),\n    [contextComponents, components]\n  );\n}\n\nexport function ComponentsProvider({\n  children,\n  components: providerComponents,\n}: ComponentsProviderProps) {\n  const contextComponents = useContext(ComponentsContext);\n  const components = useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...providerComponents,\n    }),\n    [contextComponents, providerComponents]\n  );\n\n  return (\n    <ComponentsContext.Provider value={components}>\n      {children}\n    </ComponentsContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAmBO;AAAsC;AAE7C;AAEO;AAA0B;AAEjC;AAEO;AACL;AAEA;AAAO;AACE;AACF;AACA;AACA;AACL;AAC8B;AAElC;AAEO;AAA4B;AACjC;AAEF;AACE;AACA;AAAmB;AACV;AACF;AACA;AACA;AACL;AACsC;AAGxC;AACG;AAAkC;AAChC;AAGP;;;;;"}

package/dist/components.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.js","sources":["../src/components.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n  ComponentPropsWithoutRef,\n  ComponentType,\n  PropsWithChildren,\n} from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nexport interface GlobalComponents {\n  Anchor: ComponentType<ComponentPropsWithoutRef<\"a\">> | \"a\";\n}\n\nexport type Components = GlobalComponents;\n\ntype ComponentsProviderProps = PropsWithChildren<{\n  components?: Partial<Components>;\n}>;\n\nexport const defaultComponents: Components = {\n  Anchor: \"a\",\n};\n\nexport const ComponentsContext = createContext<Components | undefined>(\n  undefined\n);\n\nexport function useComponents(components?: Partial<Components>): Components {\n  const contextComponents = useContext(ComponentsContext);\n\n  return useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...components,\n    }),\n    [contextComponents, components]\n  );\n}\n\nexport function ComponentsProvider({\n  children,\n  components: providerComponents,\n}: ComponentsProviderProps) {\n  const contextComponents = useContext(ComponentsContext);\n  const components = useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...providerComponents,\n    }),\n    [contextComponents, providerComponents]\n  );\n\n  return (\n    <ComponentsContext.Provider value={components}>\n      {children}\n    </ComponentsContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;AAAA;AAmBO;AAAsC;AAE7C;AAEO;AAA0B;AAEjC;AAEO;AACL;AAEA;AAAO;AACE;AACF;AACA;AACA;AACL;AAC8B;AAElC;AAEO;AAA4B;AACjC;AAEF;AACE;AACA;AAAmB;AACV;AACF;AACA;AACA;AACL;AACsC;AAGxC;AACG;AAAkC;AAChC;AAGP;;"}
+{"version":3,"file":"components.js","sources":["../src/components.tsx"],"sourcesContent":["\"use client\";\n\nimport type {\n  ComponentPropsWithoutRef,\n  ComponentType,\n  PropsWithChildren,\n} from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nexport interface GlobalComponents {\n  Anchor: ComponentType<ComponentPropsWithoutRef<\"a\">> | \"a\";\n}\n\nexport type Components = GlobalComponents;\n\ntype ComponentsProviderProps = PropsWithChildren<{\n  components?: Partial<Components>;\n}>;\n\nexport const defaultComponents: Components = {\n  Anchor: \"a\",\n};\n\nexport const ComponentsContext = createContext<Components | undefined>(\n  undefined\n);\n\nexport function useComponents(components?: Partial<Components>): Components {\n  const contextComponents = useContext(ComponentsContext);\n\n  return useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...components,\n    }),\n    [contextComponents, components]\n  );\n}\n\nexport function ComponentsProvider({\n  children,\n  components: providerComponents,\n}: ComponentsProviderProps) {\n  const contextComponents = useContext(ComponentsContext);\n  const components = useMemo(\n    () => ({\n      ...defaultComponents,\n      ...contextComponents,\n      ...providerComponents,\n    }),\n    [contextComponents, providerComponents]\n  );\n\n  return (\n    <ComponentsContext.Provider value={components}>\n      {children}\n    </ComponentsContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;AAmBO;AAAsC;AAE7C;AAEO;AAA0B;AAEjC;AAEO;AACL;AAEA;AAAO;AACE;AACF;AACA;AACA;AACL;AAC8B;AAElC;AAEO;AAA4B;AACjC;AAEF;AACE;AACA;AAAmB;AACV;AACF;AACA;AACA;AACL;AACsC;AAGxC;AACG;AAAkC;AAChC;AAGP;;"}

package/dist/config.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"config.cjs","sources":["../src/config.tsx"],"sourcesContent":["\"use client\";\n\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nimport { type Components, ComponentsProvider } from \"./components\";\nimport type { Overrides } from \"./overrides\";\nimport { OverridesProvider } from \"./overrides\";\n\ntype LiveblocksUIConfigProps = PropsWithChildren<{\n  /**\n   * Override the components' strings.\n   */\n  overrides?: Partial<Overrides>;\n\n  /**\n   * Override the components' components.\n   */\n  components?: Partial<Components>;\n\n  /**\n   * The container to render the portal into.\n   */\n  portalContainer?: HTMLElement;\n\n  /**\n   * When `preventUnsavedChanges` is set on your Liveblocks client (or set on\n   * <LiveblocksProvider>), then closing a browser tab will be prevented when\n   * there are unsaved changes.\n   *\n   * By default, that will include draft texts or attachments that are (being)\n   * uploaded via comments/threads composers, but not submitted yet.\n   *\n   * If you want to prevent unsaved changes with Liveblocks, but not for\n   * composers, you can opt-out by setting this option to `false`.\n   */\n  preventUnsavedComposerChanges?: boolean;\n}>;\n\ninterface LiveblocksUIConfigContext {\n  portalContainer?: HTMLElement;\n  preventUnsavedComposerChanges?: boolean;\n}\n\nconst LiveblocksUIConfigContext = createContext<LiveblocksUIConfigContext>({});\n\nexport function useLiveblocksUIConfig() {\n  return useContext(LiveblocksUIConfigContext);\n}\n\n/**\n * Set configuration options for all components.\n *\n * @example\n * <LiveblocksUIConfig overrides={{ locale: \"fr\", USER_UNKNOWN: \"Anonyme\", ... }}>\n *   <App />\n * </LiveblocksUIConfig>\n */\nexport function LiveblocksUIConfig({\n  overrides,\n  components,\n  portalContainer,\n  preventUnsavedComposerChanges = true,\n  children,\n}: LiveblocksUIConfigProps) {\n  const liveblocksUIConfig = useMemo(\n    () => ({ portalContainer, preventUnsavedComposerChanges }),\n    [portalContainer, preventUnsavedComposerChanges]\n  );\n\n  return (\n    <LiveblocksUIConfigContext.Provider value={liveblocksUIConfig}>\n      <OverridesProvider overrides={overrides}>\n        <ComponentsProvider components={components}>\n          {children}\n        </ComponentsProvider>\n      </OverridesProvider>\n    </LiveblocksUIConfigContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAAA;AA4CA;AAEO;AACL;AACF;AAUO;AAA4B;AACjC;AACA;AACA;AACgC;AAElC;AACE;AAA2B;AAC+B;AACT;AAGjD;AACG;AAA0C;AACxC;AAAkB;AAChB;AAAmB;AACjB;AACH;AACF;AAGN;;;"}
+{"version":3,"file":"config.cjs","sources":["../src/config.tsx"],"sourcesContent":["\"use client\";\n\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nimport { type Components, ComponentsProvider } from \"./components\";\nimport type { Overrides } from \"./overrides\";\nimport { OverridesProvider } from \"./overrides\";\n\ntype LiveblocksUIConfigProps = PropsWithChildren<{\n  /**\n   * Override the components' strings.\n   */\n  overrides?: Partial<Overrides>;\n\n  /**\n   * Override the components' components.\n   */\n  components?: Partial<Components>;\n\n  /**\n   * The container to render the portal into.\n   */\n  portalContainer?: HTMLElement;\n\n  /**\n   * When `preventUnsavedChanges` is set on your Liveblocks client (or set on\n   * <LiveblocksProvider>), then closing a browser tab will be prevented when\n   * there are unsaved changes.\n   *\n   * By default, that will include draft texts or attachments that are (being)\n   * uploaded via comments/threads composers, but not submitted yet.\n   *\n   * If you want to prevent unsaved changes with Liveblocks, but not for\n   * composers, you can opt-out by setting this option to `false`.\n   */\n  preventUnsavedComposerChanges?: boolean;\n}>;\n\ninterface LiveblocksUIConfigContext {\n  portalContainer?: HTMLElement;\n  preventUnsavedComposerChanges?: boolean;\n}\n\nconst LiveblocksUIConfigContext = createContext<LiveblocksUIConfigContext>({});\n\nexport function useLiveblocksUIConfig() {\n  return useContext(LiveblocksUIConfigContext);\n}\n\n/**\n * Set configuration options for all components.\n *\n * @example\n * <LiveblocksUIConfig overrides={{ locale: \"fr\", USER_UNKNOWN: \"Anonyme\", ... }}>\n *   <App />\n * </LiveblocksUIConfig>\n */\nexport function LiveblocksUIConfig({\n  overrides,\n  components,\n  portalContainer,\n  preventUnsavedComposerChanges = true,\n  children,\n}: LiveblocksUIConfigProps) {\n  const liveblocksUIConfig = useMemo(\n    () => ({ portalContainer, preventUnsavedComposerChanges }),\n    [portalContainer, preventUnsavedComposerChanges]\n  );\n\n  return (\n    <LiveblocksUIConfigContext.Provider value={liveblocksUIConfig}>\n      <OverridesProvider overrides={overrides}>\n        <ComponentsProvider components={components}>\n          {children}\n        </ComponentsProvider>\n      </OverridesProvider>\n    </LiveblocksUIConfigContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AA4CA;AAEO;AACL;AACF;AAUO;AAA4B;AACjC;AACA;AACA;AACgC;AAElC;AACE;AAA2B;AAC+B;AACT;AAGjD;AACG;AAA0C;AACxC;AAAkB;AAChB;AAAmB;AACjB;AACH;AACF;AAGN;;;"}

package/dist/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","sources":["../src/config.tsx"],"sourcesContent":["\"use client\";\n\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nimport { type Components, ComponentsProvider } from \"./components\";\nimport type { Overrides } from \"./overrides\";\nimport { OverridesProvider } from \"./overrides\";\n\ntype LiveblocksUIConfigProps = PropsWithChildren<{\n  /**\n   * Override the components' strings.\n   */\n  overrides?: Partial<Overrides>;\n\n  /**\n   * Override the components' components.\n   */\n  components?: Partial<Components>;\n\n  /**\n   * The container to render the portal into.\n   */\n  portalContainer?: HTMLElement;\n\n  /**\n   * When `preventUnsavedChanges` is set on your Liveblocks client (or set on\n   * <LiveblocksProvider>), then closing a browser tab will be prevented when\n   * there are unsaved changes.\n   *\n   * By default, that will include draft texts or attachments that are (being)\n   * uploaded via comments/threads composers, but not submitted yet.\n   *\n   * If you want to prevent unsaved changes with Liveblocks, but not for\n   * composers, you can opt-out by setting this option to `false`.\n   */\n  preventUnsavedComposerChanges?: boolean;\n}>;\n\ninterface LiveblocksUIConfigContext {\n  portalContainer?: HTMLElement;\n  preventUnsavedComposerChanges?: boolean;\n}\n\nconst LiveblocksUIConfigContext = createContext<LiveblocksUIConfigContext>({});\n\nexport function useLiveblocksUIConfig() {\n  return useContext(LiveblocksUIConfigContext);\n}\n\n/**\n * Set configuration options for all components.\n *\n * @example\n * <LiveblocksUIConfig overrides={{ locale: \"fr\", USER_UNKNOWN: \"Anonyme\", ... }}>\n *   <App />\n * </LiveblocksUIConfig>\n */\nexport function LiveblocksUIConfig({\n  overrides,\n  components,\n  portalContainer,\n  preventUnsavedComposerChanges = true,\n  children,\n}: LiveblocksUIConfigProps) {\n  const liveblocksUIConfig = useMemo(\n    () => ({ portalContainer, preventUnsavedComposerChanges }),\n    [portalContainer, preventUnsavedComposerChanges]\n  );\n\n  return (\n    <LiveblocksUIConfigContext.Provider value={liveblocksUIConfig}>\n      <OverridesProvider overrides={overrides}>\n        <ComponentsProvider components={components}>\n          {children}\n        </ComponentsProvider>\n      </OverridesProvider>\n    </LiveblocksUIConfigContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;AAAA;AA4CA;AAEO;AACL;AACF;AAUO;AAA4B;AACjC;AACA;AACA;AACgC;AAElC;AACE;AAA2B;AAC+B;AACT;AAGjD;AACG;AAA0C;AACxC;AAAkB;AAChB;AAAmB;AACjB;AACH;AACF;AAGN;;"}
+{"version":3,"file":"config.js","sources":["../src/config.tsx"],"sourcesContent":["\"use client\";\n\nimport type { PropsWithChildren } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nimport { type Components, ComponentsProvider } from \"./components\";\nimport type { Overrides } from \"./overrides\";\nimport { OverridesProvider } from \"./overrides\";\n\ntype LiveblocksUIConfigProps = PropsWithChildren<{\n  /**\n   * Override the components' strings.\n   */\n  overrides?: Partial<Overrides>;\n\n  /**\n   * Override the components' components.\n   */\n  components?: Partial<Components>;\n\n  /**\n   * The container to render the portal into.\n   */\n  portalContainer?: HTMLElement;\n\n  /**\n   * When `preventUnsavedChanges` is set on your Liveblocks client (or set on\n   * <LiveblocksProvider>), then closing a browser tab will be prevented when\n   * there are unsaved changes.\n   *\n   * By default, that will include draft texts or attachments that are (being)\n   * uploaded via comments/threads composers, but not submitted yet.\n   *\n   * If you want to prevent unsaved changes with Liveblocks, but not for\n   * composers, you can opt-out by setting this option to `false`.\n   */\n  preventUnsavedComposerChanges?: boolean;\n}>;\n\ninterface LiveblocksUIConfigContext {\n  portalContainer?: HTMLElement;\n  preventUnsavedComposerChanges?: boolean;\n}\n\nconst LiveblocksUIConfigContext = createContext<LiveblocksUIConfigContext>({});\n\nexport function useLiveblocksUIConfig() {\n  return useContext(LiveblocksUIConfigContext);\n}\n\n/**\n * Set configuration options for all components.\n *\n * @example\n * <LiveblocksUIConfig overrides={{ locale: \"fr\", USER_UNKNOWN: \"Anonyme\", ... }}>\n *   <App />\n * </LiveblocksUIConfig>\n */\nexport function LiveblocksUIConfig({\n  overrides,\n  components,\n  portalContainer,\n  preventUnsavedComposerChanges = true,\n  children,\n}: LiveblocksUIConfigProps) {\n  const liveblocksUIConfig = useMemo(\n    () => ({ portalContainer, preventUnsavedComposerChanges }),\n    [portalContainer, preventUnsavedComposerChanges]\n  );\n\n  return (\n    <LiveblocksUIConfigContext.Provider value={liveblocksUIConfig}>\n      <OverridesProvider overrides={overrides}>\n        <ComponentsProvider components={components}>\n          {children}\n        </ComponentsProvider>\n      </OverridesProvider>\n    </LiveblocksUIConfigContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AA4CA;AAEO;AACL;AACF;AAUO;AAA4B;AACjC;AACA;AACA;AACgC;AAElC;AACE;AAA2B;AAC+B;AACT;AAGjD;AACG;AAA0C;AACxC;AAAkB;AAChB;AAAmB;AACjB;AACH;AACF;AAGN;;"}

package/dist/index.d.cts

@@ -46,6 +46,7 @@ interface GlobalOverrides {
     EMOJI_PICKER_SEARCH_PLACEHOLDER: string;
     EMOJI_PICKER_EMPTY: ReactNode;
     EMOJI_PICKER_ERROR: (error: Error) => ReactNode;
+    EMOJI_PICKER_CHANGE_SKIN_TONE: string;
     ATTACHMENT_TOO_LARGE: (maxSize?: string) => string;
     ATTACHMENT_ERROR: (error: Error) => string;
 }

package/dist/index.d.ts

@@ -46,6 +46,7 @@ interface GlobalOverrides {
     EMOJI_PICKER_SEARCH_PLACEHOLDER: string;
     EMOJI_PICKER_EMPTY: ReactNode;
     EMOJI_PICKER_ERROR: (error: Error) => ReactNode;
+    EMOJI_PICKER_CHANGE_SKIN_TONE: string;
     ATTACHMENT_TOO_LARGE: (maxSize?: string) => string;
     ATTACHMENT_ERROR: (error: Error) => string;
 }

package/dist/overrides.cjs

@@ -19,6 +19,7 @@ const defaultOverrides = {
   EMOJI_PICKER_SEARCH_PLACEHOLDER: "Search\u2026",
   EMOJI_PICKER_EMPTY: "No emoji found.",
   EMOJI_PICKER_ERROR: () => "There was an error while getting the list of emoji.",
+  EMOJI_PICKER_CHANGE_SKIN_TONE: "Change skin tone",
   ATTACHMENT_TOO_LARGE: (maxSize) => maxSize ? `The file is larger than ${maxSize}` : "The file is too large",
   ATTACHMENT_ERROR: () => "The file couldn\u2019t be uploaded.",
   COMPOSER_INSERT_MENTION: "Mention someone",

package/dist/overrides.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"overrides.cjs","sources":["../src/overrides.tsx"],"sourcesContent":["\"use client\";\n\nimport { assertNever } from \"@liveblocks/core\";\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nimport { Emoji } from \"./components/internal/Emoji\";\nimport type { ComposerBodyMark, Direction } from \"./types\";\nimport { pluralize } from \"./utils/pluralize\";\n\nexport interface LocalizationOverrides {\n  locale: string;\n  dir: Direction;\n}\n\nexport interface GlobalOverrides {\n  USER_SELF: string;\n  USER_UNKNOWN: string;\n  LIST_REMAINING: (count: number) => string;\n  LIST_REMAINING_USERS: (count: number) => string;\n  LIST_REMAINING_COMMENTS: (count: number) => string;\n  EMOJI_PICKER_SEARCH_PLACEHOLDER: string;\n  EMOJI_PICKER_EMPTY: ReactNode;\n  EMOJI_PICKER_ERROR: (error: Error) => ReactNode;\n  ATTACHMENT_TOO_LARGE: (maxSize?: string) => string;\n  ATTACHMENT_ERROR: (error: Error) => string;\n}\n\nexport interface CommentOverrides {\n  COMMENT_EDITED: ReactNode;\n  COMMENT_DELETED: ReactNode;\n  COMMENT_MORE: string;\n  COMMENT_EDIT: string;\n  COMMENT_EDIT_COMPOSER_PLACEHOLDER: string;\n  COMMENT_EDIT_COMPOSER_CANCEL: string;\n  COMMENT_EDIT_COMPOSER_SAVE: string;\n  COMMENT_DELETE: string;\n  COMMENT_DELETE_ATTACHMENT: string;\n  COMMENT_ADD_REACTION: string;\n  COMMENT_REACTION_LIST: (\n    list: ReactNode,\n    emoji: string,\n    count: number\n  ) => ReactNode;\n  COMMENT_REACTION_DESCRIPTION: (emoji: string, count: number) => string;\n}\n\nexport interface ComposerOverrides {\n  COMPOSER_INSERT_MENTION: string;\n  COMPOSER_INSERT_EMOJI: string;\n  COMPOSER_ATTACH_FILES: string;\n  COMPOSER_REMOVE_ATTACHMENT: string;\n  COMPOSER_PLACEHOLDER: string;\n  COMPOSER_SEND: string;\n  COMPOSER_TOGGLE_MARK: (mark: ComposerBodyMark) => string;\n}\n\nexport interface ThreadOverrides {\n  THREAD_RESOLVE: string;\n  THREAD_UNRESOLVE: string;\n  THREAD_NEW_INDICATOR: string;\n  THREAD_NEW_INDICATOR_DESCRIPTION: string;\n  THREAD_COMPOSER_PLACEHOLDER: string;\n  THREAD_COMPOSER_SEND: string;\n}\n\nexport interface InboxNotificationOverrides {\n  INBOX_NOTIFICATION_MORE: string;\n  INBOX_NOTIFICATION_MARK_AS_READ: string;\n  INBOX_NOTIFICATION_DELETE: string;\n  INBOX_NOTIFICATION_THREAD_COMMENTS_LIST: (\n    list: ReactNode,\n    room: ReactNode | undefined,\n    count: number\n  ) => ReactNode;\n  INBOX_NOTIFICATION_THREAD_MENTION: (\n    user: ReactNode,\n    room: ReactNode | undefined\n  ) => ReactNode;\n  INBOX_NOTIFICATION_TEXT_MENTION: (\n    user: ReactNode,\n    room: ReactNode | undefined\n  ) => ReactNode;\n}\n\nexport interface HistoryVersionPreviewOverrides {\n  HISTORY_VERSION_PREVIEW_AUTHORS_LIST: (list: ReactNode) => ReactNode;\n  HISTORY_VERSION_PREVIEW_RESTORE: string;\n  HISTORY_VERSION_PREVIEW_EMPTY: ReactNode;\n  HISTORY_VERSION_PREVIEW_ERROR: (error: Error) => ReactNode;\n}\n\nexport type Overrides = LocalizationOverrides &\n  GlobalOverrides &\n  ComposerOverrides &\n  CommentOverrides &\n  ThreadOverrides &\n  InboxNotificationOverrides &\n  HistoryVersionPreviewOverrides;\n\ntype OverridesProviderProps = PropsWithChildren<{\n  overrides?: Partial<Overrides>;\n}>;\n\nexport const defaultOverrides: Overrides = {\n  locale: \"en\",\n  dir: \"ltr\",\n  USER_SELF: \"you\",\n  USER_UNKNOWN: \"Anonymous\",\n  LIST_REMAINING: (count) => `${count} more`,\n  LIST_REMAINING_USERS: (count) => `${count} ${pluralize(count, \"other\")}`,\n  LIST_REMAINING_COMMENTS: (count) =>\n    `${count} more ${pluralize(count, \"comment\")}`,\n  EMOJI_PICKER_SEARCH_PLACEHOLDER: \"Search…\",\n  EMOJI_PICKER_EMPTY: \"No emoji found.\",\n  EMOJI_PICKER_ERROR: () =>\n    \"There was an error while getting the list of emoji.\",\n  ATTACHMENT_TOO_LARGE: (maxSize) =>\n    maxSize ? `The file is larger than ${maxSize}` : \"The file is too large\",\n  ATTACHMENT_ERROR: () => \"The file couldn’t be uploaded.\",\n  COMPOSER_INSERT_MENTION: \"Mention someone\",\n  COMPOSER_INSERT_EMOJI: \"Add emoji\",\n  COMPOSER_ATTACH_FILES: \"Attach files\",\n  COMPOSER_REMOVE_ATTACHMENT: \"Remove attachment\",\n  COMPOSER_PLACEHOLDER: \"Write a comment…\",\n  COMPOSER_SEND: \"Send\",\n  COMPOSER_TOGGLE_MARK: (format) => {\n    switch (format) {\n      case \"bold\":\n        return \"Bold\";\n      case \"italic\":\n        return \"Italic\";\n      case \"strikethrough\":\n        return \"Strikethrough\";\n      case \"code\":\n        return \"Inline code\";\n      default:\n        return assertNever(format, \"Unexpected mark\");\n    }\n  },\n  COMMENT_EDITED: \"(edited)\",\n  COMMENT_DELETED: \"This comment has been deleted.\",\n  COMMENT_MORE: \"More\",\n  COMMENT_EDIT: \"Edit comment\",\n  COMMENT_EDIT_COMPOSER_PLACEHOLDER: \"Edit comment…\",\n  COMMENT_EDIT_COMPOSER_CANCEL: \"Cancel\",\n  COMMENT_EDIT_COMPOSER_SAVE: \"Save\",\n  COMMENT_DELETE: \"Delete comment\",\n  COMMENT_DELETE_ATTACHMENT: \"Delete attachment\",\n  COMMENT_ADD_REACTION: \"Add reaction\",\n  COMMENT_REACTION_LIST: (list, emoji) => (\n    <>\n      {list} reacted with <Emoji emoji={emoji} />\n    </>\n  ),\n  COMMENT_REACTION_DESCRIPTION: (emoji, count) =>\n    `${count} ${pluralize(count, \"reaction\")}, react with ${emoji}`,\n  THREAD_RESOLVE: \"Resolve thread\",\n  THREAD_UNRESOLVE: \"Re-open thread\",\n  THREAD_NEW_INDICATOR: \"New\",\n  THREAD_NEW_INDICATOR_DESCRIPTION: \"New comments\",\n  THREAD_COMPOSER_PLACEHOLDER: \"Reply to thread…\",\n  THREAD_COMPOSER_SEND: \"Reply\",\n  INBOX_NOTIFICATION_MORE: \"More\",\n  INBOX_NOTIFICATION_MARK_AS_READ: \"Mark as read\",\n  INBOX_NOTIFICATION_DELETE: \"Delete notification\",\n  INBOX_NOTIFICATION_THREAD_COMMENTS_LIST: (\n    list: ReactNode,\n    room: ReactNode\n  ) => (\n    <>\n      {list} commented\n      {room ? <> in {room}</> : <> in a thread</>}\n    </>\n  ),\n  INBOX_NOTIFICATION_THREAD_MENTION: (user: ReactNode, room: ReactNode) => (\n    <>\n      {user} mentioned you{room ? <> in {room}</> : null}\n    </>\n  ),\n  INBOX_NOTIFICATION_TEXT_MENTION: (user: ReactNode, room: ReactNode) => (\n    <>\n      {user} mentioned you{room ? <> in {room}</> : null}\n    </>\n  ),\n  HISTORY_VERSION_PREVIEW_AUTHORS_LIST: (list: ReactNode) => (\n    <>Edits from {list}</>\n  ),\n  HISTORY_VERSION_PREVIEW_RESTORE: \"Restore\",\n  HISTORY_VERSION_PREVIEW_EMPTY: \"No content.\",\n  HISTORY_VERSION_PREVIEW_ERROR: () =>\n    \"There was an error while getting this version.\",\n};\n\nexport const OverridesContext = createContext<Overrides | undefined>(undefined);\n\nexport function useOverrides(overrides?: Partial<Overrides>): Overrides {\n  const contextOverrides = useContext(OverridesContext);\n\n  return useMemo(\n    () => ({\n      ...defaultOverrides,\n      ...contextOverrides,\n      ...overrides,\n    }),\n    [contextOverrides, overrides]\n  );\n}\n\nexport function OverridesProvider({\n  children,\n  overrides: providerOverrides,\n}: OverridesProviderProps) {\n  const contextOverrides = useContext(OverridesContext);\n  const overrides = useMemo(\n    () => ({\n      ...defaultOverrides,\n      ...contextOverrides,\n      ...providerOverrides,\n    }),\n    [contextOverrides, providerOverrides]\n  );\n\n  return (\n    <OverridesContext.Provider value={overrides}>\n      {children}\n    </OverridesContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AAAA;AAwGO;AAAoC;AACjC;AACH;AACM;AACG;AACgB;AACuC;AAExB;AACZ;AACb;AAElB;AAEiD;AAC3B;AACC;AACF;AACA;AACK;AACN;AACP;AAEb;AAAgB;AAEZ;AAAO;AAEP;AAAO;AAEP;AAAO;AAEP;AAAO;AAEP;AAA4C;AAChD;AACF;AACgB;AACC;AACH;AACA;AACqB;AACL;AACF;AACZ;AACW;AACL;AAEpB;AACG;AAAA;AAAK;AAAe;AAAM;AAAc;AAAA;AAC3C;AAGwD;AAC1C;AACE;AACI;AACY;AACL;AACP;AACG;AACQ;AACN;AAKzB;AACG;AAAA;AAAK;AACE;AAAE;AAAA;AAAK;AAAA;AAAW;AAAE;AAAY;AAAA;AAC1C;AAGA;AACG;AAAA;AAAK;AAAsB;AAAE;AAAA;AAAK;AAAA;AAAW;AAAA;AAChD;AAGA;AACG;AAAA;AAAK;AAAsB;AAAE;AAAA;AAAK;AAAA;AAAW;AAAA;AAChD;AAGA;AAAE;AAAA;AAAY;AAAA;AAAK;AAEY;AACF;AAGjC;AAEa;AAEN;AACL;AAEA;AAAO;AACE;AACF;AACA;AACA;AACL;AAC4B;AAEhC;AAEO;AAA2B;AAChC;AAEF;AACE;AACA;AAAkB;AACT;AACF;AACA;AACA;AACL;AACoC;AAGtC;AACG;AAAiC;AAC/B;AAGP;;;;;"}
+{"version":3,"file":"overrides.cjs","sources":["../src/overrides.tsx"],"sourcesContent":["\"use client\";\n\nimport { assertNever } from \"@liveblocks/core\";\nimport type { PropsWithChildren, ReactNode } from \"react\";\nimport { createContext, useContext, useMemo } from \"react\";\n\nimport { Emoji } from \"./components/internal/Emoji\";\nimport type { ComposerBodyMark, Direction } from \"./types\";\nimport { pluralize } from \"./utils/pluralize\";\n\nexport interface LocalizationOverrides {\n  locale: string;\n  dir: Direction;\n}\n\nexport interface GlobalOverrides {\n  USER_SELF: string;\n  USER_UNKNOWN: string;\n  LIST_REMAINING: (count: number) => string;\n  LIST_REMAINING_USERS: (count: number) => string;\n  LIST_REMAINING_COMMENTS: (count: number) => string;\n  EMOJI_PICKER_SEARCH_PLACEHOLDER: string;\n  EMOJI_PICKER_EMPTY: ReactNode;\n  EMOJI_PICKER_ERROR: (error: Error) => ReactNode;\n  EMOJI_PICKER_CHANGE_SKIN_TONE: string;\n  ATTACHMENT_TOO_LARGE: (maxSize?: string) => string;\n  ATTACHMENT_ERROR: (error: Error) => string;\n}\n\nexport interface CommentOverrides {\n  COMMENT_EDITED: ReactNode;\n  COMMENT_DELETED: ReactNode;\n  COMMENT_MORE: string;\n  COMMENT_EDIT: string;\n  COMMENT_EDIT_COMPOSER_PLACEHOLDER: string;\n  COMMENT_EDIT_COMPOSER_CANCEL: string;\n  COMMENT_EDIT_COMPOSER_SAVE: string;\n  COMMENT_DELETE: string;\n  COMMENT_DELETE_ATTACHMENT: string;\n  COMMENT_ADD_REACTION: string;\n  COMMENT_REACTION_LIST: (\n    list: ReactNode,\n    emoji: string,\n    count: number\n  ) => ReactNode;\n  COMMENT_REACTION_DESCRIPTION: (emoji: string, count: number) => string;\n}\n\nexport interface ComposerOverrides {\n  COMPOSER_INSERT_MENTION: string;\n  COMPOSER_INSERT_EMOJI: string;\n  COMPOSER_ATTACH_FILES: string;\n  COMPOSER_REMOVE_ATTACHMENT: string;\n  COMPOSER_PLACEHOLDER: string;\n  COMPOSER_SEND: string;\n  COMPOSER_TOGGLE_MARK: (mark: ComposerBodyMark) => string;\n}\n\nexport interface ThreadOverrides {\n  THREAD_RESOLVE: string;\n  THREAD_UNRESOLVE: string;\n  THREAD_NEW_INDICATOR: string;\n  THREAD_NEW_INDICATOR_DESCRIPTION: string;\n  THREAD_COMPOSER_PLACEHOLDER: string;\n  THREAD_COMPOSER_SEND: string;\n}\n\nexport interface InboxNotificationOverrides {\n  INBOX_NOTIFICATION_MORE: string;\n  INBOX_NOTIFICATION_MARK_AS_READ: string;\n  INBOX_NOTIFICATION_DELETE: string;\n  INBOX_NOTIFICATION_THREAD_COMMENTS_LIST: (\n    list: ReactNode,\n    room: ReactNode | undefined,\n    count: number\n  ) => ReactNode;\n  INBOX_NOTIFICATION_THREAD_MENTION: (\n    user: ReactNode,\n    room: ReactNode | undefined\n  ) => ReactNode;\n  INBOX_NOTIFICATION_TEXT_MENTION: (\n    user: ReactNode,\n    room: ReactNode | undefined\n  ) => ReactNode;\n}\n\nexport interface HistoryVersionPreviewOverrides {\n  HISTORY_VERSION_PREVIEW_AUTHORS_LIST: (list: ReactNode) => ReactNode;\n  HISTORY_VERSION_PREVIEW_RESTORE: string;\n  HISTORY_VERSION_PREVIEW_EMPTY: ReactNode;\n  HISTORY_VERSION_PREVIEW_ERROR: (error: Error) => ReactNode;\n}\n\nexport type Overrides = LocalizationOverrides &\n  GlobalOverrides &\n  ComposerOverrides &\n  CommentOverrides &\n  ThreadOverrides &\n  InboxNotificationOverrides &\n  HistoryVersionPreviewOverrides;\n\ntype OverridesProviderProps = PropsWithChildren<{\n  overrides?: Partial<Overrides>;\n}>;\n\nexport const defaultOverrides: Overrides = {\n  locale: \"en\",\n  dir: \"ltr\",\n  USER_SELF: \"you\",\n  USER_UNKNOWN: \"Anonymous\",\n  LIST_REMAINING: (count) => `${count} more`,\n  LIST_REMAINING_USERS: (count) => `${count} ${pluralize(count, \"other\")}`,\n  LIST_REMAINING_COMMENTS: (count) =>\n    `${count} more ${pluralize(count, \"comment\")}`,\n  EMOJI_PICKER_SEARCH_PLACEHOLDER: \"Search…\",\n  EMOJI_PICKER_EMPTY: \"No emoji found.\",\n  EMOJI_PICKER_ERROR: () =>\n    \"There was an error while getting the list of emoji.\",\n  EMOJI_PICKER_CHANGE_SKIN_TONE: \"Change skin tone\",\n  ATTACHMENT_TOO_LARGE: (maxSize) =>\n    maxSize ? `The file is larger than ${maxSize}` : \"The file is too large\",\n  ATTACHMENT_ERROR: () => \"The file couldn’t be uploaded.\",\n  COMPOSER_INSERT_MENTION: \"Mention someone\",\n  COMPOSER_INSERT_EMOJI: \"Add emoji\",\n  COMPOSER_ATTACH_FILES: \"Attach files\",\n  COMPOSER_REMOVE_ATTACHMENT: \"Remove attachment\",\n  COMPOSER_PLACEHOLDER: \"Write a comment…\",\n  COMPOSER_SEND: \"Send\",\n  COMPOSER_TOGGLE_MARK: (format) => {\n    switch (format) {\n      case \"bold\":\n        return \"Bold\";\n      case \"italic\":\n        return \"Italic\";\n      case \"strikethrough\":\n        return \"Strikethrough\";\n      case \"code\":\n        return \"Inline code\";\n      default:\n        return assertNever(format, \"Unexpected mark\");\n    }\n  },\n  COMMENT_EDITED: \"(edited)\",\n  COMMENT_DELETED: \"This comment has been deleted.\",\n  COMMENT_MORE: \"More\",\n  COMMENT_EDIT: \"Edit comment\",\n  COMMENT_EDIT_COMPOSER_PLACEHOLDER: \"Edit comment…\",\n  COMMENT_EDIT_COMPOSER_CANCEL: \"Cancel\",\n  COMMENT_EDIT_COMPOSER_SAVE: \"Save\",\n  COMMENT_DELETE: \"Delete comment\",\n  COMMENT_DELETE_ATTACHMENT: \"Delete attachment\",\n  COMMENT_ADD_REACTION: \"Add reaction\",\n  COMMENT_REACTION_LIST: (list, emoji) => (\n    <>\n      {list} reacted with <Emoji emoji={emoji} />\n    </>\n  ),\n  COMMENT_REACTION_DESCRIPTION: (emoji, count) =>\n    `${count} ${pluralize(count, \"reaction\")}, react with ${emoji}`,\n  THREAD_RESOLVE: \"Resolve thread\",\n  THREAD_UNRESOLVE: \"Re-open thread\",\n  THREAD_NEW_INDICATOR: \"New\",\n  THREAD_NEW_INDICATOR_DESCRIPTION: \"New comments\",\n  THREAD_COMPOSER_PLACEHOLDER: \"Reply to thread…\",\n  THREAD_COMPOSER_SEND: \"Reply\",\n  INBOX_NOTIFICATION_MORE: \"More\",\n  INBOX_NOTIFICATION_MARK_AS_READ: \"Mark as read\",\n  INBOX_NOTIFICATION_DELETE: \"Delete notification\",\n  INBOX_NOTIFICATION_THREAD_COMMENTS_LIST: (\n    list: ReactNode,\n    room: ReactNode\n  ) => (\n    <>\n      {list} commented\n      {room ? <> in {room}</> : <> in a thread</>}\n    </>\n  ),\n  INBOX_NOTIFICATION_THREAD_MENTION: (user: ReactNode, room: ReactNode) => (\n    <>\n      {user} mentioned you{room ? <> in {room}</> : null}\n    </>\n  ),\n  INBOX_NOTIFICATION_TEXT_MENTION: (user: ReactNode, room: ReactNode) => (\n    <>\n      {user} mentioned you{room ? <> in {room}</> : null}\n    </>\n  ),\n  HISTORY_VERSION_PREVIEW_AUTHORS_LIST: (list: ReactNode) => (\n    <>Edits from {list}</>\n  ),\n  HISTORY_VERSION_PREVIEW_RESTORE: \"Restore\",\n  HISTORY_VERSION_PREVIEW_EMPTY: \"No content.\",\n  HISTORY_VERSION_PREVIEW_ERROR: () =>\n    \"There was an error while getting this version.\",\n};\n\nexport const OverridesContext = createContext<Overrides | undefined>(undefined);\n\nexport function useOverrides(overrides?: Partial<Overrides>): Overrides {\n  const contextOverrides = useContext(OverridesContext);\n\n  return useMemo(\n    () => ({\n      ...defaultOverrides,\n      ...contextOverrides,\n      ...overrides,\n    }),\n    [contextOverrides, overrides]\n  );\n}\n\nexport function OverridesProvider({\n  children,\n  overrides: providerOverrides,\n}: OverridesProviderProps) {\n  const contextOverrides = useContext(OverridesContext);\n  const overrides = useMemo(\n    () => ({\n      ...defaultOverrides,\n      ...contextOverrides,\n      ...providerOverrides,\n    }),\n    [contextOverrides, providerOverrides]\n  );\n\n  return (\n    <OverridesContext.Provider value={overrides}>\n      {children}\n    </OverridesContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAyGO;AAAoC;AACjC;AACH;AACM;AACG;AACgB;AACuC;AAExB;AACZ;AACb;AAElB;AAC6B;AAEoB;AAC3B;AACC;AACF;AACA;AACK;AACN;AACP;AAEb;AAAgB;AAEZ;AAAO;AAEP;AAAO;AAEP;AAAO;AAEP;AAAO;AAEP;AAA4C;AAChD;AACF;AACgB;AACC;AACH;AACA;AACqB;AACL;AACF;AACZ;AACW;AACL;AAEpB;AACG;AAAA;AAAK;AAAe;AAAM;AAAc;AAAA;AAC3C;AAGwD;AAC1C;AACE;AACI;AACY;AACL;AACP;AACG;AACQ;AACN;AAKzB;AACG;AAAA;AAAK;AACE;AAAE;AAAA;AAAK;AAAA;AAAW;AAAE;AAAY;AAAA;AAC1C;AAGA;AACG;AAAA;AAAK;AAAsB;AAAE;AAAA;AAAK;AAAA;AAAW;AAAA;AAChD;AAGA;AACG;AAAA;AAAK;AAAsB;AAAE;AAAA;AAAK;AAAA;AAAW;AAAA;AAChD;AAGA;AAAE;AAAA;AAAY;AAAA;AAAK;AAEY;AACF;AAGjC;AAEa;AAEN;AACL;AAEA;AAAO;AACE;AACF;AACA;AACA;AACL;AAC4B;AAEhC;AAEO;AAA2B;AAChC;AAEF;AACE;AACA;AAAkB;AACT;AACF;AACA;AACA;AACL;AACoC;AAGtC;AACG;AAAiC;AAC/B;AAGP;;;;;"}

package/dist/overrides.js

@@ -17,6 +17,7 @@ const defaultOverrides = {
   EMOJI_PICKER_SEARCH_PLACEHOLDER: "Search\u2026",
   EMOJI_PICKER_EMPTY: "No emoji found.",
   EMOJI_PICKER_ERROR: () => "There was an error while getting the list of emoji.",
+  EMOJI_PICKER_CHANGE_SKIN_TONE: "Change skin tone",
   ATTACHMENT_TOO_LARGE: (maxSize) => maxSize ? `The file is larger than ${maxSize}` : "The file is too large",
   ATTACHMENT_ERROR: () => "The file couldn\u2019t be uploaded.",
   COMPOSER_INSERT_MENTION: "Mention someone",