stream-chat-react 14.12.0 → 15.0.0-rc.1

package/dist/es/plugins/ChannelDetail/AvatarWithChannelDetail.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarWithChannelDetail.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/AvatarWithChannelDetail.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useCallback, useState } from 'react';\n\nimport {\n  useChannelStateContext,\n  useComponentContext,\n  useTranslationContext,\n} from '../../context';\nimport {\n  type ChannelAvatarProps,\n  ChannelAvatar as DefaultChannelAvatar,\n} from '../../components/Avatar/index';\nimport {\n  type ChannelDetailProps,\n  ChannelDetail as DefaultChannelDetail,\n} from './ChannelDetail';\nimport { GlobalModal } from '../../components/Modal';\n\nexport type AvatarWithChannelDetailProps = ChannelAvatarProps & {\n  Avatar?: React.ComponentType<ChannelAvatarProps>;\n  ChannelDetail?: React.ComponentType<ChannelDetailProps>;\n};\n\nconst avatarWithChannelDetailDialogRootProps = {\n  className: 'str-chat__channel-detail-modal',\n};\n\nexport const AvatarWithChannelDetail = ({\n  Avatar,\n  ChannelDetail = DefaultChannelDetail,\n  className,\n  ...avatarProps\n}: AvatarWithChannelDetailProps) => {\n  const { t } = useTranslationContext();\n  const { channel } = useChannelStateContext();\n  const { Avatar: ContextAvatar, Modal = GlobalModal } = useComponentContext();\n  const [isModalOpen, setIsModalOpen] = useState(false);\n\n  const openModal = useCallback(() => setIsModalOpen(true), []);\n  const closeModal = useCallback(() => setIsModalOpen(false), []);\n\n  const AvatarComponent =\n    Avatar ??\n    (ContextAvatar === AvatarWithChannelDetail ? undefined : ContextAvatar) ??\n    DefaultChannelAvatar;\n\n  return (\n    <>\n      <button\n        aria-label={t('aria/Open channel details')}\n        className='str-chat__avatar-with-channel-detail-button'\n        onClick={openModal}\n        type='button'\n      >\n        <AvatarComponent\n          {...avatarProps}\n          className={clsx(\n            'str-chat__avatar-with-channel-detail-button__avatar',\n            className,\n          )}\n        />\n      </button>\n      <Modal\n        aria-label={t('aria/Channel details')}\n        dialogRootProps={avatarWithChannelDetailDialogRootProps}\n        onClose={closeModal}\n        open={isModalOpen}\n      >\n        <ChannelDetail channel={channel} />\n      </Modal>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;AAuBA,IAAM,yCAAyC,EAC7C,WAAW,iCACb;AAEA,IAAa,2BAA2B,EACtC,QACA,eAAA,kBAAgB,eAChB,WACA,GAAG,kBAC+B;CAClC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,YAAY,uBAAuB;CAC3C,MAAM,EAAE,QAAQ,eAAe,QAAQ,gBAAgB,oBAAoB;CAC3E,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,YAAY,kBAAkB,eAAe,IAAI,GAAG,CAAC,CAAC;CAC5D,MAAM,aAAa,kBAAkB,eAAe,KAAK,GAAG,CAAC,CAAC;CAE9D,MAAM,kBACJ,WACC,kBAAkB,0BAA0B,KAAA,IAAY,kBACzD;CAEF,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,UAAD;EACE,cAAY,EAAE,2BAA2B;EACzC,WAAU;EACV,SAAS;EACT,MAAK;YAEL,oBAAC,iBAAD;GACE,GAAI;GACJ,WAAW,KACT,uDACA,SACF;EACD,CAAA;CACK,CAAA,GACR,oBAAC,OAAD;EACE,cAAY,EAAE,sBAAsB;EACpC,iBAAiB;EACjB,SAAS;EACT,MAAM;YAEN,oBAAC,iBAAD,EAAwB,QAAU,CAAA;CAC7B,CAAA,CACP,EAAA,CAAA;AAEN"}
+{"version":3,"file":"AvatarWithChannelDetail.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/AvatarWithChannelDetail.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useCallback, useState } from 'react';\n\nimport { useChannel, useComponentContext, useTranslationContext } from '../../context';\nimport {\n  type ChannelAvatarProps,\n  ChannelAvatar as DefaultChannelAvatar,\n} from '../../components/Avatar/index';\nimport {\n  type ChannelDetailProps,\n  ChannelDetail as DefaultChannelDetail,\n} from './ChannelDetail';\nimport { GlobalModal } from '../../components/Modal';\n\nexport type AvatarWithChannelDetailProps = ChannelAvatarProps & {\n  Avatar?: React.ComponentType<ChannelAvatarProps>;\n  ChannelDetail?: React.ComponentType<ChannelDetailProps>;\n};\n\nconst avatarWithChannelDetailDialogRootProps = {\n  className: 'str-chat__channel-detail-modal',\n};\n\nexport const AvatarWithChannelDetail = ({\n  Avatar,\n  ChannelDetail = DefaultChannelDetail,\n  className,\n  ...avatarProps\n}: AvatarWithChannelDetailProps) => {\n  const { t } = useTranslationContext();\n  const channel = useChannel();\n  const { Avatar: ContextAvatar, Modal = GlobalModal } = useComponentContext();\n  const [isModalOpen, setIsModalOpen] = useState(false);\n\n  const openModal = useCallback(() => setIsModalOpen(true), []);\n  const closeModal = useCallback(() => setIsModalOpen(false), []);\n\n  const AvatarComponent =\n    Avatar ??\n    (ContextAvatar === AvatarWithChannelDetail ? undefined : ContextAvatar) ??\n    DefaultChannelAvatar;\n\n  return (\n    <>\n      <button\n        aria-label={t(\n          'channelDetail.avatarChannelDetail.openChannelDetails.ariaLabel',\n          'Open channel details',\n        )}\n        className='str-chat__avatar-with-channel-detail-button'\n        onClick={openModal}\n        type='button'\n      >\n        <AvatarComponent\n          {...avatarProps}\n          className={clsx(\n            'str-chat__avatar-with-channel-detail-button__avatar',\n            className,\n          )}\n        />\n      </button>\n      <Modal\n        aria-label={t(\n          'channelDetail.avatarChannelDetail.channelDetails.ariaLabel',\n          'Channel details',\n        )}\n        dialogRootProps={avatarWithChannelDetailDialogRootProps}\n        onClose={closeModal}\n        open={isModalOpen}\n      >\n        <ChannelDetail channel={channel} />\n      </Modal>\n    </>\n  );\n};\n"],"mappings":";;;;;;;;;;AAmBA,IAAM,yCAAyC,EAC7C,WAAW,iCACb;AAEA,IAAa,2BAA2B,EACtC,QACA,eAAA,kBAAgB,eAChB,WACA,GAAG,kBAC+B;CAClC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,QAAQ,eAAe,QAAQ,gBAAgB,oBAAoB;CAC3E,MAAM,CAAC,aAAa,kBAAkB,SAAS,KAAK;CAEpD,MAAM,YAAY,kBAAkB,eAAe,IAAI,GAAG,CAAC,CAAC;CAC5D,MAAM,aAAa,kBAAkB,eAAe,KAAK,GAAG,CAAC,CAAC;CAE9D,MAAM,kBACJ,WACC,kBAAkB,0BAA0B,KAAA,IAAY,kBACzD;CAEF,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,UAAD;EACE,cAAY,EACV,kEACA,sBACF;EACA,WAAU;EACV,SAAS;EACT,MAAK;YAEL,oBAAC,iBAAD;GACE,GAAI;GACJ,WAAW,KACT,uDACA,SACF;EACD,CAAA;CACK,CAAA,GACR,oBAAC,OAAD;EACE,cAAY,EACV,8DACA,iBACF;EACA,iBAAiB;EACjB,SAAS;EACT,MAAM;YAEN,oBAAC,iBAAD,EAAwB,QAAU,CAAA;CAC7B,CAAA,CACP,EAAA,CAAA;AAEN"}

package/dist/es/plugins/ChannelDetail/ChannelDetail.mjs

@@ -1,5 +1,5 @@
-import { useComponentContextIcons } from "../../context/useComponentContextIcons.mjs";
 import { Prompt } from "../../components/Dialog/components/Prompt.mjs";
+import { useComponentContextIcons } from "../../context/useComponentContextIcons.mjs";
 import { SECTION_NAVIGATOR_LAYOUT, SectionNavigator } from "./SectionNavigator/SectionNavigator.mjs";
 import { ChannelDetailNavButton } from "./ChannelDetailNavButton.mjs";
 import { ChannelDetailProvider } from "./ChannelDetailContext.mjs";

package/dist/es/plugins/ChannelDetail/ChannelDetail.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelDetail.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/ChannelDetail.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useState } from 'react';\nimport type { Channel } from 'stream-chat';\n\nimport {\n  SECTION_NAVIGATOR_LAYOUT,\n  SectionNavigator,\n  type SectionNavigatorLayout,\n  type SectionNavigatorNavButtonProps,\n  type SectionNavigatorProps,\n  type SectionNavigatorSection,\n} from './SectionNavigator';\nimport { ChannelDetailNavButton } from './ChannelDetailNavButton';\nimport { ChannelDetailProvider } from './ChannelDetailContext';\nimport { ChannelFilesView } from './Views/ChannelFilesView';\nimport { ChannelManagementView } from './Views/ChannelManagementView';\nimport { ChannelMediaView } from './Views/ChannelMediaView';\nimport { ChannelMembersView } from './Views/ChannelMembersView';\nimport { PinnedMessagesView } from './Views/PinnedMessagesView';\nimport { Prompt } from '../../components/Dialog';\nimport { useComponentContextIcons } from '../../context';\n\nconst ChannelManagementNavButtonIcon = () => {\n  const { IconInfo } = useComponentContextIcons();\n  return <IconInfo className='str-chat__channel-detail__action-icon' />;\n};\n\nconst ChannelMembersNavButtonIcon = () => {\n  const { IconUser } = useComponentContextIcons();\n  return <IconUser className='str-chat__channel-detail__action-icon' />;\n};\n\nconst PinnedMessagesNavButtonIcon = () => {\n  const { IconPin } = useComponentContextIcons();\n  return <IconPin className='str-chat__channel-detail__action-icon' />;\n};\n\nconst ChannelMediaNavButtonIcon = () => {\n  const { IconImage } = useComponentContextIcons();\n  return <IconImage className='str-chat__channel-detail__action-icon' />;\n};\n\nconst ChannelFilesNavButtonIcon = () => {\n  const { IconFolder } = useComponentContextIcons();\n  return <IconFolder className='str-chat__channel-detail__action-icon' />;\n};\n\nexport const ChannelManagementNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelManagementNavButtonIcon}\n    title='Channel info'\n  />\n);\n\nexport const ChannelMembersNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelMembersNavButtonIcon}\n    title='Members'\n  />\n);\n\nexport const PinnedMessagesNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={PinnedMessagesNavButtonIcon}\n    title='Pinned messages'\n  />\n);\n\nexport const ChannelMediaNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelMediaNavButtonIcon}\n    title='Photos & videos'\n  />\n);\n\nexport const ChannelFilesNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelFilesNavButtonIcon}\n    title='Files'\n  />\n);\n\nexport const defaultChannelDetailSections: SectionNavigatorSection[] = [\n  {\n    id: 'channel-info',\n    NavButton: ChannelManagementNavButton,\n    SectionContent: ChannelManagementView,\n  },\n  {\n    id: 'channel-members',\n    NavButton: ChannelMembersNavButton,\n    SectionContent: ChannelMembersView,\n  },\n  {\n    id: 'pinned-messages',\n    NavButton: PinnedMessagesNavButton,\n    SectionContent: PinnedMessagesView,\n  },\n  {\n    id: 'channel-media',\n    NavButton: ChannelMediaNavButton,\n    SectionContent: ChannelMediaView,\n  },\n  {\n    id: 'channel-files',\n    NavButton: ChannelFilesNavButton,\n    SectionContent: ChannelFilesView,\n  },\n];\n\nexport type ChannelDetailProps = Omit<SectionNavigatorProps, 'sections'> & {\n  channel: Channel;\n  sections?: SectionNavigatorSection[];\n};\n\nexport const ChannelDetail = ({\n  channel,\n  className,\n  defaultLayout = SECTION_NAVIGATOR_LAYOUT.tabs,\n  sections = defaultChannelDetailSections,\n  ...props\n}: ChannelDetailProps) => {\n  const [layout, setLayout] = useState<SectionNavigatorLayout>(defaultLayout);\n\n  return (\n    <ChannelDetailProvider channel={channel}>\n      <Prompt.Root\n        className={clsx(\n          'str-chat__channel-detail',\n          {\n            'str-chat__channel-detail--inline':\n              layout === SECTION_NAVIGATOR_LAYOUT.inline,\n          },\n          className,\n        )}\n      >\n        <SectionNavigator\n          {...props}\n          defaultLayout={defaultLayout}\n          onLayoutChange={setLayout}\n          sections={sections}\n        />\n      </Prompt.Root>\n    </ChannelDetailProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;AAsBA,IAAM,uCAAuC;CAC3C,MAAM,EAAE,aAAa,yBAAyB;CAC9C,OAAO,oBAAC,UAAD,EAAU,WAAU,wCAAyC,CAAA;AACtE;AAEA,IAAM,oCAAoC;CACxC,MAAM,EAAE,aAAa,yBAAyB;CAC9C,OAAO,oBAAC,UAAD,EAAU,WAAU,wCAAyC,CAAA;AACtE;AAEA,IAAM,oCAAoC;CACxC,MAAM,EAAE,YAAY,yBAAyB;CAC7C,OAAO,oBAAC,SAAD,EAAS,WAAU,wCAAyC,CAAA;AACrE;AAEA,IAAM,kCAAkC;CACtC,MAAM,EAAE,cAAc,yBAAyB;CAC/C,OAAO,oBAAC,WAAD,EAAW,WAAU,wCAAyC,CAAA;AACvE;AAEA,IAAM,kCAAkC;CACtC,MAAM,EAAE,eAAe,yBAAyB;CAChD,OAAO,oBAAC,YAAD,EAAY,WAAU,wCAAyC,CAAA;AACxE;AAEA,IAAa,8BAA8B,UACzC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,2BAA2B,UACtC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,2BAA2B,UACtC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,yBAAyB,UACpC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,yBAAyB,UACpC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,+BAA0D;CACrE;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;AACF;AAOA,IAAa,iBAAiB,EAC5B,SACA,WACA,gBAAgB,yBAAyB,MACzC,WAAW,8BACX,GAAG,YACqB;CACxB,MAAM,CAAC,QAAQ,aAAa,SAAiC,aAAa;CAE1E,OACE,oBAAC,uBAAD;EAAgC;YAC9B,oBAAC,OAAO,MAAR;GACE,WAAW,KACT,4BACA,EACE,oCACE,WAAW,yBAAyB,OACxC,GACA,SACF;aAEA,oBAAC,kBAAD;IACE,GAAI;IACW;IACf,gBAAgB;IACN;GACX,CAAA;EACU,CAAA;CACQ,CAAA;AAE3B"}
+{"version":3,"file":"ChannelDetail.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/ChannelDetail.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useState } from 'react';\nimport type { Channel } from 'stream-chat';\n\nimport {\n  SECTION_NAVIGATOR_LAYOUT,\n  SectionNavigator,\n  type SectionNavigatorLayout,\n  type SectionNavigatorNavButtonProps,\n  type SectionNavigatorProps,\n  type SectionNavigatorSection,\n} from './SectionNavigator';\nimport { ChannelDetailNavButton } from './ChannelDetailNavButton';\nimport { ChannelDetailProvider } from './ChannelDetailContext';\nimport { ChannelFilesView } from './Views/ChannelFilesView';\nimport { ChannelManagementView } from './Views/ChannelManagementView';\nimport { ChannelMediaView } from './Views/ChannelMediaView';\nimport { ChannelMembersView } from './Views/ChannelMembersView';\nimport { PinnedMessagesView } from './Views/PinnedMessagesView';\nimport { Prompt } from '../../components/Dialog';\nimport { useComponentContextIcons } from '../../context';\n\nconst ChannelManagementNavButtonIcon = () => {\n  const { IconInfo } = useComponentContextIcons();\n\n  return <IconInfo className='str-chat__channel-detail__action-icon' />;\n};\n\nconst ChannelMembersNavButtonIcon = () => {\n  const { IconUser } = useComponentContextIcons();\n\n  return <IconUser className='str-chat__channel-detail__action-icon' />;\n};\n\nconst PinnedMessagesNavButtonIcon = () => {\n  const { IconPin } = useComponentContextIcons();\n\n  return <IconPin className='str-chat__channel-detail__action-icon' />;\n};\n\nconst ChannelMediaNavButtonIcon = () => {\n  const { IconImage } = useComponentContextIcons();\n\n  return <IconImage className='str-chat__channel-detail__action-icon' />;\n};\n\nconst ChannelFilesNavButtonIcon = () => {\n  const { IconFolder } = useComponentContextIcons();\n\n  return <IconFolder className='str-chat__channel-detail__action-icon' />;\n};\n\nexport const ChannelManagementNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelManagementNavButtonIcon}\n    title='Channel info'\n  />\n);\n\nexport const ChannelMembersNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelMembersNavButtonIcon}\n    title='Members'\n  />\n);\n\nexport const PinnedMessagesNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={PinnedMessagesNavButtonIcon}\n    title='Pinned messages'\n  />\n);\n\nexport const ChannelMediaNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelMediaNavButtonIcon}\n    title='Photos & videos'\n  />\n);\n\nexport const ChannelFilesNavButton = (props: SectionNavigatorNavButtonProps) => (\n  <ChannelDetailNavButton\n    {...props}\n    LeadingIcon={ChannelFilesNavButtonIcon}\n    title='Files'\n  />\n);\n\nexport const defaultChannelDetailSections: SectionNavigatorSection[] = [\n  {\n    id: 'channel-info',\n    NavButton: ChannelManagementNavButton,\n    SectionContent: ChannelManagementView,\n  },\n  {\n    id: 'channel-members',\n    NavButton: ChannelMembersNavButton,\n    SectionContent: ChannelMembersView,\n  },\n  {\n    id: 'pinned-messages',\n    NavButton: PinnedMessagesNavButton,\n    SectionContent: PinnedMessagesView,\n  },\n  {\n    id: 'channel-media',\n    NavButton: ChannelMediaNavButton,\n    SectionContent: ChannelMediaView,\n  },\n  {\n    id: 'channel-files',\n    NavButton: ChannelFilesNavButton,\n    SectionContent: ChannelFilesView,\n  },\n];\n\nexport type ChannelDetailProps = Omit<SectionNavigatorProps, 'sections'> & {\n  channel: Channel;\n  sections?: SectionNavigatorSection[];\n};\n\nexport const ChannelDetail = ({\n  channel,\n  className,\n  defaultLayout = SECTION_NAVIGATOR_LAYOUT.tabs,\n  sections = defaultChannelDetailSections,\n  ...props\n}: ChannelDetailProps) => {\n  const [layout, setLayout] = useState<SectionNavigatorLayout>(defaultLayout);\n\n  return (\n    <ChannelDetailProvider channel={channel}>\n      <Prompt.Root\n        className={clsx(\n          'str-chat__channel-detail',\n          {\n            'str-chat__channel-detail--inline':\n              layout === SECTION_NAVIGATOR_LAYOUT.inline,\n          },\n          className,\n        )}\n      >\n        <SectionNavigator\n          {...props}\n          defaultLayout={defaultLayout}\n          onLayoutChange={setLayout}\n          sections={sections}\n        />\n      </Prompt.Root>\n    </ChannelDetailProvider>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;AAsBA,IAAM,uCAAuC;CAC3C,MAAM,EAAE,aAAa,yBAAyB;CAE9C,OAAO,oBAAC,UAAD,EAAU,WAAU,wCAAyC,CAAA;AACtE;AAEA,IAAM,oCAAoC;CACxC,MAAM,EAAE,aAAa,yBAAyB;CAE9C,OAAO,oBAAC,UAAD,EAAU,WAAU,wCAAyC,CAAA;AACtE;AAEA,IAAM,oCAAoC;CACxC,MAAM,EAAE,YAAY,yBAAyB;CAE7C,OAAO,oBAAC,SAAD,EAAS,WAAU,wCAAyC,CAAA;AACrE;AAEA,IAAM,kCAAkC;CACtC,MAAM,EAAE,cAAc,yBAAyB;CAE/C,OAAO,oBAAC,WAAD,EAAW,WAAU,wCAAyC,CAAA;AACvE;AAEA,IAAM,kCAAkC;CACtC,MAAM,EAAE,eAAe,yBAAyB;CAEhD,OAAO,oBAAC,YAAD,EAAY,WAAU,wCAAyC,CAAA;AACxE;AAEA,IAAa,8BAA8B,UACzC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,2BAA2B,UACtC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,2BAA2B,UACtC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,yBAAyB,UACpC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,yBAAyB,UACpC,oBAAC,wBAAD;CACE,GAAI;CACJ,aAAa;CACb,OAAM;AACP,CAAA;AAGH,IAAa,+BAA0D;CACrE;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;CACA;EACE,IAAI;EACJ,WAAW;EACX,gBAAgB;CAClB;AACF;AAOA,IAAa,iBAAiB,EAC5B,SACA,WACA,gBAAgB,yBAAyB,MACzC,WAAW,8BACX,GAAG,YACqB;CACxB,MAAM,CAAC,QAAQ,aAAa,SAAiC,aAAa;CAE1E,OACE,oBAAC,uBAAD;EAAgC;YAC9B,oBAAC,OAAO,MAAR;GACE,WAAW,KACT,4BACA,EACE,oCACE,WAAW,yBAAyB,OACxC,GACA,SACF;aAEA,oBAAC,kBAAD;IACE,GAAI;IACW;IACf,gBAAgB;IACN;GACX,CAAA;EACU,CAAA;CACQ,CAAA;AAE3B"}

package/dist/es/plugins/ChannelDetail/ChannelDetailEmptyList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelDetailEmptyList.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/ChannelDetailEmptyList.tsx"],"sourcesContent":["import { useComponentContextIcons } from '../../context';\nimport type { PropsWithChildrenOnly } from '../../types/types';\n\nexport const ChannelDetailEmptyList = ({ children }: PropsWithChildrenOnly) => {\n  const { IconSearch } = useComponentContextIcons();\n  return (\n    <div className='str-chat__channel-detail__channel-members-view__empty-state'>\n      <IconSearch />\n      <div>{children}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAGA,IAAa,0BAA0B,EAAE,eAAsC;CAC7E,MAAM,EAAE,eAAe,yBAAyB;CAChD,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,YAAD,CAAa,CAAA,GACb,oBAAC,OAAD,EAAM,SAAc,CAAA,CACjB;;AAET"}
+{"version":3,"file":"ChannelDetailEmptyList.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/ChannelDetailEmptyList.tsx"],"sourcesContent":["import { useComponentContextIcons } from '../../context';\nimport type { PropsWithChildrenOnly } from '../../types/types';\n\nexport const ChannelDetailEmptyList = ({ children }: PropsWithChildrenOnly) => {\n  const { IconSearch } = useComponentContextIcons();\n\n  return (\n    <div className='str-chat__channel-detail__channel-members-view__empty-state'>\n      <IconSearch />\n      <div>{children}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAGA,IAAa,0BAA0B,EAAE,eAAsC;CAC7E,MAAM,EAAE,eAAe,yBAAyB;CAEhD,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,YAAD,CAAa,CAAA,GACb,oBAAC,OAAD,EAAM,SAAc,CAAA,CACjB;;AAET"}

package/dist/es/plugins/ChannelDetail/ChannelDetailSearchInput.mjs

@@ -1,6 +1,6 @@
-import { useComponentContextIcons } from "../../context/useComponentContextIcons.mjs";
 import { useTranslationContext } from "../../context/TranslationContext.mjs";
 import { TextInput } from "../../components/Form/TextInput.mjs";
+import { useComponentContextIcons } from "../../context/useComponentContextIcons.mjs";
 import React, { useCallback, useEffect, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/plugins/ChannelDetail/ChannelDetailSearchInput.tsx
@@ -17,13 +17,13 @@ var ChannelDetailSearchInput = React.memo(({ autoFocus, onSearchChange, resetKey
 		onSearchChange(value);
 	}, [onSearchChange]);
 	return /* @__PURE__ */ jsx(TextInput, {
-		"aria-label": t("Search"),
+		"aria-label": t("common.search.ariaLabel", "Search"),
 		autoComplete: "off",
 		autoFocus,
 		className: "str-chat__channel-detail__search-input",
 		leading: /* @__PURE__ */ jsx(IconSearch, {}),
 		onChange: handleSearchChange,
-		placeholder: t("Search"),
+		placeholder: t("common.search.ariaLabel", "Search"),
 		type: "search",
 		value: searchInput
 	});

package/dist/es/plugins/ChannelDetail/ChannelDetailSearchInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelDetailSearchInput.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/ChannelDetailSearchInput.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\n\nimport { useComponentContextIcons, useTranslationContext } from '../../context';\nimport { TextInput } from '../../components/Form';\n\nexport type ChannelDetailSearchInputProps = {\n  autoFocus?: boolean;\n  onSearchChange: (query: string) => void;\n  resetKey?: number;\n};\n\nexport const ChannelDetailSearchInput = React.memo(\n  ({ autoFocus, onSearchChange, resetKey }: ChannelDetailSearchInputProps) => {\n    const { IconSearch } = useComponentContextIcons();\n\n    const { t } = useTranslationContext();\n    const [searchInput, setSearchInput] = useState('');\n\n    useEffect(() => {\n      setSearchInput('');\n    }, [resetKey]);\n\n    const handleSearchChange = useCallback(\n      (event: React.ChangeEvent<HTMLInputElement>) => {\n        const { value } = event.target;\n        setSearchInput(value);\n        onSearchChange(value);\n      },\n      [onSearchChange],\n    );\n\n    return (\n      <TextInput\n        aria-label={t('Search')}\n        autoComplete='off'\n        autoFocus={autoFocus}\n        className='str-chat__channel-detail__search-input'\n        leading={<IconSearch />}\n        onChange={handleSearchChange}\n        placeholder={t('Search')}\n        type='search'\n        value={searchInput}\n      />\n    );\n  },\n);\n\nChannelDetailSearchInput.displayName = 'ChannelDetailSearchInput';\n"],"mappings":";;;;;;AAWA,IAAa,2BAA2B,MAAM,MAC3C,EAAE,WAAW,gBAAgB,eAA8C;CAC1E,MAAM,EAAE,eAAe,yBAAyB;CAEhD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,CAAC,aAAa,kBAAkB,SAAS,EAAE;CAEjD,gBAAgB;EACd,eAAe,EAAE;CACnB,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,qBAAqB,aACxB,UAA+C;EAC9C,MAAM,EAAE,UAAU,MAAM;EACxB,eAAe,KAAK;EACpB,eAAe,KAAK;CACtB,GACA,CAAC,cAAc,CACjB;CAEA,OACE,oBAAC,WAAD;EACE,cAAY,EAAE,QAAQ;EACtB,cAAa;EACF;EACX,WAAU;EACV,SAAS,oBAAC,YAAD,CAAa,CAAA;EACtB,UAAU;EACV,aAAa,EAAE,QAAQ;EACvB,MAAK;EACL,OAAO;CACR,CAAA;AAEL,CACF;AAEA,yBAAyB,cAAc"}
+{"version":3,"file":"ChannelDetailSearchInput.mjs","names":[],"sources":["../../../../src/plugins/ChannelDetail/ChannelDetailSearchInput.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\n\nimport { useComponentContextIcons, useTranslationContext } from '../../context';\nimport { TextInput } from '../../components/Form';\n\nexport type ChannelDetailSearchInputProps = {\n  autoFocus?: boolean;\n  onSearchChange: (query: string) => void;\n  resetKey?: number;\n};\n\nexport const ChannelDetailSearchInput = React.memo(\n  ({ autoFocus, onSearchChange, resetKey }: ChannelDetailSearchInputProps) => {\n    const { IconSearch } = useComponentContextIcons();\n    const { t } = useTranslationContext();\n    const [searchInput, setSearchInput] = useState('');\n\n    useEffect(() => {\n      setSearchInput('');\n    }, [resetKey]);\n\n    const handleSearchChange = useCallback(\n      (event: React.ChangeEvent<HTMLInputElement>) => {\n        const { value } = event.target;\n        setSearchInput(value);\n        onSearchChange(value);\n      },\n      [onSearchChange],\n    );\n\n    return (\n      <TextInput\n        aria-label={t('common.search.ariaLabel', 'Search')}\n        autoComplete='off'\n        autoFocus={autoFocus}\n        className='str-chat__channel-detail__search-input'\n        leading={<IconSearch />}\n        onChange={handleSearchChange}\n        placeholder={t('common.search.ariaLabel', 'Search')}\n        type='search'\n        value={searchInput}\n      />\n    );\n  },\n);\n\nChannelDetailSearchInput.displayName = 'ChannelDetailSearchInput';\n"],"mappings":";;;;;;AAWA,IAAa,2BAA2B,MAAM,MAC3C,EAAE,WAAW,gBAAgB,eAA8C;CAC1E,MAAM,EAAE,eAAe,yBAAyB;CAChD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,CAAC,aAAa,kBAAkB,SAAS,EAAE;CAEjD,gBAAgB;EACd,eAAe,EAAE;CACnB,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,qBAAqB,aACxB,UAA+C;EAC9C,MAAM,EAAE,UAAU,MAAM;EACxB,eAAe,KAAK;EACpB,eAAe,KAAK;CACtB,GACA,CAAC,cAAc,CACjB;CAEA,OACE,oBAAC,WAAD;EACE,cAAY,EAAE,2BAA2B,QAAQ;EACjD,cAAa;EACF;EACX,WAAU;EACV,SAAS,oBAAC,YAAD,CAAa,CAAA;EACtB,UAAU;EACV,aAAa,EAAE,2BAA2B,QAAQ;EAClD,MAAK;EACL,OAAO;CACR,CAAA;AAEL,CACF;AAEA,yBAAyB,cAAc"}

package/dist/es/plugins/ChannelDetail/SectionNavigator/SectionNavigatorHeader.mjs

@@ -1,7 +1,7 @@
-import { useComponentContextIcons } from "../../../context/useComponentContextIcons.mjs";
 import { useTranslationContext } from "../../../context/TranslationContext.mjs";
 import { Button } from "../../../components/Button/Button.mjs";
 import { Prompt } from "../../../components/Dialog/components/Prompt.mjs";
+import { useComponentContextIcons } from "../../../context/useComponentContextIcons.mjs";
 import { SECTION_NAVIGATOR_LAYOUT, useSectionNavigatorContext } from "./SectionNavigator.mjs";
 import { useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -14,16 +14,16 @@ import { jsx } from "react/jsx-runtime";
 * (`goBack`), where it would compete with the back affordance.
 */
 var SectionNavigatorHeader = (props) => {
-	const { IconMenu } = useComponentContextIcons();
-	const { t } = useTranslationContext("SectionNavigatorHeader");
+	const { t } = useTranslationContext();
 	const { layout, openNavigation } = useSectionNavigatorContext();
 	const MenuButton = useMemo(() => {
 		if (layout !== SECTION_NAVIGATOR_LAYOUT.inline) return void 0;
 		if (props.goBack) return void 0;
 		return function SectionNavigatorHeaderMenuButton() {
+			const { IconMenu } = useComponentContextIcons();
 			return /* @__PURE__ */ jsx(Button, {
 				appearance: "ghost",
-				"aria-label": t("Open menu"),
+				"aria-label": t("channelDetail.sectionNavigatorHeader.openMenu.ariaLabel", "Open menu"),
 				circular: true,
 				className: "str-chat__section-navigator__header-menu-button",
 				onClick: openNavigation,
@@ -33,7 +33,6 @@ var SectionNavigatorHeader = (props) => {
 			});
 		};
 	}, [
-		IconMenu,
 		layout,
 		openNavigation,
 		props.goBack,

package/dist/es/plugins/ChannelDetail/SectionNavigator/SectionNavigatorHeader.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SectionNavigatorHeader.mjs","names":[],"sources":["../../../../../src/plugins/ChannelDetail/SectionNavigator/SectionNavigatorHeader.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { SECTION_NAVIGATOR_LAYOUT, useSectionNavigatorContext } from './SectionNavigator';\nimport { useComponentContextIcons, useTranslationContext } from '../../../context';\nimport { Button } from '../../../components/Button';\nimport { Prompt, type PromptHeaderProps } from '../../../components/Dialog';\n\nexport type SectionNavigatorHeaderProps = Omit<PromptHeaderProps, 'LeadingContent'>;\n\n/**\n * Generic header for content rendered inside a `SectionNavigator`. It renders a\n * `Prompt.Header` and, in the inline layout (where the navigation sidebar is not\n * shown), prepends a hamburger button that opens the navigation drawer. The\n * hamburger is omitted on nested views that already show a back button\n * (`goBack`), where it would compete with the back affordance.\n */\nexport const SectionNavigatorHeader = (props: SectionNavigatorHeaderProps) => {\n  const { IconMenu } = useComponentContextIcons();\n\n  const { t } = useTranslationContext('SectionNavigatorHeader');\n  const { layout, openNavigation } = useSectionNavigatorContext();\n\n  const MenuButton = useMemo(() => {\n    if (layout !== SECTION_NAVIGATOR_LAYOUT.inline) return undefined;\n    if (props.goBack) return undefined;\n\n    return function SectionNavigatorHeaderMenuButton() {\n      return (\n        <Button\n          appearance='ghost'\n          aria-label={t('Open menu')}\n          circular\n          className='str-chat__section-navigator__header-menu-button'\n          onClick={openNavigation}\n          size='md'\n          variant='secondary'\n        >\n          <IconMenu />\n        </Button>\n      );\n    };\n  }, [IconMenu, layout, openNavigation, props.goBack, t]);\n\n  return <Prompt.Header {...props} LeadingContent={MenuButton} />;\n};\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,IAAa,0BAA0B,UAAuC;CAC5E,MAAM,EAAE,aAAa,yBAAyB;CAE9C,MAAM,EAAE,MAAM,sBAAsB,wBAAwB;CAC5D,MAAM,EAAE,QAAQ,mBAAmB,2BAA2B;CAE9D,MAAM,aAAa,cAAc;EAC/B,IAAI,WAAW,yBAAyB,QAAQ,OAAO,KAAA;EACvD,IAAI,MAAM,QAAQ,OAAO,KAAA;EAEzB,OAAO,SAAS,mCAAmC;GACjD,OACE,oBAAC,QAAD;IACE,YAAW;IACX,cAAY,EAAE,WAAW;IACzB,UAAA;IACA,WAAU;IACV,SAAS;IACT,MAAK;IACL,SAAQ;cAER,oBAAC,UAAD,CAAW,CAAA;GACL,CAAA;EAEZ;CACF,GAAG;EAAC;EAAU;EAAQ;EAAgB,MAAM;EAAQ;CAAC,CAAC;CAEtD,OAAO,oBAAC,OAAO,QAAR;EAAe,GAAI;EAAO,gBAAgB;CAAa,CAAA;AAChE"}
+{"version":3,"file":"SectionNavigatorHeader.mjs","names":[],"sources":["../../../../../src/plugins/ChannelDetail/SectionNavigator/SectionNavigatorHeader.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\n\nimport { SECTION_NAVIGATOR_LAYOUT, useSectionNavigatorContext } from './SectionNavigator';\nimport { useComponentContextIcons, useTranslationContext } from '../../../context';\nimport { Button } from '../../../components/Button';\nimport { Prompt, type PromptHeaderProps } from '../../../components/Dialog';\n\nexport type SectionNavigatorHeaderProps = Omit<PromptHeaderProps, 'LeadingContent'>;\n\n/**\n * Generic header for content rendered inside a `SectionNavigator`. It renders a\n * `Prompt.Header` and, in the inline layout (where the navigation sidebar is not\n * shown), prepends a hamburger button that opens the navigation drawer. The\n * hamburger is omitted on nested views that already show a back button\n * (`goBack`), where it would compete with the back affordance.\n */\nexport const SectionNavigatorHeader = (props: SectionNavigatorHeaderProps) => {\n  const { t } = useTranslationContext();\n  const { layout, openNavigation } = useSectionNavigatorContext();\n\n  const MenuButton = useMemo(() => {\n    if (layout !== SECTION_NAVIGATOR_LAYOUT.inline) return undefined;\n    if (props.goBack) return undefined;\n\n    return function SectionNavigatorHeaderMenuButton() {\n      const { IconMenu } = useComponentContextIcons();\n      return (\n        <Button\n          appearance='ghost'\n          aria-label={t(\n            'channelDetail.sectionNavigatorHeader.openMenu.ariaLabel',\n            'Open menu',\n          )}\n          circular\n          className='str-chat__section-navigator__header-menu-button'\n          onClick={openNavigation}\n          size='md'\n          variant='secondary'\n        >\n          <IconMenu />\n        </Button>\n      );\n    };\n  }, [layout, openNavigation, props.goBack, t]);\n\n  return <Prompt.Header {...props} LeadingContent={MenuButton} />;\n};\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,IAAa,0BAA0B,UAAuC;CAC5E,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,QAAQ,mBAAmB,2BAA2B;CAE9D,MAAM,aAAa,cAAc;EAC/B,IAAI,WAAW,yBAAyB,QAAQ,OAAO,KAAA;EACvD,IAAI,MAAM,QAAQ,OAAO,KAAA;EAEzB,OAAO,SAAS,mCAAmC;GACjD,MAAM,EAAE,aAAa,yBAAyB;GAC9C,OACE,oBAAC,QAAD;IACE,YAAW;IACX,cAAY,EACV,2DACA,WACF;IACA,UAAA;IACA,WAAU;IACV,SAAS;IACT,MAAK;IACL,SAAQ;cAER,oBAAC,UAAD,CAAW,CAAA;GACL,CAAA;EAEZ;CACF,GAAG;EAAC;EAAQ;EAAgB,MAAM;EAAQ;CAAC,CAAC;CAE5C,OAAO,oBAAC,OAAO,QAAR;EAAe,GAAI;EAAO,gBAAgB;CAAa,CAAA;AAChE"}

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesEmptyList.mjs

@@ -1,20 +1,20 @@
-import { useComponentContextIcons } from "../../../../context/useComponentContextIcons.mjs";
 import { useTranslationContext } from "../../../../context/TranslationContext.mjs";
+import { useComponentContextIcons } from "../../../../context/useComponentContextIcons.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesEmptyList.tsx
 var ChannelFilesEmptyList = () => {
 	const { IconFolder } = useComponentContextIcons();
-	const { t } = useTranslationContext("ChannelFilesEmptyList");
+	const { t } = useTranslationContext();
 	return /* @__PURE__ */ jsxs("div", {
 		className: "str-chat__channel-detail__files-view__empty-state",
 		children: [/* @__PURE__ */ jsx(IconFolder, { className: "str-chat__channel-detail__files-view__empty-state__icon" }), /* @__PURE__ */ jsxs("div", {
 			className: "str-chat__channel-detail__files-view__empty-state__content",
 			children: [/* @__PURE__ */ jsx("p", {
 				className: "str-chat__channel-detail__files-view__empty-state__title",
-				children: t("No files")
+				children: t("channelDetail.channelFilesEmpty.noFiles.text", "No files")
 			}), /* @__PURE__ */ jsx("p", {
 				className: "str-chat__channel-detail__files-view__empty-state__description",
-				children: t("Share a file to see it here")
+				children: t("channelDetail.channelFilesEmpty.shareFileSee.text", "Share a file to see it here")
 			})]
 		})]
 	});

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesEmptyList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelFilesEmptyList.mjs","names":[],"sources":["../../../../../../src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesEmptyList.tsx"],"sourcesContent":["import { useComponentContextIcons, useTranslationContext } from '../../../../context';\n\nexport const ChannelFilesEmptyList = () => {\n  const { IconFolder } = useComponentContextIcons();\n\n  const { t } = useTranslationContext('ChannelFilesEmptyList');\n\n  return (\n    <div className='str-chat__channel-detail__files-view__empty-state'>\n      <IconFolder className='str-chat__channel-detail__files-view__empty-state__icon' />\n      <div className='str-chat__channel-detail__files-view__empty-state__content'>\n        <p className='str-chat__channel-detail__files-view__empty-state__title'>\n          {t('No files')}\n        </p>\n        <p className='str-chat__channel-detail__files-view__empty-state__description'>\n          {t('Share a file to see it here')}\n        </p>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;AAEA,IAAa,8BAA8B;CACzC,MAAM,EAAE,eAAe,yBAAyB;CAEhD,MAAM,EAAE,MAAM,sBAAsB,uBAAuB;CAE3D,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,YAAD,EAAY,WAAU,0DAA2D,CAAA,GACjF,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,oBAAC,KAAD;IAAG,WAAU;cACV,EAAE,UAAU;GACZ,CAAA,GACH,oBAAC,KAAD;IAAG,WAAU;cACV,EAAE,6BAA6B;GAC/B,CAAA,CACA;IACF;;AAET"}
+{"version":3,"file":"ChannelFilesEmptyList.mjs","names":[],"sources":["../../../../../../src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesEmptyList.tsx"],"sourcesContent":["import { useComponentContextIcons, useTranslationContext } from '../../../../context';\n\nexport const ChannelFilesEmptyList = () => {\n  const { IconFolder } = useComponentContextIcons();\n  const { t } = useTranslationContext();\n\n  return (\n    <div className='str-chat__channel-detail__files-view__empty-state'>\n      <IconFolder className='str-chat__channel-detail__files-view__empty-state__icon' />\n      <div className='str-chat__channel-detail__files-view__empty-state__content'>\n        <p className='str-chat__channel-detail__files-view__empty-state__title'>\n          {t('channelDetail.channelFilesEmpty.noFiles.text', 'No files')}\n        </p>\n        <p className='str-chat__channel-detail__files-view__empty-state__description'>\n          {t(\n            'channelDetail.channelFilesEmpty.shareFileSee.text',\n            'Share a file to see it here',\n          )}\n        </p>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;AAEA,IAAa,8BAA8B;CACzC,MAAM,EAAE,eAAe,yBAAyB;CAChD,MAAM,EAAE,MAAM,sBAAsB;CAEpC,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,YAAD,EAAY,WAAU,0DAA2D,CAAA,GACjF,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,oBAAC,KAAD;IAAG,WAAU;cACV,EAAE,gDAAgD,UAAU;GAC5D,CAAA,GACH,oBAAC,KAAD;IAAG,WAAU;cACV,EACC,qDACA,6BACF;GACC,CAAA,CACA;IACF;;AAET"}

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.mjs

@@ -1,9 +1,9 @@
-import { useModalContext } from "../../../../context/ModalContext.mjs";
 import { getDateString } from "../../../../i18n/utils.mjs";
 import { useTranslationContext } from "../../../../context/TranslationContext.mjs";
-import { FileSizeIndicator } from "../../../../components/Attachment/components/FileSizeIndicator.mjs";
 import { Prompt } from "../../../../components/Dialog/components/Prompt.mjs";
+import { FileSizeIndicator } from "../../../../components/Attachment/components/FileSizeIndicator.mjs";
 import { FileIcon } from "../../../../components/FileIcon/FileIcon.mjs";
+import { useModalContext } from "../../../../context/ModalContext.mjs";
 import { ListItemLayout } from "../../../../components/ListItemLayout/ListItemLayout.mjs";
 import { SectionNavigatorHeader } from "../../SectionNavigator/SectionNavigatorHeader.mjs";
 import { ChannelFilesEmptyList } from "./ChannelFilesEmptyList.mjs";
@@ -29,7 +29,7 @@ var ChannelFilesGroup = forwardRef(function ChannelFilesGroup({ className, ...pr
 	});
 });
 var ChannelFilesSectionHeader = ({ timestamp }) => {
-	const { t, tDateTimeParser } = useTranslationContext("ChannelFilesView");
+	const { t, tDateTimeParser } = useTranslationContext();
 	const label = getDateString({
 		format: "MMMM YYYY",
 		messageCreatedAt: timestamp,
@@ -47,22 +47,23 @@ var ChannelFileListItem = ({ item }) => {
 	const { attachment } = item;
 	const fileName = getAttachmentFileName(attachment);
 	const assetUrl = attachment.asset_url;
+	const { file_size: fileSize, mime_type: mimeType } = attachment.custom ?? {};
 	const LeadingSlot = useMemo(() => function FileListItemIcon() {
 		return /* @__PURE__ */ jsx(FileIcon, {
 			className: "str-chat__channel-detail__files-view__list-item__icon",
 			fileName,
-			mimeType: attachment.mime_type,
+			mimeType,
 			size: "md"
 		});
-	}, [attachment.mime_type, fileName]);
+	}, [mimeType, fileName]);
 	const sharedProps = useMemo(() => ({
 		LeadingSlot,
-		subtitle: /* @__PURE__ */ jsx(FileSizeIndicator, { fileSize: attachment.file_size }),
+		subtitle: /* @__PURE__ */ jsx(FileSizeIndicator, { fileSize }),
 		subtitleClassName: "str-chat__channel-detail__files-view__list-item__size",
 		title: fileName,
 		titleClassName: "str-chat__channel-detail__files-view__list-item__name"
 	}), [
-		attachment.file_size,
+		fileSize,
 		fileName,
 		LeadingSlot
 	]);
@@ -110,7 +111,7 @@ var ChannelFilesView = () => {
 		className: "str-chat__channel-detail__files-view",
 		children: [/* @__PURE__ */ jsx(SectionNavigatorHeader, {
 			close,
-			title: t("Files")
+			title: t("channelDetail.channelFilesView.files.title", "Files")
 		}), /* @__PURE__ */ jsx(Prompt.Body, {
 			className: "str-chat__channel-detail__files-view__body",
 			children: /* @__PURE__ */ jsx(GroupedVirtuoso, {

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelFilesView.mjs","names":[],"sources":["../../../../../../src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ComponentProps } from 'react';\nimport React, { forwardRef, useCallback, useMemo } from 'react';\nimport { GroupedVirtuoso } from 'react-virtuoso';\n\nimport { useModalContext, useTranslationContext } from '../../../../context';\nimport { getDateString } from '../../../../i18n/utils';\nimport { FileSizeIndicator } from '../../../../components/Attachment/components/FileSizeIndicator';\nimport { Prompt } from '../../../../components/Dialog';\nimport { FileIcon } from '../../../../components/FileIcon';\nimport { ListItemLayout } from '../../../../components/ListItemLayout';\nimport {\n  SectionNavigatorHeader,\n  type SectionNavigatorSectionContentProps,\n} from '../../SectionNavigator';\nimport { ChannelDetailListLoadingIndicator } from '../../ChannelDetailListLoadingIndicator';\nimport { ChannelFilesEmptyList } from './ChannelFilesEmptyList';\nimport type { ChannelFileItem } from './ChannelFilesView.utils';\nimport { useChannelFilesSearch } from './useChannelFilesSearch';\n\n// Wraps each virtualized file row so the horizontal inset can be applied to a\n// stable class without padding the full-bleed sticky month headers.\nconst ChannelFilesItem = forwardRef<HTMLDivElement, ComponentProps<'div'>>(\n  function ChannelFilesItem({ className, ...props }, ref) {\n    return (\n      <div\n        {...props}\n        className={clsx('str-chat__channel-detail__files-view__item', className)}\n        ref={ref}\n      />\n    );\n  },\n);\n\n// Wraps each sticky month header. react-virtuoso applies `position: sticky` but\n// leaves `top: auto`, so the headers never pin to the scroller top and\n// consecutive months overlap; the class supplies the required `top: 0`.\nconst ChannelFilesGroup = forwardRef<HTMLDivElement, ComponentProps<'div'>>(\n  function ChannelFilesGroup({ className, ...props }, ref) {\n    return (\n      <div\n        {...props}\n        className={clsx('str-chat__channel-detail__files-view__group', className)}\n        ref={ref}\n      />\n    );\n  },\n);\n\nconst ChannelFilesSectionHeader = ({ timestamp }: { timestamp?: string }) => {\n  const { t, tDateTimeParser } = useTranslationContext('ChannelFilesView');\n  const label = getDateString({\n    format: 'MMMM YYYY',\n    messageCreatedAt: timestamp,\n    t,\n    tDateTimeParser,\n  });\n\n  if (!label) return null;\n\n  return (\n    <div className='str-chat__channel-detail__files-view__section-header'>{label}</div>\n  );\n};\n\nconst getAttachmentFileName = (attachment: ChannelFileItem['attachment']) =>\n  attachment.title || attachment.fallback || '';\n\nconst ChannelFileListItem = ({ item }: { item: ChannelFileItem }) => {\n  const { attachment } = item;\n  const fileName = getAttachmentFileName(attachment);\n  const assetUrl = attachment.asset_url;\n\n  const LeadingSlot = useMemo(\n    () =>\n      function FileListItemIcon() {\n        return (\n          <FileIcon\n            className='str-chat__channel-detail__files-view__list-item__icon'\n            fileName={fileName}\n            mimeType={attachment.mime_type}\n            size='md'\n          />\n        );\n      },\n    [attachment.mime_type, fileName],\n  );\n\n  const sharedProps = useMemo(\n    () => ({\n      LeadingSlot,\n      subtitle: <FileSizeIndicator fileSize={attachment.file_size} />,\n      subtitleClassName: 'str-chat__channel-detail__files-view__list-item__size',\n      title: fileName,\n      titleClassName: 'str-chat__channel-detail__files-view__list-item__name',\n    }),\n    [attachment.file_size, fileName, LeadingSlot],\n  );\n\n  const linkRootProps = useMemo(\n    () => ({\n      className: 'str-chat__channel-detail__files-view__list-item',\n      download: fileName || undefined,\n      href: assetUrl,\n      rel: 'noopener noreferrer',\n      target: '_blank',\n    }),\n    [assetUrl, fileName],\n  );\n\n  const divRootProps = useMemo(\n    () => ({ className: 'str-chat__channel-detail__files-view__list-item' }),\n    [],\n  );\n\n  if (assetUrl) {\n    return <ListItemLayout {...sharedProps} RootElement='a' rootProps={linkRootProps} />;\n  }\n\n  return <ListItemLayout {...sharedProps} RootElement='div' rootProps={divRootProps} />;\n};\n\nexport type ChannelFilesViewProps = SectionNavigatorSectionContentProps;\n\nexport const ChannelFilesView: React.ComponentType<ChannelFilesViewProps> = () => {\n  const { t } = useTranslationContext();\n  const { close } = useModalContext();\n  const { channelFilesSearchSource, fileItems, groupCounts, hasResultsLoaded, sections } =\n    useChannelFilesSearch();\n\n  const groupContent = useCallback(\n    (groupIndex: number) => (\n      <ChannelFilesSectionHeader timestamp={sections[groupIndex]?.timestamp} />\n    ),\n    [sections],\n  );\n\n  // In grouped mode the `index` passed here is the flat item index (0-based\n  // across all items, excluding group headers), so it indexes `fileItems`\n  // directly. We intentionally don't pass `computeItemKey`: GroupedVirtuoso\n  // calls it with the absolute group+item location index (and no item data),\n  // so it can't be used to look items up — the default position keys are\n  // correct for this append-only list.\n  const itemContent = useCallback(\n    (index: number) => <ChannelFileListItem item={fileItems[index]} />,\n    [fileItems],\n  );\n\n  const atBottomStateChange = useCallback(\n    (atBottom: boolean) => {\n      if (atBottom) channelFilesSearchSource.search();\n    },\n    [channelFilesSearchSource],\n  );\n\n  const EmptyPlaceholder = useMemo(\n    () =>\n      function ChannelFilesEmptyPlaceholder() {\n        return hasResultsLoaded ? <ChannelFilesEmptyList /> : null;\n      },\n    [hasResultsLoaded],\n  );\n\n  const Footer = useMemo(\n    () =>\n      function ChannelFilesListFooter() {\n        return (\n          <ChannelDetailListLoadingIndicator searchSource={channelFilesSearchSource} />\n        );\n      },\n    [channelFilesSearchSource],\n  );\n\n  const components = useMemo(\n    () => ({\n      EmptyPlaceholder,\n      Footer,\n      Group: ChannelFilesGroup,\n      Item: ChannelFilesItem,\n    }),\n    [EmptyPlaceholder, Footer],\n  );\n\n  return (\n    <div className='str-chat__channel-detail__files-view'>\n      <SectionNavigatorHeader close={close} title={t('Files')} />\n      <Prompt.Body className='str-chat__channel-detail__files-view__body'>\n        <GroupedVirtuoso\n          atBottomStateChange={atBottomStateChange}\n          className='str-chat__virtualized-list str-chat__channel-detail__files-view__list'\n          components={components}\n          groupContent={groupContent}\n          groupCounts={groupCounts}\n          itemContent={itemContent}\n        />\n      </Prompt.Body>\n    </div>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"ChannelFilesView.mjs","names":[],"sources":["../../../../../../src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { ComponentProps } from 'react';\nimport React, { forwardRef, useCallback, useMemo } from 'react';\nimport { GroupedVirtuoso } from 'react-virtuoso';\n\nimport { useModalContext, useTranslationContext } from '../../../../context';\nimport { getDateString } from '../../../../i18n/utils';\nimport { FileSizeIndicator } from '../../../../components/Attachment/components/FileSizeIndicator';\nimport { Prompt } from '../../../../components/Dialog';\nimport { FileIcon } from '../../../../components/FileIcon';\nimport { ListItemLayout } from '../../../../components/ListItemLayout';\nimport {\n  SectionNavigatorHeader,\n  type SectionNavigatorSectionContentProps,\n} from '../../SectionNavigator';\nimport { ChannelDetailListLoadingIndicator } from '../../ChannelDetailListLoadingIndicator';\nimport { ChannelFilesEmptyList } from './ChannelFilesEmptyList';\nimport type { ChannelFileItem } from './ChannelFilesView.utils';\nimport { useChannelFilesSearch } from './useChannelFilesSearch';\n\n// Wraps each virtualized file row so the horizontal inset can be applied to a\n// stable class without padding the full-bleed sticky month headers.\nconst ChannelFilesItem = forwardRef<HTMLDivElement, ComponentProps<'div'>>(\n  function ChannelFilesItem({ className, ...props }, ref) {\n    return (\n      <div\n        {...props}\n        className={clsx('str-chat__channel-detail__files-view__item', className)}\n        ref={ref}\n      />\n    );\n  },\n);\n\n// Wraps each sticky month header. react-virtuoso applies `position: sticky` but\n// leaves `top: auto`, so the headers never pin to the scroller top and\n// consecutive months overlap; the class supplies the required `top: 0`.\nconst ChannelFilesGroup = forwardRef<HTMLDivElement, ComponentProps<'div'>>(\n  function ChannelFilesGroup({ className, ...props }, ref) {\n    return (\n      <div\n        {...props}\n        className={clsx('str-chat__channel-detail__files-view__group', className)}\n        ref={ref}\n      />\n    );\n  },\n);\n\nconst ChannelFilesSectionHeader = ({ timestamp }: { timestamp?: string }) => {\n  const { t, tDateTimeParser } = useTranslationContext();\n  const label = getDateString({\n    format: 'MMMM YYYY',\n    messageCreatedAt: timestamp,\n    t,\n    tDateTimeParser,\n  });\n\n  if (!label) return null;\n\n  return (\n    <div className='str-chat__channel-detail__files-view__section-header'>{label}</div>\n  );\n};\n\nconst getAttachmentFileName = (attachment: ChannelFileItem['attachment']) =>\n  attachment.title || attachment.fallback || '';\n\nconst ChannelFileListItem = ({ item }: { item: ChannelFileItem }) => {\n  const { attachment } = item;\n  const fileName = getAttachmentFileName(attachment);\n  const assetUrl = attachment.asset_url;\n  const { file_size: fileSize, mime_type: mimeType } = attachment.custom ?? {};\n\n  const LeadingSlot = useMemo(\n    () =>\n      function FileListItemIcon() {\n        return (\n          <FileIcon\n            className='str-chat__channel-detail__files-view__list-item__icon'\n            fileName={fileName}\n            mimeType={mimeType}\n            size='md'\n          />\n        );\n      },\n    [mimeType, fileName],\n  );\n\n  const sharedProps = useMemo(\n    () => ({\n      LeadingSlot,\n      subtitle: <FileSizeIndicator fileSize={fileSize} />,\n      subtitleClassName: 'str-chat__channel-detail__files-view__list-item__size',\n      title: fileName,\n      titleClassName: 'str-chat__channel-detail__files-view__list-item__name',\n    }),\n    [fileSize, fileName, LeadingSlot],\n  );\n\n  const linkRootProps = useMemo(\n    () => ({\n      className: 'str-chat__channel-detail__files-view__list-item',\n      download: fileName || undefined,\n      href: assetUrl,\n      rel: 'noopener noreferrer',\n      target: '_blank',\n    }),\n    [assetUrl, fileName],\n  );\n\n  const divRootProps = useMemo(\n    () => ({ className: 'str-chat__channel-detail__files-view__list-item' }),\n    [],\n  );\n\n  if (assetUrl) {\n    return <ListItemLayout {...sharedProps} RootElement='a' rootProps={linkRootProps} />;\n  }\n\n  return <ListItemLayout {...sharedProps} RootElement='div' rootProps={divRootProps} />;\n};\n\nexport type ChannelFilesViewProps = SectionNavigatorSectionContentProps;\n\nexport const ChannelFilesView: React.ComponentType<ChannelFilesViewProps> = () => {\n  const { t } = useTranslationContext();\n  const { close } = useModalContext();\n  const { channelFilesSearchSource, fileItems, groupCounts, hasResultsLoaded, sections } =\n    useChannelFilesSearch();\n\n  const groupContent = useCallback(\n    (groupIndex: number) => (\n      <ChannelFilesSectionHeader timestamp={sections[groupIndex]?.timestamp} />\n    ),\n    [sections],\n  );\n\n  // In grouped mode the `index` passed here is the flat item index (0-based\n  // across all items, excluding group headers), so it indexes `fileItems`\n  // directly. We intentionally don't pass `computeItemKey`: GroupedVirtuoso\n  // calls it with the absolute group+item location index (and no item data),\n  // so it can't be used to look items up — the default position keys are\n  // correct for this append-only list.\n  const itemContent = useCallback(\n    (index: number) => <ChannelFileListItem item={fileItems[index]} />,\n    [fileItems],\n  );\n\n  const atBottomStateChange = useCallback(\n    (atBottom: boolean) => {\n      if (atBottom) channelFilesSearchSource.search();\n    },\n    [channelFilesSearchSource],\n  );\n\n  const EmptyPlaceholder = useMemo(\n    () =>\n      function ChannelFilesEmptyPlaceholder() {\n        return hasResultsLoaded ? <ChannelFilesEmptyList /> : null;\n      },\n    [hasResultsLoaded],\n  );\n\n  const Footer = useMemo(\n    () =>\n      function ChannelFilesListFooter() {\n        return (\n          <ChannelDetailListLoadingIndicator searchSource={channelFilesSearchSource} />\n        );\n      },\n    [channelFilesSearchSource],\n  );\n\n  const components = useMemo(\n    () => ({\n      EmptyPlaceholder,\n      Footer,\n      Group: ChannelFilesGroup,\n      Item: ChannelFilesItem,\n    }),\n    [EmptyPlaceholder, Footer],\n  );\n\n  return (\n    <div className='str-chat__channel-detail__files-view'>\n      <SectionNavigatorHeader\n        close={close}\n        title={t('channelDetail.channelFilesView.files.title', 'Files')}\n      />\n      <Prompt.Body className='str-chat__channel-detail__files-view__body'>\n        <GroupedVirtuoso\n          atBottomStateChange={atBottomStateChange}\n          className='str-chat__virtualized-list str-chat__channel-detail__files-view__list'\n          components={components}\n          groupContent={groupContent}\n          groupCounts={groupCounts}\n          itemContent={itemContent}\n        />\n      </Prompt.Body>\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.utils.mjs

@@ -1,13 +1,14 @@
-import { isDate } from "../../../../i18n/utils.mjs";
-import { isScrapedContent } from "stream-chat";
+import { convertTimestampToDate, isScrapedContent } from "stream-chat";
 //#region src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.utils.ts
 /** Attachment types listed by the files view (everything that is not an image/video). */
 var FILE_ATTACHMENT_TYPES = ["file", "audio"];
 var FILE_ATTACHMENT_TYPE_SET = new Set(FILE_ATTACHMENT_TYPES);
-var normalizeTimestamp = (timestamp) => {
-	if (!timestamp) return void 0;
-	return isDate(timestamp) ? timestamp.toISOString() : timestamp;
-};
+/**
+* A wire timestamp as an ISO string — what `getDateString` accepts, what the month key slices, and
+* what `byCreatedAtDesc` compares. `convertTimestampToDate` rather than `new Date`: a nanosecond value is out of
+* Date's range, so constructing one directly yields an Invalid Date.
+*/
+var normalizeTimestamp = (timestamp) => timestamp == null ? void 0 : convertTimestampToDate(timestamp)?.toISOString();
 var isChannelFileAttachment = (attachment) => !isScrapedContent(attachment) && !!attachment.type && FILE_ATTACHMENT_TYPE_SET.has(attachment.type);
 var byCreatedAtDesc = (a, b) => (b.createdAt ?? "").localeCompare(a.createdAt ?? "");
 /**

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.utils.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChannelFilesView.utils.mjs","names":[],"sources":["../../../../../../src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.utils.ts"],"sourcesContent":["import {\n  type Attachment,\n  isScrapedContent,\n  type LocalMessage,\n  type MessageResponse,\n} from 'stream-chat';\n\nimport { isDate } from '../../../../i18n/utils';\n\n/** Attachment types listed by the files view (everything that is not an image/video). */\nexport const FILE_ATTACHMENT_TYPES = ['file', 'audio'] as const;\n\nexport type ChannelFileAttachmentType = (typeof FILE_ATTACHMENT_TYPES)[number];\n\nconst FILE_ATTACHMENT_TYPE_SET = new Set<string>(FILE_ATTACHMENT_TYPES);\n\nexport type ChannelFileItem = {\n  /** Raw attachment to render (no transformation applied). */\n  attachment: Attachment;\n  /** Stable identity (messageId + attachment index). */\n  id: string;\n  /** ISO timestamp of the carrying message, used for the month sections. */\n  createdAt?: string;\n};\n\nexport type ChannelFileSection = {\n  /** Stable grouping key (`YYYY-MM` or `unknown`). */\n  key: string;\n  /** Representative timestamp used to render the section header. */\n  timestamp?: string;\n};\n\nexport type ChannelFileSections = {\n  /**\n   * Item counts per section, aligned 1:1 with `sections`. Maps directly onto\n   * GroupedVirtuoso's `groupCounts`; `sum(groupCounts) === items.length`.\n   */\n  groupCounts: number[];\n  /** Flat list of items in display order, grouped contiguously by section. */\n  items: ChannelFileItem[];\n  /** Section headers (month/year), aligned 1:1 with `groupCounts`. */\n  sections: ChannelFileSection[];\n};\n\nconst normalizeTimestamp = (timestamp?: string | Date) => {\n  if (!timestamp) return undefined;\n  return isDate(timestamp) ? timestamp.toISOString() : timestamp;\n};\n\nconst isChannelFileAttachment = (attachment: Attachment) =>\n  !isScrapedContent(attachment) &&\n  !!attachment.type &&\n  FILE_ATTACHMENT_TYPE_SET.has(attachment.type);\n\nconst byCreatedAtDesc = (a: ChannelFileItem, b: ChannelFileItem) =>\n  (b.createdAt ?? '').localeCompare(a.createdAt ?? '');\n\n/**\n * Flattens messages into file/audio attachment items organized into descending\n * month/year sections (newest first), in a single pass over the attachments.\n *\n * The result is shaped for GroupedVirtuoso: a single flat `items` array (items\n * grouped contiguously by section) plus `groupCounts`/`sections` aligned with\n * it, so the view never has to re-flatten. The raw attachment is kept\n * untransformed; only the carrying message timestamp is captured for headers.\n */\nexport const toChannelFileSections = (\n  messages: Array<MessageResponse | LocalMessage>,\n): ChannelFileSections => {\n  const groups: Array<ChannelFileSection & { items: ChannelFileItem[] }> = [];\n  const groupIndexByKey = new Map<string, number>();\n\n  messages.forEach((message) => {\n    const createdAt = normalizeTimestamp(message.created_at);\n    const key = createdAt ? createdAt.slice(0, 7) : 'unknown';\n\n    message.attachments?.forEach((attachment, index) => {\n      if (!isChannelFileAttachment(attachment)) return;\n\n      const item: ChannelFileItem = {\n        attachment,\n        createdAt,\n        id: `${message.id}-${index}`,\n      };\n      const existingIndex = groupIndexByKey.get(key);\n\n      if (existingIndex === undefined) {\n        groupIndexByKey.set(key, groups.length);\n        groups.push({ items: [item], key, timestamp: createdAt });\n      } else {\n        groups[existingIndex].items.push(item);\n      }\n    });\n  });\n\n  groups.forEach((group) => {\n    group.items.sort(byCreatedAtDesc);\n    group.timestamp = group.items[0]?.createdAt;\n  });\n  groups.sort((a, b) => (b.timestamp ?? '').localeCompare(a.timestamp ?? ''));\n\n  return {\n    groupCounts: groups.map((group) => group.items.length),\n    items: groups.flatMap((group) => group.items),\n    sections: groups.map(({ key, timestamp }) => ({ key, timestamp })),\n  };\n};\n"],"mappings":";;;;AAUA,IAAa,wBAAwB,CAAC,QAAQ,OAAO;AAIrD,IAAM,2BAA2B,IAAI,IAAY,qBAAqB;AA8BtE,IAAM,sBAAsB,cAA8B;CACxD,IAAI,CAAC,WAAW,OAAO,KAAA;CACvB,OAAO,OAAO,SAAS,IAAI,UAAU,YAAY,IAAI;AACvD;AAEA,IAAM,2BAA2B,eAC/B,CAAC,iBAAiB,UAAU,KAC5B,CAAC,CAAC,WAAW,QACb,yBAAyB,IAAI,WAAW,IAAI;AAE9C,IAAM,mBAAmB,GAAoB,OAC1C,EAAE,aAAa,GAAA,CAAI,cAAc,EAAE,aAAa,EAAE;;;;;;;;;;AAWrD,IAAa,yBACX,aACwB;CACxB,MAAM,SAAmE,CAAC;CAC1E,MAAM,kCAAkB,IAAI,IAAoB;CAEhD,SAAS,SAAS,YAAY;EAC5B,MAAM,YAAY,mBAAmB,QAAQ,UAAU;EACvD,MAAM,MAAM,YAAY,UAAU,MAAM,GAAG,CAAC,IAAI;EAEhD,QAAQ,aAAa,SAAS,YAAY,UAAU;GAClD,IAAI,CAAC,wBAAwB,UAAU,GAAG;GAE1C,MAAM,OAAwB;IAC5B;IACA;IACA,IAAI,GAAG,QAAQ,GAAG,GAAG;GACvB;GACA,MAAM,gBAAgB,gBAAgB,IAAI,GAAG;GAE7C,IAAI,kBAAkB,KAAA,GAAW;IAC/B,gBAAgB,IAAI,KAAK,OAAO,MAAM;IACtC,OAAO,KAAK;KAAE,OAAO,CAAC,IAAI;KAAG;KAAK,WAAW;IAAU,CAAC;GAC1D,OACE,OAAO,cAAc,CAAC,MAAM,KAAK,IAAI;EAEzC,CAAC;CACH,CAAC;CAED,OAAO,SAAS,UAAU;EACxB,MAAM,MAAM,KAAK,eAAe;EAChC,MAAM,YAAY,MAAM,MAAM,EAAE,EAAE;CACpC,CAAC;CACD,OAAO,MAAM,GAAG,OAAO,EAAE,aAAa,GAAA,CAAI,cAAc,EAAE,aAAa,EAAE,CAAC;CAE1E,OAAO;EACL,aAAa,OAAO,KAAK,UAAU,MAAM,MAAM,MAAM;EACrD,OAAO,OAAO,SAAS,UAAU,MAAM,KAAK;EAC5C,UAAU,OAAO,KAAK,EAAE,KAAK,iBAAiB;GAAE;GAAK;EAAU,EAAE;CACnE;AACF"}
+{"version":3,"file":"ChannelFilesView.utils.mjs","names":[],"sources":["../../../../../../src/plugins/ChannelDetail/Views/ChannelFilesView/ChannelFilesView.utils.ts"],"sourcesContent":["import {\n  type Attachment,\n  isScrapedContent,\n  type LocalMessage,\n  type MessageResponse,\n  type TimestampNS,\n} from 'stream-chat';\n\nimport { convertTimestampToDate } from 'stream-chat';\n\n/** Attachment types listed by the files view (everything that is not an image/video). */\nexport const FILE_ATTACHMENT_TYPES = ['file', 'audio'] as const;\n\nexport type ChannelFileAttachmentType = (typeof FILE_ATTACHMENT_TYPES)[number];\n\nconst FILE_ATTACHMENT_TYPE_SET = new Set<string>(FILE_ATTACHMENT_TYPES);\n\nexport type ChannelFileItem = {\n  /** Raw attachment to render (no transformation applied). */\n  attachment: Attachment;\n  /** Stable identity (messageId + attachment index). */\n  id: string;\n  /** ISO timestamp of the carrying message, used for the month sections. */\n  createdAt?: string;\n};\n\nexport type ChannelFileSection = {\n  /** Stable grouping key (`YYYY-MM` or `unknown`). */\n  key: string;\n  /** Representative timestamp used to render the section header. */\n  timestamp?: string;\n};\n\nexport type ChannelFileSections = {\n  /**\n   * Item counts per section, aligned 1:1 with `sections`. Maps directly onto\n   * GroupedVirtuoso's `groupCounts`; `sum(groupCounts) === items.length`.\n   */\n  groupCounts: number[];\n  /** Flat list of items in display order, grouped contiguously by section. */\n  items: ChannelFileItem[];\n  /** Section headers (month/year), aligned 1:1 with `groupCounts`. */\n  sections: ChannelFileSection[];\n};\n\n/**\n * A wire timestamp as an ISO string — what `getDateString` accepts, what the month key slices, and\n * what `byCreatedAtDesc` compares. `convertTimestampToDate` rather than `new Date`: a nanosecond value is out of\n * Date's range, so constructing one directly yields an Invalid Date.\n */\nconst normalizeTimestamp = (timestamp?: TimestampNS) =>\n  timestamp == null ? undefined : convertTimestampToDate(timestamp)?.toISOString();\n\nconst isChannelFileAttachment = (attachment: Attachment) =>\n  !isScrapedContent(attachment) &&\n  !!attachment.type &&\n  FILE_ATTACHMENT_TYPE_SET.has(attachment.type);\n\nconst byCreatedAtDesc = (a: ChannelFileItem, b: ChannelFileItem) =>\n  (b.createdAt ?? '').localeCompare(a.createdAt ?? '');\n\n/**\n * Flattens messages into file/audio attachment items organized into descending\n * month/year sections (newest first), in a single pass over the attachments.\n *\n * The result is shaped for GroupedVirtuoso: a single flat `items` array (items\n * grouped contiguously by section) plus `groupCounts`/`sections` aligned with\n * it, so the view never has to re-flatten. The raw attachment is kept\n * untransformed; only the carrying message timestamp is captured for headers.\n */\nexport const toChannelFileSections = (\n  messages: Array<MessageResponse | LocalMessage>,\n): ChannelFileSections => {\n  const groups: Array<ChannelFileSection & { items: ChannelFileItem[] }> = [];\n  const groupIndexByKey = new Map<string, number>();\n\n  messages.forEach((message) => {\n    const createdAt = normalizeTimestamp(message.created_at);\n    const key = createdAt ? createdAt.slice(0, 7) : 'unknown';\n\n    message.attachments?.forEach((attachment, index) => {\n      if (!isChannelFileAttachment(attachment)) return;\n\n      const item: ChannelFileItem = {\n        attachment,\n        createdAt,\n        id: `${message.id}-${index}`,\n      };\n      const existingIndex = groupIndexByKey.get(key);\n\n      if (existingIndex === undefined) {\n        groupIndexByKey.set(key, groups.length);\n        groups.push({ items: [item], key, timestamp: createdAt });\n      } else {\n        groups[existingIndex].items.push(item);\n      }\n    });\n  });\n\n  groups.forEach((group) => {\n    group.items.sort(byCreatedAtDesc);\n    group.timestamp = group.items[0]?.createdAt;\n  });\n  groups.sort((a, b) => (b.timestamp ?? '').localeCompare(a.timestamp ?? ''));\n\n  return {\n    groupCounts: groups.map((group) => group.items.length),\n    items: groups.flatMap((group) => group.items),\n    sections: groups.map(({ key, timestamp }) => ({ key, timestamp })),\n  };\n};\n"],"mappings":";;;AAWA,IAAa,wBAAwB,CAAC,QAAQ,OAAO;AAIrD,IAAM,2BAA2B,IAAI,IAAY,qBAAqB;;;;;;AAmCtE,IAAM,sBAAsB,cAC1B,aAAa,OAAO,KAAA,IAAY,uBAAuB,SAAS,CAAC,EAAE,YAAY;AAEjF,IAAM,2BAA2B,eAC/B,CAAC,iBAAiB,UAAU,KAC5B,CAAC,CAAC,WAAW,QACb,yBAAyB,IAAI,WAAW,IAAI;AAE9C,IAAM,mBAAmB,GAAoB,OAC1C,EAAE,aAAa,GAAA,CAAI,cAAc,EAAE,aAAa,EAAE;;;;;;;;;;AAWrD,IAAa,yBACX,aACwB;CACxB,MAAM,SAAmE,CAAC;CAC1E,MAAM,kCAAkB,IAAI,IAAoB;CAEhD,SAAS,SAAS,YAAY;EAC5B,MAAM,YAAY,mBAAmB,QAAQ,UAAU;EACvD,MAAM,MAAM,YAAY,UAAU,MAAM,GAAG,CAAC,IAAI;EAEhD,QAAQ,aAAa,SAAS,YAAY,UAAU;GAClD,IAAI,CAAC,wBAAwB,UAAU,GAAG;GAE1C,MAAM,OAAwB;IAC5B;IACA;IACA,IAAI,GAAG,QAAQ,GAAG,GAAG;GACvB;GACA,MAAM,gBAAgB,gBAAgB,IAAI,GAAG;GAE7C,IAAI,kBAAkB,KAAA,GAAW;IAC/B,gBAAgB,IAAI,KAAK,OAAO,MAAM;IACtC,OAAO,KAAK;KAAE,OAAO,CAAC,IAAI;KAAG;KAAK,WAAW;IAAU,CAAC;GAC1D,OACE,OAAO,cAAc,CAAC,MAAM,KAAK,IAAI;EAEzC,CAAC;CACH,CAAC;CAED,OAAO,SAAS,UAAU;EACxB,MAAM,MAAM,KAAK,eAAe;EAChC,MAAM,YAAY,MAAM,MAAM,EAAE,EAAE;CACpC,CAAC;CACD,OAAO,MAAM,GAAG,OAAO,EAAE,aAAa,GAAA,CAAI,cAAc,EAAE,aAAa,EAAE,CAAC;CAE1E,OAAO;EACL,aAAa,OAAO,KAAK,UAAU,MAAM,MAAM,MAAM;EACrD,OAAO,OAAO,SAAS,UAAU,MAAM,KAAK;EAC5C,UAAU,OAAO,KAAK,EAAE,KAAK,iBAAiB;GAAE;GAAK;EAAU,EAAE;CACnE;AACF"}

package/dist/es/plugins/ChannelDetail/Views/ChannelFilesView/useChannelFilesSearch.mjs

@@ -1,5 +1,5 @@
-import { useChatContext } from "../../../../context/ChatContext.mjs";
 import { useStateStore } from "../../../../store/hooks/useStateStore.mjs";
+import { useChatContext } from "../../../../context/ChatContext.mjs";
 import { useChannelDetailContext } from "../../ChannelDetailContext.mjs";
 import { FILE_ATTACHMENT_TYPES, toChannelFileSections } from "./ChannelFilesView.utils.mjs";
 import { useEffect, useMemo } from "react";