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

package/dist/es/components/Poll/PollActions/PollAnswerList.mjs

@@ -0,0 +1,70 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Button } from "../../Button/Button.mjs";
+import { Viewer } from "../../Dialog/components/Viewer.mjs";
+import { InfiniteScrollPaginator } from "../../InfiniteScrollPaginator/InfiniteScrollPaginator.mjs";
+import { LoadingIndicator } from "../../Loading/LoadingIndicator.mjs";
+import { PollVote } from "../PollVote.mjs";
+import { usePollAnswerPagination } from "../hooks/usePollAnswerPagination.mjs";
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/PollAnswerList.tsx
+var pollStateSelector = (nextValue) => ({
+	is_closed: nextValue.is_closed,
+	ownAnswer: nextValue.ownAnswer
+});
+var PollAnswerList = ({ onUpdateOwnAnswerClick }) => {
+	const { client } = useChatContext();
+	const { t } = useTranslationContext();
+	const { poll } = usePollContext();
+	const { close } = useModalContext();
+	const { is_closed } = useStateStore(poll.state, pollStateSelector);
+	const { answers, error, hasNextPage, loading, loadMore } = usePollAnswerPagination();
+	return /* @__PURE__ */ jsxs(Viewer.Root, {
+		className: "str-chat__modal__poll-answer-list",
+		children: [/* @__PURE__ */ jsx(Viewer.Header, {
+			close,
+			description: t("poll.answerList.description", "Review comments submitted with poll answers"),
+			title: t("poll.answerList.pollComments.title", "Poll Comments")
+		}), /* @__PURE__ */ jsxs(Viewer.Body, {
+			className: "str-chat__modal__poll-answer-list__body",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "str-chat__poll-answer-list",
+				children: /* @__PURE__ */ jsxs(InfiniteScrollPaginator, {
+					loadNextOnScrollToBottom: loadMore,
+					threshold: 40,
+					children: [answers.map((answer) => /* @__PURE__ */ jsxs("div", {
+						className: "str-chat__poll-answer",
+						children: [/* @__PURE__ */ jsxs("div", {
+							className: "str-chat__poll-answer__data",
+							children: [answer.answer_text && /* @__PURE__ */ jsx("p", {
+								className: "str-chat__poll-answer__text",
+								children: answer.answer_text
+							}), /* @__PURE__ */ jsx(PollVote, { vote: answer }, `poll-vote-${answer.id}`)]
+						}), !is_closed && answer.user?.id === client.user?.id && /* @__PURE__ */ jsx("div", {
+							className: "str-chat__poll-vote__update-vote-button-container",
+							children: /* @__PURE__ */ jsx(Button, {
+								appearance: "ghost",
+								className: "str-chat__poll-vote__update-vote-button",
+								onClick: onUpdateOwnAnswerClick,
+								size: "md",
+								variant: "secondary",
+								children: t("poll.addCommentPrompt.updateComment.label", "Update Your Comment")
+							})
+						})]
+					}, `comment-${answer.id}`)), hasNextPage && /* @__PURE__ */ jsx("div", {
+						className: "str-chat__loading-indicator-placeholder",
+						children: loading && /* @__PURE__ */ jsx(LoadingIndicator, {})
+					})]
+				})
+			}), error?.message && /* @__PURE__ */ jsx("div", { children: error?.message })]
+		})]
+	});
+};
+//#endregion
+export { PollAnswerList };
+
+//# sourceMappingURL=PollAnswerList.mjs.map

package/dist/es/components/Poll/PollActions/PollAnswerList.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollAnswerList.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/PollAnswerList.tsx"],"sourcesContent":["import React from 'react';\nimport { Button } from '../../Button';\nimport { Viewer } from '../../Dialog';\nimport { PollVote } from '../PollVote';\nimport { usePollAnswerPagination } from '../hooks';\nimport { InfiniteScrollPaginator } from '../../InfiniteScrollPaginator/InfiniteScrollPaginator';\nimport { LoadingIndicator } from '../../Loading';\nimport { useStateStore } from '../../../store';\nimport {\n  useChatContext,\n  useModalContext,\n  usePollContext,\n  useTranslationContext,\n} from '../../../context';\n\nimport type { PollState, PollVoteResponseData } from 'stream-chat';\n\ntype PollStateSelectorReturnValue = {\n  is_closed: boolean | undefined;\n  ownAnswer: PollVoteResponseData | undefined;\n};\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  is_closed: nextValue.is_closed,\n  ownAnswer: nextValue.ownAnswer,\n});\n\nexport type PollAnswerListProps = {\n  onUpdateOwnAnswerClick: () => void;\n};\n\nexport const PollAnswerList = ({ onUpdateOwnAnswerClick }: PollAnswerListProps) => {\n  const { client } = useChatContext();\n  const { t } = useTranslationContext();\n  const { poll } = usePollContext();\n  const { close } = useModalContext();\n  const { is_closed } = useStateStore(poll.state, pollStateSelector);\n\n  const { answers, error, hasNextPage, loading, loadMore } = usePollAnswerPagination();\n\n  return (\n    <Viewer.Root className='str-chat__modal__poll-answer-list'>\n      <Viewer.Header\n        close={close}\n        description={t(\n          'poll.answerList.description',\n          'Review comments submitted with poll answers',\n        )}\n        title={t('poll.answerList.pollComments.title', 'Poll Comments')}\n      />\n      <Viewer.Body className='str-chat__modal__poll-answer-list__body'>\n        <div className='str-chat__poll-answer-list'>\n          <InfiniteScrollPaginator loadNextOnScrollToBottom={loadMore} threshold={40}>\n            {answers.map((answer) => (\n              <div className='str-chat__poll-answer' key={`comment-${answer.id}`}>\n                <div className='str-chat__poll-answer__data'>\n                  {answer.answer_text && (\n                    <p className='str-chat__poll-answer__text'>{answer.answer_text}</p>\n                  )}\n                  <PollVote key={`poll-vote-${answer.id}`} vote={answer} />\n                </div>\n                {!is_closed && answer.user?.id === client.user?.id && (\n                  <div className='str-chat__poll-vote__update-vote-button-container'>\n                    <Button\n                      appearance='ghost'\n                      className='str-chat__poll-vote__update-vote-button'\n                      onClick={onUpdateOwnAnswerClick}\n                      size='md'\n                      variant='secondary'\n                    >\n                      {t(\n                        'poll.addCommentPrompt.updateComment.label',\n                        'Update Your Comment',\n                      )}\n                    </Button>\n                  </div>\n                )}\n              </div>\n            ))}\n\n            {hasNextPage && (\n              <div className='str-chat__loading-indicator-placeholder'>\n                {loading && <LoadingIndicator />}\n              </div>\n            )}\n          </InfiniteScrollPaginator>\n        </div>\n        {error?.message && <div>{error?.message}</div>}\n      </Viewer.Body>\n      {/*<Viewer.Footer>*/}\n      {/*  {answers.length > 0 && !is_closed && (*/}\n      {/*    <Viewer.FooterControls>*/}\n      {/*      <Viewer.FooterControlsButtonSecondary*/}\n      {/*        className='str-chat__poll-action'*/}\n      {/*        onClick={onUpdateOwnAnswerClick}*/}\n      {/*      >*/}\n      {/*        {ownAnswer*/}\n      {/*          ? t('poll.addCommentPrompt.updateComment.label', 'Update Your Comment')*/}\n      {/*          : t('poll.addCommentPrompt.addComment.label', 'Add a Comment')}*/}\n      {/*      </Viewer.FooterControlsButtonSecondary>*/}\n      {/*    </Viewer.FooterControls>*/}\n      {/*  )}*/}\n      {/*</Viewer.Footer>*/}\n    </Viewer.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;AAqBA,IAAM,qBAAqB,eAAwD;CACjF,WAAW,UAAU;CACrB,WAAW,UAAU;AACvB;AAMA,IAAa,kBAAkB,EAAE,6BAAkD;CACjF,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,UAAU,gBAAgB;CAClC,MAAM,EAAE,cAAc,cAAc,KAAK,OAAO,iBAAiB;CAEjE,MAAM,EAAE,SAAS,OAAO,aAAa,SAAS,aAAa,wBAAwB;CAEnF,OACE,qBAAC,OAAO,MAAR;EAAa,WAAU;YAAvB,CACE,oBAAC,OAAO,QAAR;GACS;GACP,aAAa,EACX,+BACA,6CACF;GACA,OAAO,EAAE,sCAAsC,eAAe;EAC/D,CAAA,GACD,qBAAC,OAAO,MAAR;GAAa,WAAU;aAAvB,CACE,oBAAC,OAAD;IAAK,WAAU;cACb,qBAAC,yBAAD;KAAyB,0BAA0B;KAAU,WAAW;eAAxE,CACG,QAAQ,KAAK,WACZ,qBAAC,OAAD;MAAK,WAAU;gBAAf,CACE,qBAAC,OAAD;OAAK,WAAU;iBAAf,CACG,OAAO,eACN,oBAAC,KAAD;QAAG,WAAU;kBAA+B,OAAO;OAAe,CAAA,GAEpE,oBAAC,UAAD,EAAyC,MAAM,OAAS,GAAzC,aAAa,OAAO,IAAqB,CACrD;UACJ,CAAC,aAAa,OAAO,MAAM,OAAO,OAAO,MAAM,MAC9C,oBAAC,OAAD;OAAK,WAAU;iBACb,oBAAC,QAAD;QACE,YAAW;QACX,WAAU;QACV,SAAS;QACT,MAAK;QACL,SAAQ;kBAEP,EACC,6CACA,qBACF;OACM,CAAA;MACL,CAAA,CAEJ;QAvBuC,WAAW,OAAO,IAuBzD,CACN,GAEA,eACC,oBAAC,OAAD;MAAK,WAAU;gBACZ,WAAW,oBAAC,kBAAD,CAAmB,CAAA;KAC5B,CAAA,CAEgB;;GACtB,CAAA,GACJ,OAAO,WAAW,oBAAC,OAAD,EAAA,UAAM,OAAO,QAAa,CAAA,CAClC;IAeF;;AAEjB"}

package/dist/es/components/Poll/PollActions/PollOptionsFullList.mjs

@@ -0,0 +1,32 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Viewer } from "../../Dialog/components/Viewer.mjs";
+import { PollQuestion } from "./PollQuestion.mjs";
+import { PollOptionList } from "../PollOptionList.mjs";
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/PollOptionsFullList.tsx
+var pollStateSelector = (nextValue) => ({ name: nextValue.name });
+var PollOptionsFullList = () => {
+	const { t } = useTranslationContext();
+	const { poll } = usePollContext();
+	const { close } = useModalContext();
+	const { name } = useStateStore(poll.state, pollStateSelector);
+	return /* @__PURE__ */ jsxs(Viewer.Root, {
+		className: "str-chat__modal__poll-option-list",
+		children: [/* @__PURE__ */ jsx(Viewer.Header, {
+			close,
+			description: t("poll.optionsFull.description", "Review all options available in this poll"),
+			title: t("poll.optionsFull.pollOptions.title", "Poll Options")
+		}), /* @__PURE__ */ jsxs(Viewer.Body, {
+			className: "str-chat__modal__poll-option-list__body",
+			children: [/* @__PURE__ */ jsx(PollQuestion, { question: name }), /* @__PURE__ */ jsx(PollOptionList, {})]
+		})]
+	});
+};
+//#endregion
+export { PollOptionsFullList };
+
+//# sourceMappingURL=PollOptionsFullList.mjs.map

package/dist/es/components/Poll/PollActions/PollOptionsFullList.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollOptionsFullList.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/PollOptionsFullList.tsx"],"sourcesContent":["import React from 'react';\nimport { Viewer } from '../../Dialog';\nimport { PollOptionList } from '../PollOptionList';\nimport { useStateStore } from '../../../store';\nimport { useModalContext, usePollContext, useTranslationContext } from '../../../context';\n\nimport type { PollState } from 'stream-chat';\nimport { PollQuestion } from './PollQuestion';\n\ntype PollStateSelectorReturnValue = { name: string };\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  name: nextValue.name,\n});\n\nexport const PollOptionsFullList = () => {\n  const { t } = useTranslationContext();\n  const { poll } = usePollContext();\n  const { close } = useModalContext();\n  const { name } = useStateStore(poll.state, pollStateSelector);\n\n  return (\n    <Viewer.Root className={'str-chat__modal__poll-option-list'}>\n      <Viewer.Header\n        close={close}\n        description={t(\n          'poll.optionsFull.description',\n          'Review all options available in this poll',\n        )}\n        title={t('poll.optionsFull.pollOptions.title', 'Poll Options')}\n      />\n      <Viewer.Body className='str-chat__modal__poll-option-list__body'>\n        <PollQuestion question={name} />\n        <PollOptionList />\n      </Viewer.Body>\n    </Viewer.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;AAUA,IAAM,qBAAqB,eAAwD,EACjF,MAAM,UAAU,KAClB;AAEA,IAAa,4BAA4B;CACvC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,UAAU,gBAAgB;CAClC,MAAM,EAAE,SAAS,cAAc,KAAK,OAAO,iBAAiB;CAE5D,OACE,qBAAC,OAAO,MAAR;EAAa,WAAW;YAAxB,CACE,oBAAC,OAAO,QAAR;GACS;GACP,aAAa,EACX,gCACA,2CACF;GACA,OAAO,EAAE,sCAAsC,cAAc;EAC9D,CAAA,GACD,qBAAC,OAAO,MAAR;GAAa,WAAU;aAAvB,CACE,oBAAC,cAAD,EAAc,UAAU,KAAO,CAAA,GAC/B,oBAAC,gBAAD,CAAiB,CAAA,CACN;IACF;;AAEjB"}

package/dist/es/components/Poll/PollActions/PollQuestion.mjs

@@ -0,0 +1,20 @@
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/PollQuestion.tsx
+var PollQuestion = ({ question }) => {
+	const { t } = useTranslationContext();
+	return /* @__PURE__ */ jsxs("div", {
+		className: "str-chat__modal__poll-question",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "str-chat__modal__poll-question__label",
+			children: t("poll.question.question.text", "Question")
+		}), /* @__PURE__ */ jsx("div", {
+			className: "str-chat__modal__poll-question__text",
+			children: question
+		})]
+	});
+};
+//#endregion
+export { PollQuestion };
+
+//# sourceMappingURL=PollQuestion.mjs.map

package/dist/es/components/Poll/PollActions/PollQuestion.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollQuestion.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/PollQuestion.tsx"],"sourcesContent":["import { useTranslationContext } from '../../../context';\n\nexport type PollQuestionProps = {\n  question: string;\n};\n\nexport const PollQuestion = ({ question }: PollQuestionProps) => {\n  const { t } = useTranslationContext();\n  return (\n    <div className='str-chat__modal__poll-question'>\n      <div className='str-chat__modal__poll-question__label'>\n        {t('poll.question.question.text', 'Question')}\n      </div>\n      <div className='str-chat__modal__poll-question__text'>{question}</div>\n    </div>\n  );\n};\n"],"mappings":";;;AAMA,IAAa,gBAAgB,EAAE,eAAkC;CAC/D,MAAM,EAAE,MAAM,sBAAsB;CACpC,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,OAAD;GAAK,WAAU;aACZ,EAAE,+BAA+B,UAAU;EACzC,CAAA,GACL,oBAAC,OAAD;GAAK,WAAU;aAAwC;EAAc,CAAA,CAClE;;AAET"}

package/dist/es/components/Poll/PollActions/PollResults/PollOptionWithVotes.mjs

@@ -0,0 +1,51 @@
+import { useStateStore } from "../../../../store/hooks/useStateStore.mjs";
+import { useTranslationContext } from "../../../../context/TranslationContext.mjs";
+import { Button } from "../../../Button/Button.mjs";
+import { useChannelCapabilities } from "../../../Channel/hooks/useChannelCapabilities.mjs";
+import { PollVoteListing } from "../../PollVote.mjs";
+import { PollOptionWithVotesHeader } from "./PollOptionWithVotesHeader.mjs";
+import { useChannel } from "../../../../context/useChannel.mjs";
+import { usePollContext } from "../../../../context/PollContext.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+//#region src/components/Poll/PollActions/PollResults/PollOptionWithVotes.tsx
+var pollStateSelector = (nextValue) => ({ latest_votes_by_option: nextValue.latest_votes_by_option });
+var PollOptionWithVotes = ({ countVotesPreview, option, orderNumber, showAllVotes }) => {
+	const channel = useChannel();
+	const { t } = useTranslationContext();
+	const channelCapabilities = useChannelCapabilities({ cid: channel.cid });
+	const { poll } = usePollContext();
+	const { latest_votes_by_option } = useStateStore(poll.state, pollStateSelector);
+	const votes = latest_votes_by_option && latest_votes_by_option[option.id];
+	const voteCount = votes?.length ?? 0;
+	const isVotesPreview = typeof countVotesPreview === "number";
+	return /* @__PURE__ */ jsxs("div", {
+		className: clsx("str-chat__poll-option", {
+			"str-chat__poll-option--has-more-votes": isVotesPreview && voteCount > countVotesPreview,
+			"str-chat__poll-option--has-votes": voteCount
+		}),
+		children: [
+			/* @__PURE__ */ jsx(PollOptionWithVotesHeader, {
+				option,
+				optionOrderNumber: orderNumber
+			}),
+			!!votes && /* @__PURE__ */ jsx(PollVoteListing, { votes: votes.slice(0, countVotesPreview) }),
+			channelCapabilities.has("query-poll-votes") && showAllVotes && isVotesPreview && votes?.length > countVotesPreview && /* @__PURE__ */ jsx("div", {
+				className: "str-chat__poll-option__show-all-votes-button-container",
+				children: /* @__PURE__ */ jsx(Button, {
+					appearance: "ghost",
+					className: "str-chat__poll-option__show-all-votes-button",
+					onClick: showAllVotes,
+					size: "md",
+					variant: "secondary",
+					children: t("poll.optionVotes.view.text", "View all")
+				})
+			})
+		]
+	});
+};
+//#endregion
+export { PollOptionWithVotes };
+
+//# sourceMappingURL=PollOptionWithVotes.mjs.map

package/dist/es/components/Poll/PollActions/PollResults/PollOptionWithVotes.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollOptionWithVotes.mjs","names":[],"sources":["../../../../../../src/components/Poll/PollActions/PollResults/PollOptionWithVotes.tsx"],"sourcesContent":["import React from 'react';\nimport { PollOptionWithVotesHeader } from './PollOptionWithVotesHeader';\nimport { PollVoteListing } from '../../PollVote';\nimport { useStateStore } from '../../../../store';\nimport { useChannel, usePollContext, useTranslationContext } from '../../../../context';\nimport { useChannelCapabilities } from '../../../Channel/hooks/useChannelCapabilities';\nimport type {\n  PollOptionResponseData,\n  PollState,\n  PollVoteResponseData,\n} from 'stream-chat';\nimport { Button } from '../../../Button';\nimport clsx from 'clsx';\n\ntype PollStateSelectorReturnValue = {\n  latest_votes_by_option: Record<string, PollVoteResponseData[]>;\n};\n\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  latest_votes_by_option: nextValue.latest_votes_by_option,\n});\n\nexport type PollOptionWithVotesProps = {\n  option: PollOptionResponseData;\n  orderNumber: number;\n  countVotesPreview?: number;\n  showAllVotes?: () => void;\n};\n\nexport const PollOptionWithVotes = ({\n  countVotesPreview,\n  option,\n  orderNumber,\n  showAllVotes,\n}: PollOptionWithVotesProps) => {\n  const channel = useChannel();\n  const { t } = useTranslationContext();\n  const channelCapabilities = useChannelCapabilities({ cid: channel.cid });\n  const { poll } = usePollContext();\n  const { latest_votes_by_option } = useStateStore(poll.state, pollStateSelector);\n\n  const votes = latest_votes_by_option && latest_votes_by_option[option.id];\n  const voteCount = votes?.length ?? 0;\n  const isVotesPreview = typeof countVotesPreview === 'number';\n\n  return (\n    <div\n      className={clsx('str-chat__poll-option', {\n        'str-chat__poll-option--has-more-votes':\n          isVotesPreview && voteCount > countVotesPreview,\n        'str-chat__poll-option--has-votes': voteCount,\n      })}\n    >\n      <PollOptionWithVotesHeader option={option} optionOrderNumber={orderNumber} />\n      {!!votes && <PollVoteListing votes={votes.slice(0, countVotesPreview)} />}\n      {channelCapabilities.has('query-poll-votes') &&\n        showAllVotes &&\n        isVotesPreview &&\n        votes?.length > countVotesPreview && (\n          <div className='str-chat__poll-option__show-all-votes-button-container'>\n            <Button\n              appearance='ghost'\n              className='str-chat__poll-option__show-all-votes-button'\n              onClick={showAllVotes}\n              size='md'\n              variant='secondary'\n            >\n              {t('poll.optionVotes.view.text', 'View all')}\n            </Button>\n          </div>\n        )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAkBA,IAAM,qBAAqB,eAAwD,EACjF,wBAAwB,UAAU,uBACpC;AASA,IAAa,uBAAuB,EAClC,mBACA,QACA,aACA,mBAC8B;CAC9B,MAAM,UAAU,WAAW;CAC3B,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,sBAAsB,uBAAuB,EAAE,KAAK,QAAQ,IAAI,CAAC;CACvE,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,2BAA2B,cAAc,KAAK,OAAO,iBAAiB;CAE9E,MAAM,QAAQ,0BAA0B,uBAAuB,OAAO;CACtE,MAAM,YAAY,OAAO,UAAU;CACnC,MAAM,iBAAiB,OAAO,sBAAsB;CAEpD,OACE,qBAAC,OAAD;EACE,WAAW,KAAK,yBAAyB;GACvC,yCACE,kBAAkB,YAAY;GAChC,oCAAoC;EACtC,CAAC;YALH;GAOE,oBAAC,2BAAD;IAAmC;IAAQ,mBAAmB;GAAc,CAAA;GAC3E,CAAC,CAAC,SAAS,oBAAC,iBAAD,EAAiB,OAAO,MAAM,MAAM,GAAG,iBAAiB,EAAI,CAAA;GACvE,oBAAoB,IAAI,kBAAkB,KACzC,gBACA,kBACA,OAAO,SAAS,qBACd,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,QAAD;KACE,YAAW;KACX,WAAU;KACV,SAAS;KACT,MAAK;KACL,SAAQ;eAEP,EAAE,8BAA8B,UAAU;IACrC,CAAA;GACL,CAAA;EAEN;;AAET"}

package/dist/es/components/Poll/PollActions/PollResults/PollOptionWithVotesHeader.mjs

@@ -0,0 +1,48 @@
+import { useStateStore } from "../../../../store/hooks/useStateStore.mjs";
+import { useTranslationContext } from "../../../../context/TranslationContext.mjs";
+import { usePollContext } from "../../../../context/PollContext.mjs";
+import { useComponentContextIcons } from "../../../../context/useComponentContextIcons.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/PollResults/PollOptionWithVotesHeader.tsx
+var pollStateSelector = (nextValue) => ({
+	maxVotedOptionIds: nextValue.maxVotedOptionIds,
+	vote_counts_by_option: nextValue.vote_counts_by_option
+});
+var PollResultOptionVoteCounter = ({ optionId }) => {
+	const { IconTrophy } = useComponentContextIcons();
+	const { t } = useTranslationContext();
+	const { poll } = usePollContext();
+	const { maxVotedOptionIds, vote_counts_by_option } = useStateStore(poll.state, pollStateSelector);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "str-chat__poll-result-option-vote-counter",
+		children: [maxVotedOptionIds.length === 1 && maxVotedOptionIds[0] === optionId && /* @__PURE__ */ jsx(IconTrophy, {}), /* @__PURE__ */ jsx("span", {
+			className: "str-chat__poll-result-option-vote-count",
+			children: t("poll.optionVotes.votes.text", {
+				count: vote_counts_by_option[optionId] ?? 0,
+				defaultValue_one: "{{count}} vote",
+				defaultValue_other: "{{count}} votes"
+			})
+		})]
+	});
+};
+var PollOptionWithVotesHeader = ({ option, optionOrderNumber }) => {
+	const { t } = useTranslationContext();
+	return /* @__PURE__ */ jsxs("div", {
+		className: "str-chat__poll-option__header",
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "str-chat__poll-option__header__label",
+			children: t("poll.optionVotes.question.text", "Question {{ optionOrderNumber}}", { optionOrderNumber })
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "str-chat__poll-option__header__title",
+			children: [/* @__PURE__ */ jsx("div", {
+				className: "str-chat__poll-option__option-text",
+				children: option.text
+			}), /* @__PURE__ */ jsx(PollResultOptionVoteCounter, { optionId: option.id })]
+		})]
+	});
+};
+//#endregion
+export { PollOptionWithVotesHeader, PollResultOptionVoteCounter };
+
+//# sourceMappingURL=PollOptionWithVotesHeader.mjs.map

package/dist/es/components/Poll/PollActions/PollResults/PollOptionWithVotesHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollOptionWithVotesHeader.mjs","names":[],"sources":["../../../../../../src/components/Poll/PollActions/PollResults/PollOptionWithVotesHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { useStateStore } from '../../../../store';\nimport {\n  useComponentContextIcons,\n  usePollContext,\n  useTranslationContext,\n} from '../../../../context';\nimport type { PollOptionResponseData, PollState } from 'stream-chat';\n\ntype PollStateSelectorReturnValue = {\n  maxVotedOptionIds: string[];\n  vote_counts_by_option: Record<string, number>;\n};\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  maxVotedOptionIds: nextValue.maxVotedOptionIds,\n  vote_counts_by_option: nextValue.vote_counts_by_option,\n});\n\nexport type PollResultOptionVoteCounterProps = {\n  optionId: string;\n};\n\nexport const PollResultOptionVoteCounter = ({\n  optionId,\n}: PollResultOptionVoteCounterProps) => {\n  const { IconTrophy } = useComponentContextIcons();\n  const { t } = useTranslationContext();\n  const { poll } = usePollContext();\n  const { maxVotedOptionIds, vote_counts_by_option } = useStateStore(\n    poll.state,\n    pollStateSelector,\n  );\n\n  return (\n    <div className='str-chat__poll-result-option-vote-counter'>\n      {maxVotedOptionIds.length === 1 && maxVotedOptionIds[0] === optionId && (\n        <IconTrophy />\n      )}\n      <span className='str-chat__poll-result-option-vote-count'>\n        {t('poll.optionVotes.votes.text', {\n          count: vote_counts_by_option[optionId] ?? 0,\n          defaultValue_one: '{{count}} vote',\n          defaultValue_other: '{{count}} votes',\n        })}\n      </span>\n    </div>\n  );\n};\n\nexport type PollOptionWithVotesHeaderProps = {\n  option: PollOptionResponseData;\n  optionOrderNumber: number;\n};\n\nexport const PollOptionWithVotesHeader = ({\n  option,\n  optionOrderNumber,\n}: PollOptionWithVotesHeaderProps) => {\n  const { t } = useTranslationContext();\n\n  return (\n    <div className='str-chat__poll-option__header'>\n      <div className='str-chat__poll-option__header__label'>\n        {t('poll.optionVotes.question.text', 'Question {{ optionOrderNumber}}', {\n          optionOrderNumber,\n        })}\n      </div>\n      <div className='str-chat__poll-option__header__title'>\n        <div className='str-chat__poll-option__option-text'>{option.text}</div>\n        <PollResultOptionVoteCounter optionId={option.id} />\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;AAaA,IAAM,qBAAqB,eAAwD;CACjF,mBAAmB,UAAU;CAC7B,uBAAuB,UAAU;AACnC;AAMA,IAAa,+BAA+B,EAC1C,eACsC;CACtC,MAAM,EAAE,eAAe,yBAAyB;CAChD,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,mBAAmB,0BAA0B,cACnD,KAAK,OACL,iBACF;CAEA,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACG,kBAAkB,WAAW,KAAK,kBAAkB,OAAO,YAC1D,oBAAC,YAAD,CAAa,CAAA,GAEf,oBAAC,QAAD;GAAM,WAAU;aACb,EAAE,+BAA+B;IAChC,OAAO,sBAAsB,aAAa;IAC1C,kBAAkB;IAClB,oBAAoB;GACtB,CAAC;EACG,CAAA,CACH;;AAET;AAOA,IAAa,6BAA6B,EACxC,QACA,wBACoC;CACpC,MAAM,EAAE,MAAM,sBAAsB;CAEpC,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,OAAD;GAAK,WAAU;aACZ,EAAE,kCAAkC,mCAAmC,EACtE,kBACF,CAAC;EACE,CAAA,GACL,qBAAC,OAAD;GAAK,WAAU;aAAf,CACE,oBAAC,OAAD;IAAK,WAAU;cAAsC,OAAO;GAAU,CAAA,GACtE,oBAAC,6BAAD,EAA6B,UAAU,OAAO,GAAK,CAAA,CAChD;IACF;;AAET"}

package/dist/es/components/Poll/PollActions/PollResults/PollOptionWithVotesList.mjs

@@ -0,0 +1,39 @@
+import { InfiniteScrollPaginator } from "../../../InfiniteScrollPaginator/InfiniteScrollPaginator.mjs";
+import { LoadingIndicator } from "../../../Loading/LoadingIndicator.mjs";
+import { PollVoteListing } from "../../PollVote.mjs";
+import { usePollOptionVotesPagination } from "../../hooks/usePollOptionVotesPagination.mjs";
+import { PollOptionWithVotesHeader } from "./PollOptionWithVotesHeader.mjs";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/PollResults/PollOptionWithVotesList.tsx
+var PollOptionWithVotesList = ({ option, optionOrderNumber }) => {
+	const { hasNextPage, loading, loadMore, votes } = usePollOptionVotesPagination({ paginationParams: useMemo(() => ({ filter: { option_id: option.id } }), [option.id]) });
+	return /* @__PURE__ */ jsx(InfiniteScrollPaginator, {
+		loadNextOnScrollToBottom: loadMore,
+		threshold: 40,
+		children: /* @__PURE__ */ jsx("div", {
+			className: "str-chat_poll-option-with-votes-list",
+			children: /* @__PURE__ */ jsx("div", {
+				className: "str-chat__poll-option",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "str-chat__poll-option__votes-paginated-list",
+					children: [
+						/* @__PURE__ */ jsx(PollOptionWithVotesHeader, {
+							option,
+							optionOrderNumber
+						}),
+						/* @__PURE__ */ jsx(PollVoteListing, { votes }),
+						hasNextPage && /* @__PURE__ */ jsx("div", {
+							className: "str-chat__loading-indicator-placeholder",
+							children: loading && /* @__PURE__ */ jsx(LoadingIndicator, {})
+						})
+					]
+				})
+			})
+		})
+	});
+};
+//#endregion
+export { PollOptionWithVotesList };
+
+//# sourceMappingURL=PollOptionWithVotesList.mjs.map

package/dist/es/components/Poll/PollActions/PollResults/PollOptionWithVotesList.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollOptionWithVotesList.mjs","names":[],"sources":["../../../../../../src/components/Poll/PollActions/PollResults/PollOptionWithVotesList.tsx"],"sourcesContent":["import React, { useMemo } from 'react';\nimport { PollVoteListing } from '../../PollVote';\nimport { usePollOptionVotesPagination } from '../../hooks';\nimport { LoadingIndicator } from '../../../Loading';\nimport { InfiniteScrollPaginator } from '../../../InfiniteScrollPaginator/InfiniteScrollPaginator';\nimport type { PollOptionResponseData, PollOptionVotesQueryParams } from 'stream-chat';\nimport { PollOptionWithVotesHeader } from './PollOptionWithVotesHeader';\n\nexport type PollOptionWithVotesListProps = {\n  option: PollOptionResponseData;\n  optionOrderNumber: number;\n};\n\nexport const PollOptionWithVotesList = ({\n  option,\n  optionOrderNumber,\n}: PollOptionWithVotesListProps) => {\n  const paginationParams = useMemo<PollOptionVotesQueryParams>(\n    () => ({ filter: { option_id: option.id } }),\n    [option.id],\n  );\n  const { hasNextPage, loading, loadMore, votes } = usePollOptionVotesPagination({\n    paginationParams,\n  });\n\n  return (\n    <InfiniteScrollPaginator loadNextOnScrollToBottom={loadMore} threshold={40}>\n      <div className='str-chat_poll-option-with-votes-list'>\n        <div className='str-chat__poll-option'>\n          <div className='str-chat__poll-option__votes-paginated-list'>\n            <PollOptionWithVotesHeader\n              option={option}\n              optionOrderNumber={optionOrderNumber}\n            />\n            <PollVoteListing votes={votes} />\n            {hasNextPage && (\n              <div className='str-chat__loading-indicator-placeholder'>\n                {loading && <LoadingIndicator />}\n              </div>\n            )}\n          </div>\n        </div>\n      </div>\n    </InfiniteScrollPaginator>\n  );\n};\n"],"mappings":";;;;;;;;AAaA,IAAa,2BAA2B,EACtC,QACA,wBACkC;CAKlC,MAAM,EAAE,aAAa,SAAS,UAAU,UAAU,6BAA6B,EAC7E,kBALuB,eAChB,EAAE,QAAQ,EAAE,WAAW,OAAO,GAAG,EAAE,IAC1C,CAAC,OAAO,EAAE,CAGV,EACF,CAAC;CAED,OACE,oBAAC,yBAAD;EAAyB,0BAA0B;EAAU,WAAW;YACtE,oBAAC,OAAD;GAAK,WAAU;aACb,oBAAC,OAAD;IAAK,WAAU;cACb,qBAAC,OAAD;KAAK,WAAU;eAAf;MACE,oBAAC,2BAAD;OACU;OACW;MACpB,CAAA;MACD,oBAAC,iBAAD,EAAwB,MAAQ,CAAA;MAC/B,eACC,oBAAC,OAAD;OAAK,WAAU;iBACZ,WAAW,oBAAC,kBAAD,CAAmB,CAAA;MAC5B,CAAA;KAEJ;;GACF,CAAA;EACF,CAAA;CACkB,CAAA;AAE7B"}

package/dist/es/components/Poll/PollActions/PollResults/PollResults.mjs

@@ -0,0 +1,79 @@
+import { useStateStore } from "../../../../store/hooks/useStateStore.mjs";
+import { useTranslationContext } from "../../../../context/TranslationContext.mjs";
+import { Viewer } from "../../../Dialog/components/Viewer.mjs";
+import { PollOptionWithVotes } from "./PollOptionWithVotes.mjs";
+import { PollQuestion } from "../PollQuestion.mjs";
+import { PollOptionWithVotesList } from "./PollOptionWithVotesList.mjs";
+import { useModalContext } from "../../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../../context/PollContext.mjs";
+import { useCallback, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+//#region src/components/Poll/PollActions/PollResults/PollResults.tsx
+var pollStateSelector = ({ name, options, vote_count, vote_counts_by_option }) => ({
+	name,
+	options: [...options],
+	vote_count,
+	vote_counts_by_option
+});
+var PollResults = () => {
+	const { t } = useTranslationContext();
+	const { poll } = usePollContext();
+	const { close } = useModalContext();
+	const { name, options, vote_count, vote_counts_by_option } = useStateStore(poll.state, pollStateSelector);
+	const [optionToView, setOptionToView] = useState(null);
+	const goBack = useCallback(() => setOptionToView(null), []);
+	return /* @__PURE__ */ jsx(Viewer.Root, {
+		className: clsx("str-chat__modal__poll-results", { "str-chat__modal__poll-results--option-detail": optionToView }),
+		children: optionToView?.option ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Viewer.Header, {
+			close,
+			description: t("poll.results.reviewWhoVotedOption.description", "Review who voted for this option"),
+			goBack,
+			title: t("poll.results.votes.title", "Votes")
+		}), /* @__PURE__ */ jsx(Viewer.Body, {
+			className: "str-chat__modal__poll-results__body",
+			children: /* @__PURE__ */ jsx(PollOptionWithVotesList, {
+				option: optionToView?.option,
+				optionOrderNumber: optionToView?.optionOrderNumber
+			})
+		})] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Viewer.Header, {
+			close,
+			description: t("poll.results.reviewPollResultsOpen.description", "Review poll results and open an option to see detailed votes"),
+			title: t("poll.results.pollResults.title", "Poll Results")
+		}), /* @__PURE__ */ jsxs(Viewer.Body, {
+			className: "str-chat__modal__poll-results__body",
+			children: [/* @__PURE__ */ jsx(PollQuestion, { question: name }), /* @__PURE__ */ jsxs("div", {
+				className: "str-chat__modal__poll-results__options",
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "str-chat__modal__poll-results__option-list",
+					children: options.sort((next, current) => (vote_counts_by_option[current.id] ?? 0) >= (vote_counts_by_option[next.id] ?? 0) ? 1 : -1).map((option, i) => {
+						const optionOrderNumber = i + 1;
+						return /* @__PURE__ */ jsx(PollOptionWithVotes, {
+							countVotesPreview: 5,
+							option,
+							orderNumber: optionOrderNumber,
+							showAllVotes: () => setOptionToView({
+								option,
+								optionOrderNumber
+							})
+						}, `poll-option-${option.id}`);
+					})
+				}), /* @__PURE__ */ jsx("div", {
+					className: "str-chat__modal__poll-results__options__footer",
+					children: /* @__PURE__ */ jsx("div", {
+						className: "str-chat__modal__poll-results__options-total-count",
+						children: t("poll.results.totalVoteCount.text", {
+							count: vote_count,
+							defaultValue_one: "1 vote total",
+							defaultValue_other: "{{ count }} votes total"
+						})
+					})
+				})]
+			})]
+		})] })
+	});
+};
+//#endregion
+export { PollResults };
+
+//# sourceMappingURL=PollResults.mjs.map

package/dist/es/components/Poll/PollActions/PollResults/PollResults.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollResults.mjs","names":[],"sources":["../../../../../../src/components/Poll/PollActions/PollResults/PollResults.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useCallback, useState } from 'react';\nimport { PollOptionWithVotes } from './PollOptionWithVotes';\nimport { Viewer } from '../../../Dialog';\nimport { useStateStore } from '../../../../store';\nimport {\n  useModalContext,\n  usePollContext,\n  useTranslationContext,\n} from '../../../../context';\nimport type { PollOptionResponseData, PollState } from 'stream-chat';\nimport { COUNT_OPTION_VOTES_PREVIEW } from '../../constants';\nimport { PollQuestion } from '../PollQuestion';\nimport { PollOptionWithVotesList } from './PollOptionWithVotesList';\n\nconst pollStateSelector = ({\n  name,\n  options,\n  vote_count,\n  vote_counts_by_option,\n}: PollState) => ({\n  name,\n  options: [...options],\n  vote_count,\n  vote_counts_by_option,\n});\n\nexport const PollResults = () => {\n  const { t } = useTranslationContext();\n  const { poll } = usePollContext();\n  const { close } = useModalContext();\n  const { name, options, vote_count, vote_counts_by_option } = useStateStore(\n    poll.state,\n    pollStateSelector,\n  );\n  const [optionToView, setOptionToView] = useState<{\n    option: PollOptionResponseData;\n    optionOrderNumber: number;\n  } | null>(null);\n\n  const goBack = useCallback(() => setOptionToView(null), []);\n\n  return (\n    <Viewer.Root\n      className={clsx('str-chat__modal__poll-results', {\n        'str-chat__modal__poll-results--option-detail': optionToView,\n      })}\n    >\n      {optionToView?.option ? (\n        <>\n          <Viewer.Header\n            close={close}\n            description={t(\n              'poll.results.reviewWhoVotedOption.description',\n              'Review who voted for this option',\n            )}\n            goBack={goBack}\n            title={t('poll.results.votes.title', 'Votes')}\n          />\n          <Viewer.Body className='str-chat__modal__poll-results__body'>\n            <PollOptionWithVotesList\n              option={optionToView?.option}\n              optionOrderNumber={optionToView?.optionOrderNumber}\n            />\n          </Viewer.Body>\n        </>\n      ) : (\n        <>\n          <Viewer.Header\n            close={close}\n            description={t(\n              'poll.results.reviewPollResultsOpen.description',\n              'Review poll results and open an option to see detailed votes',\n            )}\n            title={t('poll.results.pollResults.title', 'Poll Results')}\n          />\n          <Viewer.Body className='str-chat__modal__poll-results__body'>\n            <PollQuestion question={name} />\n            <div className='str-chat__modal__poll-results__options'>\n              <div className='str-chat__modal__poll-results__option-list'>\n                {options\n                  .sort((next, current) =>\n                    (vote_counts_by_option[current.id] ?? 0) >=\n                    (vote_counts_by_option[next.id] ?? 0)\n                      ? 1\n                      : -1,\n                  )\n                  .map((option, i) => {\n                    const optionOrderNumber = i + 1;\n                    return (\n                      <PollOptionWithVotes\n                        countVotesPreview={COUNT_OPTION_VOTES_PREVIEW}\n                        key={`poll-option-${option.id}`}\n                        option={option}\n                        orderNumber={optionOrderNumber}\n                        showAllVotes={() =>\n                          setOptionToView({ option, optionOrderNumber })\n                        }\n                      />\n                    );\n                  })}\n              </div>\n              <div className='str-chat__modal__poll-results__options__footer'>\n                <div className='str-chat__modal__poll-results__options-total-count'>\n                  {t('poll.results.totalVoteCount.text', {\n                    count: vote_count,\n                    defaultValue_one: '1 vote total',\n                    defaultValue_other: '{{ count }} votes total',\n                  })}\n                </div>\n              </div>\n            </div>\n          </Viewer.Body>\n        </>\n      )}\n    </Viewer.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAeA,IAAM,qBAAqB,EACzB,MACA,SACA,YACA,6BACgB;CAChB;CACA,SAAS,CAAC,GAAG,OAAO;CACpB;CACA;AACF;AAEA,IAAa,oBAAoB;CAC/B,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,UAAU,gBAAgB;CAClC,MAAM,EAAE,MAAM,SAAS,YAAY,0BAA0B,cAC3D,KAAK,OACL,iBACF;CACA,MAAM,CAAC,cAAc,mBAAmB,SAG9B,IAAI;CAEd,MAAM,SAAS,kBAAkB,gBAAgB,IAAI,GAAG,CAAC,CAAC;CAE1D,OACE,oBAAC,OAAO,MAAR;EACE,WAAW,KAAK,iCAAiC,EAC/C,gDAAgD,aAClD,CAAC;YAEA,cAAc,SACb,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,OAAO,QAAR;GACS;GACP,aAAa,EACX,iDACA,kCACF;GACQ;GACR,OAAO,EAAE,4BAA4B,OAAO;EAC7C,CAAA,GACD,oBAAC,OAAO,MAAR;GAAa,WAAU;aACrB,oBAAC,yBAAD;IACE,QAAQ,cAAc;IACtB,mBAAmB,cAAc;GAClC,CAAA;EACU,CAAA,CACb,EAAA,CAAA,IAEF,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,OAAO,QAAR;GACS;GACP,aAAa,EACX,kDACA,8DACF;GACA,OAAO,EAAE,kCAAkC,cAAc;EAC1D,CAAA,GACD,qBAAC,OAAO,MAAR;GAAa,WAAU;aAAvB,CACE,oBAAC,cAAD,EAAc,UAAU,KAAO,CAAA,GAC/B,qBAAC,OAAD;IAAK,WAAU;cAAf,CACE,oBAAC,OAAD;KAAK,WAAU;eACZ,QACE,MAAM,MAAM,aACV,sBAAsB,QAAQ,OAAO,OACrC,sBAAsB,KAAK,OAAO,KAC/B,IACA,EACN,CAAC,CACA,KAAK,QAAQ,MAAM;MAClB,MAAM,oBAAoB,IAAI;MAC9B,OACE,oBAAC,qBAAD;OACE,mBAAA;OAEQ;OACR,aAAa;OACb,oBACE,gBAAgB;QAAE;QAAQ;OAAkB,CAAC;MAEhD,GANM,eAAe,OAAO,IAM5B;KAEL,CAAC;IACA,CAAA,GACL,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,OAAD;MAAK,WAAU;gBACZ,EAAE,oCAAoC;OACrC,OAAO;OACP,kBAAkB;OAClB,oBAAoB;MACtB,CAAC;KACE,CAAA;IACF,CAAA,CACF;KACM;IACb,EAAA,CAAA;CAEO,CAAA;AAEjB"}

package/dist/es/components/Poll/PollActions/SuggestPollOptionPrompt.mjs

@@ -0,0 +1,82 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Prompt } from "../../Dialog/components/Prompt.mjs";
+import { TextInput } from "../../Form/TextInput.mjs";
+import { useFormState } from "../../Form/hooks/useFormState.mjs";
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.mjs";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/SuggestPollOptionPrompt.tsx
+var pollStateSelector = (nextValue) => ({ options: nextValue.options });
+var SuggestPollOptionPrompt = () => {
+	const { client } = useChatContext();
+	const { t } = useTranslationContext();
+	const { poll } = usePollContext();
+	const { close } = useModalContext();
+	const { options } = useStateStore(poll.state, pollStateSelector);
+	const [input, setInput] = useState(null);
+	const initialValue = useMemo(() => ({ optionText: "" }), []);
+	const validators = useMemo(() => ({ optionText: (v) => {
+		const trimmed = typeof v === "string" ? v.trim() : "";
+		if (!trimmed) return new Error(t("poll.addCommentPrompt.fieldCannotEmptyContain.label", "This field cannot be empty or contain only spaces"));
+		if (options.find((option) => option.text === trimmed)) return new Error(t("poll.suggestPollOption.optionAlreadyExists.label", "Option already exists"));
+	} }), [t, options]);
+	const { fieldErrors, handleSubmit, setFieldValue, value } = useFormState({
+		initialValue,
+		onSubmit: useCallback(async (formValue) => {
+			await client.createPollOption({
+				poll_id: poll.id,
+				text: formValue.optionText
+			});
+			close();
+		}, [
+			client,
+			poll,
+			close
+		]),
+		validators
+	});
+	useEffect(() => {
+		input?.focus();
+	}, [input]);
+	const submitDisabled = !value.optionText?.trim();
+	return /* @__PURE__ */ jsxs(Prompt.Root, {
+		className: "str-chat__modal__suggest-poll-option-prompt",
+		children: [/* @__PURE__ */ jsx(Prompt.Header, {
+			close,
+			description: t("poll.suggestPollOption.description", "Suggest a new option to add to this poll"),
+			title: t("poll.actions.suggestOption.label", "Suggest an Option")
+		}), /* @__PURE__ */ jsxs("form", {
+			autoComplete: "off",
+			onSubmit: handleSubmit,
+			children: [/* @__PURE__ */ jsx(Prompt.Body, { children: /* @__PURE__ */ jsx(TextInput, {
+				"aria-label": t("poll.actions.suggestOption.label", "Suggest an Option"),
+				error: !!fieldErrors.optionText,
+				errorMessage: fieldErrors.optionText?.message,
+				id: "optionText",
+				name: "optionText",
+				onChange: (e) => setFieldValue("optionText", e.target.value),
+				placeholder: t("poll.pollOptionSuggestion.placeholder", "Enter a new option"),
+				ref: setInput,
+				required: true,
+				type: "text",
+				value: value.optionText
+			}) }), /* @__PURE__ */ jsx(Prompt.Footer, { children: /* @__PURE__ */ jsxs(Prompt.FooterControls, { children: [/* @__PURE__ */ jsx(Prompt.FooterControlsButtonSecondary, {
+				className: "str-chat__prompt__footer__controls-button--cancel",
+				onClick: close,
+				children: t("common.cancel.label", "Cancel")
+			}), /* @__PURE__ */ jsx(Prompt.FooterControlsButtonPrimary, {
+				className: "str-chat__prompt__footer__controls-button--submit",
+				disabled: Object.keys(fieldErrors).length > 0 || submitDisabled,
+				type: "submit",
+				children: t("common.send.label", "Send")
+			})] }) })]
+		})]
+	});
+};
+//#endregion
+export { SuggestPollOptionPrompt };
+
+//# sourceMappingURL=SuggestPollOptionPrompt.mjs.map

package/dist/es/components/Poll/PollActions/SuggestPollOptionPrompt.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestPollOptionPrompt.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/SuggestPollOptionPrompt.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n  useChatContext,\n  useModalContext,\n  usePollContext,\n  useTranslationContext,\n} from '../../../context';\nimport { useStateStore } from '../../../store';\nimport type { PollOptionResponseData, PollState } from 'stream-chat';\nimport { Prompt } from '../../Dialog';\nimport { TextInput } from '../../Form';\nimport { useFormState } from '../../Form/hooks';\n\ntype PollStateSelectorReturnValue = { options: PollOptionResponseData[] };\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  options: nextValue.options,\n});\n\nexport type SuggestPollOptionFormProps = Record<string, never>;\n\nexport const SuggestPollOptionPrompt = () => {\n  const { client } = useChatContext();\n  const { t } = useTranslationContext();\n  const { poll } = usePollContext();\n  const { close } = useModalContext();\n  const { options } = useStateStore(poll.state, pollStateSelector);\n  const [input, setInput] = useState<HTMLInputElement | null>(null);\n\n  const initialValue = useMemo(() => ({ optionText: '' }), []);\n  const validators = useMemo(\n    () => ({\n      optionText: (v: string) => {\n        const trimmed = typeof v === 'string' ? v.trim() : '';\n        if (!trimmed) {\n          return new Error(\n            t(\n              'poll.addCommentPrompt.fieldCannotEmptyContain.label',\n              'This field cannot be empty or contain only spaces',\n            ),\n          );\n        }\n        const existingOption = options.find((option) => option.text === trimmed);\n        if (existingOption) {\n          return new Error(\n            t(\n              'poll.suggestPollOption.optionAlreadyExists.label',\n              'Option already exists',\n            ),\n          );\n        }\n        return undefined;\n      },\n    }),\n    [t, options],\n  );\n\n  const onSubmit = useCallback(\n    async (formValue: { optionText: string }) => {\n      await client.createPollOption({\n        poll_id: poll.id,\n        text: formValue.optionText,\n      });\n      close();\n    },\n    [client, poll, close],\n  );\n\n  const { fieldErrors, handleSubmit, setFieldValue, value } = useFormState<{\n    optionText: string;\n  }>({\n    initialValue,\n    onSubmit,\n    validators,\n  });\n\n  useEffect(() => {\n    input?.focus();\n  }, [input]);\n\n  const submitDisabled = !value.optionText?.trim();\n\n  return (\n    <Prompt.Root className='str-chat__modal__suggest-poll-option-prompt'>\n      <Prompt.Header\n        close={close}\n        description={t(\n          'poll.suggestPollOption.description',\n          'Suggest a new option to add to this poll',\n        )}\n        title={t('poll.actions.suggestOption.label', 'Suggest an Option')}\n      />\n      <form autoComplete='off' onSubmit={handleSubmit}>\n        <Prompt.Body>\n          <TextInput\n            aria-label={t('poll.actions.suggestOption.label', 'Suggest an Option')}\n            error={!!fieldErrors.optionText}\n            errorMessage={fieldErrors.optionText?.message}\n            id='optionText'\n            name='optionText'\n            onChange={(e) => setFieldValue('optionText', e.target.value)}\n            placeholder={t('poll.pollOptionSuggestion.placeholder', 'Enter a new option')}\n            ref={setInput}\n            required\n            type='text'\n            value={value.optionText}\n          />\n        </Prompt.Body>\n        <Prompt.Footer>\n          <Prompt.FooterControls>\n            <Prompt.FooterControlsButtonSecondary\n              className='str-chat__prompt__footer__controls-button--cancel'\n              onClick={close}\n            >\n              {t('common.cancel.label', 'Cancel')}\n            </Prompt.FooterControlsButtonSecondary>\n            <Prompt.FooterControlsButtonPrimary\n              className='str-chat__prompt__footer__controls-button--submit'\n              disabled={Object.keys(fieldErrors).length > 0 || submitDisabled}\n              type='submit'\n            >\n              {t('common.send.label', 'Send')}\n            </Prompt.FooterControlsButtonPrimary>\n          </Prompt.FooterControls>\n        </Prompt.Footer>\n      </form>\n    </Prompt.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAcA,IAAM,qBAAqB,eAAwD,EACjF,SAAS,UAAU,QACrB;AAIA,IAAa,gCAAgC;CAC3C,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,UAAU,gBAAgB;CAClC,MAAM,EAAE,YAAY,cAAc,KAAK,OAAO,iBAAiB;CAC/D,MAAM,CAAC,OAAO,YAAY,SAAkC,IAAI;CAEhE,MAAM,eAAe,eAAe,EAAE,YAAY,GAAG,IAAI,CAAC,CAAC;CAC3D,MAAM,aAAa,eACV,EACL,aAAa,MAAc;EACzB,MAAM,UAAU,OAAO,MAAM,WAAW,EAAE,KAAK,IAAI;EACnD,IAAI,CAAC,SACH,OAAO,IAAI,MACT,EACE,uDACA,mDACF,CACF;EAGF,IADuB,QAAQ,MAAM,WAAW,OAAO,SAAS,OAC5D,GACF,OAAO,IAAI,MACT,EACE,oDACA,uBACF,CACF;CAGJ,EACF,IACA,CAAC,GAAG,OAAO,CACb;CAaA,MAAM,EAAE,aAAa,cAAc,eAAe,UAAU,aAEzD;EACD;EACA,UAfe,YACf,OAAO,cAAsC;GAC3C,MAAM,OAAO,iBAAiB;IAC5B,SAAS,KAAK;IACd,MAAM,UAAU;GAClB,CAAC;GACD,MAAM;EACR,GACA;GAAC;GAAQ;GAAM;EAAK,CAOpB;EACA;CACF,CAAC;CAED,gBAAgB;EACd,OAAO,MAAM;CACf,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,iBAAiB,CAAC,MAAM,YAAY,KAAK;CAE/C,OACE,qBAAC,OAAO,MAAR;EAAa,WAAU;YAAvB,CACE,oBAAC,OAAO,QAAR;GACS;GACP,aAAa,EACX,sCACA,0CACF;GACA,OAAO,EAAE,oCAAoC,mBAAmB;EACjE,CAAA,GACD,qBAAC,QAAD;GAAM,cAAa;GAAM,UAAU;aAAnC,CACE,oBAAC,OAAO,MAAR,EAAA,UACE,oBAAC,WAAD;IACE,cAAY,EAAE,oCAAoC,mBAAmB;IACrE,OAAO,CAAC,CAAC,YAAY;IACrB,cAAc,YAAY,YAAY;IACtC,IAAG;IACH,MAAK;IACL,WAAW,MAAM,cAAc,cAAc,EAAE,OAAO,KAAK;IAC3D,aAAa,EAAE,yCAAyC,oBAAoB;IAC5E,KAAK;IACL,UAAA;IACA,MAAK;IACL,OAAO,MAAM;GACd,CAAA,EACU,CAAA,GACb,oBAAC,OAAO,QAAR,EAAA,UACE,qBAAC,OAAO,gBAAR,EAAA,UAAA,CACE,oBAAC,OAAO,+BAAR;IACE,WAAU;IACV,SAAS;cAER,EAAE,uBAAuB,QAAQ;GACE,CAAA,GACtC,oBAAC,OAAO,6BAAR;IACE,WAAU;IACV,UAAU,OAAO,KAAK,WAAW,CAAC,CAAC,SAAS,KAAK;IACjD,MAAK;cAEJ,EAAE,qBAAqB,MAAM;GACI,CAAA,CACf,EAAA,CAAA,EACV,CAAA,CACX;IACK;;AAEjB"}

package/dist/es/components/Poll/PollContent.mjs

@@ -0,0 +1,28 @@
+import { useStateStore } from "../../store/hooks/useStateStore.mjs";
+import { useComponentContext } from "../../context/ComponentContext.mjs";
+import { PollHeader } from "./PollHeader.mjs";
+import { PollActions } from "./PollActions/PollActions.mjs";
+import { PollOptionList } from "./PollOptionList.mjs";
+import { usePollContext } from "../../context/PollContext.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+//#region src/components/Poll/PollContent.tsx
+var pollStateSelectorPollContent = (nextValue) => ({ is_closed: nextValue.is_closed });
+var PollContent = () => {
+	const { PollActions: PollActions$1 = PollActions, PollHeader: PollHeader$1 = PollHeader } = useComponentContext();
+	const { poll } = usePollContext();
+	const { is_closed } = useStateStore(poll.state, pollStateSelectorPollContent);
+	return /* @__PURE__ */ jsxs("div", {
+		className: clsx("str-chat__poll", { "str-chat__poll--closed": is_closed }),
+		children: [
+			/* @__PURE__ */ jsx(PollHeader$1, {}),
+			/* @__PURE__ */ jsx(PollOptionList, { optionsDisplayCount: 5 }),
+			/* @__PURE__ */ jsx(PollActions$1, {})
+		]
+	});
+};
+//#endregion
+export { PollContent };
+
+//# sourceMappingURL=PollContent.mjs.map

package/dist/es/components/Poll/PollContent.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PollContent.mjs","names":[],"sources":["../../../../src/components/Poll/PollContent.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React from 'react';\nimport { PollHeader as DefaultPollHeader } from './PollHeader';\nimport { PollActions as DefaultPollActions } from './PollActions';\nimport { PollOptionList } from './PollOptionList';\nimport { MAX_OPTIONS_DISPLAYED } from './constants';\nimport { useComponentContext, usePollContext } from '../../context';\nimport { useStateStore } from '../../store';\nimport type { PollState } from 'stream-chat';\n\ntype PollStateSelectorPollContentReturnValue = { is_closed: boolean | undefined };\nconst pollStateSelectorPollContent = (\n  nextValue: PollState,\n): PollStateSelectorPollContentReturnValue => ({ is_closed: nextValue.is_closed });\nexport const PollContent = () => {\n  const { PollActions = DefaultPollActions, PollHeader = DefaultPollHeader } =\n    useComponentContext();\n  const { poll } = usePollContext();\n  const { is_closed } = useStateStore(poll.state, pollStateSelectorPollContent);\n\n  return (\n    <div className={clsx('str-chat__poll', { 'str-chat__poll--closed': is_closed })}>\n      <PollHeader />\n      <PollOptionList optionsDisplayCount={MAX_OPTIONS_DISPLAYED} />\n      <PollActions />\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;AAWA,IAAM,gCACJ,eAC6C,EAAE,WAAW,UAAU,UAAU;AAChF,IAAa,oBAAoB;CAC/B,MAAM,EAAE,aAAA,gBAAc,aAAoB,YAAA,eAAa,eACrD,oBAAoB;CACtB,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,cAAc,cAAc,KAAK,OAAO,4BAA4B;CAE5E,OACE,qBAAC,OAAD;EAAK,WAAW,KAAK,kBAAkB,EAAE,0BAA0B,UAAU,CAAC;YAA9E;GACE,oBAAC,cAAD,CAAa,CAAA;GACb,oBAAC,gBAAD,EAAgB,qBAAA,EAA6C,CAAA;GAC7D,oBAAC,eAAD,CAAc,CAAA;EACX;;AAET"}