stream-chat-react 14.11.1 → 14.12.0

package/dist/es/components/Notifications/notificationTarget.mjs

@@ -0,0 +1,38 @@
+//#region src/components/Notifications/notificationTarget.ts
+var NOTIFICATION_TARGET_PANELS = [
+	"channel",
+	"thread",
+	"channel-list",
+	"thread-list",
+	"modal"
+];
+var isNotificationTargetPanel = (value) => typeof value === "string" && NOTIFICATION_TARGET_PANELS.includes(value);
+var getNotificationTargetPanel = (notification) => {
+	const targetTag = notification.tags?.find((tag) => tag.startsWith("target:"));
+	if (targetTag) {
+		const candidate = targetTag.slice(7);
+		if (isNotificationTargetPanel(candidate)) return candidate;
+	}
+	const panel = notification.origin.context?.panel;
+	return isNotificationTargetPanel(panel) ? panel : void 0;
+};
+var getNotificationTargetPanels = (notification) => {
+	const targetPanels = (notification.tags ?? []).filter((tag) => tag.startsWith("target:")).map((tag) => tag.slice(7)).filter((value) => isNotificationTargetPanel(value));
+	if (targetPanels.length > 0) return Array.from(new Set(targetPanels));
+	const panel = notification.origin.context?.panel;
+	return isNotificationTargetPanel(panel) ? [panel] : [];
+};
+var getNotificationTargetTag = (panel) => `target:${panel}`;
+var addNotificationTargetTag = (panel, tags) => {
+	if (!panel) return tags ?? [];
+	return Array.from(/* @__PURE__ */ new Set([getNotificationTargetTag(panel), ...tags ?? []]));
+};
+var isNotificationForPanel = (notification, panel, options) => {
+	const explicitTargetPanels = getNotificationTargetPanels(notification);
+	if (explicitTargetPanels.length > 0) return explicitTargetPanels.includes(panel);
+	return (options?.fallbackPanel ?? "channel") === panel;
+};
+//#endregion
+export { addNotificationTargetTag, getNotificationTargetPanel, getNotificationTargetPanels, getNotificationTargetTag, isNotificationForPanel, isNotificationTargetPanel };
+
+//# sourceMappingURL=notificationTarget.mjs.map

package/dist/es/components/Notifications/notificationTarget.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"notificationTarget.mjs","names":[],"sources":["../../../../src/components/Notifications/notificationTarget.ts"],"sourcesContent":["import type { Notification } from 'stream-chat';\n\nconst NOTIFICATION_TARGET_PANELS = [\n  'channel',\n  'thread',\n  'channel-list',\n  'thread-list',\n  'modal',\n] as const;\n\n/**\n * Panel where a notification should be consumed.\n * Use in origin.context.panel when publishing so NotificationList can filter by panel.\n */\nexport type NotificationTargetPanel = (typeof NOTIFICATION_TARGET_PANELS)[number];\n\nexport const isNotificationTargetPanel = (\n  value: unknown,\n): value is NotificationTargetPanel =>\n  typeof value === 'string' &&\n  (NOTIFICATION_TARGET_PANELS as readonly string[]).includes(value);\n\nexport const getNotificationTargetPanel = (\n  notification: Notification,\n): NotificationTargetPanel | undefined => {\n  const targetTag = notification.tags?.find((tag) => tag.startsWith('target:'));\n  if (targetTag) {\n    const candidate = targetTag.slice('target:'.length);\n    if (isNotificationTargetPanel(candidate)) return candidate;\n  }\n  const panel = notification.origin.context?.panel;\n  return isNotificationTargetPanel(panel) ? panel : undefined;\n};\n\nexport const getNotificationTargetPanels = (\n  notification: Notification,\n): NotificationTargetPanel[] => {\n  const targetPanels = (notification.tags ?? [])\n    .filter((tag) => tag.startsWith('target:'))\n    .map((tag) => tag.slice('target:'.length))\n    .filter((value): value is NotificationTargetPanel =>\n      isNotificationTargetPanel(value),\n    );\n\n  if (targetPanels.length > 0) {\n    return Array.from(new Set(targetPanels));\n  }\n\n  const panel = notification.origin.context?.panel;\n  return isNotificationTargetPanel(panel) ? [panel] : [];\n};\n\nexport const getNotificationTargetTag = (panel: NotificationTargetPanel) =>\n  `target:${panel}` as const;\n\nexport const addNotificationTargetTag = (\n  panel: NotificationTargetPanel | undefined,\n  tags?: string[],\n) => {\n  if (!panel) return tags ?? [];\n  return Array.from(new Set([getNotificationTargetTag(panel), ...(tags ?? [])]));\n};\n\nexport const isNotificationForPanel = (\n  notification: Notification,\n  panel: NotificationTargetPanel,\n  options?: { fallbackPanel?: NotificationTargetPanel },\n) => {\n  const explicitTargetPanels = getNotificationTargetPanels(notification);\n  if (explicitTargetPanels.length > 0) {\n    return explicitTargetPanels.includes(panel);\n  }\n\n  const resolvedPanel = options?.fallbackPanel ?? 'channel';\n  return resolvedPanel === panel;\n};\n"],"mappings":";AAEA,IAAM,6BAA6B;CACjC;CACA;CACA;CACA;CACA;AACF;AAQA,IAAa,6BACX,UAEA,OAAO,UAAU,YAChB,2BAAiD,SAAS,KAAK;AAElE,IAAa,8BACX,iBACwC;CACxC,MAAM,YAAY,aAAa,MAAM,MAAM,QAAQ,IAAI,WAAW,SAAS,CAAC;CAC5E,IAAI,WAAW;EACb,MAAM,YAAY,UAAU,MAAM,CAAgB;EAClD,IAAI,0BAA0B,SAAS,GAAG,OAAO;CACnD;CACA,MAAM,QAAQ,aAAa,OAAO,SAAS;CAC3C,OAAO,0BAA0B,KAAK,IAAI,QAAQ,KAAA;AACpD;AAEA,IAAa,+BACX,iBAC8B;CAC9B,MAAM,gBAAgB,aAAa,QAAQ,CAAC,EAAA,CACzC,QAAQ,QAAQ,IAAI,WAAW,SAAS,CAAC,CAAC,CAC1C,KAAK,QAAQ,IAAI,MAAM,CAAgB,CAAC,CAAC,CACzC,QAAQ,UACP,0BAA0B,KAAK,CACjC;CAEF,IAAI,aAAa,SAAS,GACxB,OAAO,MAAM,KAAK,IAAI,IAAI,YAAY,CAAC;CAGzC,MAAM,QAAQ,aAAa,OAAO,SAAS;CAC3C,OAAO,0BAA0B,KAAK,IAAI,CAAC,KAAK,IAAI,CAAC;AACvD;AAEA,IAAa,4BAA4B,UACvC,UAAU;AAEZ,IAAa,4BACX,OACA,SACG;CACH,IAAI,CAAC,OAAO,OAAO,QAAQ,CAAC;CAC5B,OAAO,MAAM,qBAAK,IAAI,IAAI,CAAC,yBAAyB,KAAK,GAAG,GAAI,QAAQ,CAAC,CAAE,CAAC,CAAC;AAC/E;AAEA,IAAa,0BACX,cACA,OACA,YACG;CACH,MAAM,uBAAuB,4BAA4B,YAAY;CACrE,IAAI,qBAAqB,SAAS,GAChC,OAAO,qBAAqB,SAAS,KAAK;CAI5C,QADsB,SAAS,iBAAiB,eACvB;AAC3B"}

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

@@ -0,0 +1,18 @@
+import { useComponentContext } from "../../context/ComponentContext.mjs";
+import { PollProvider } from "../../context/PollContext.mjs";
+import { PollContent } from "./PollContent.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Poll/Poll.tsx
+var Poll = ({ poll }) => {
+	const { PollContent: PollContent$1 = PollContent } = useComponentContext();
+	if (!poll) return null;
+	return /* @__PURE__ */ jsx(PollProvider, {
+		poll,
+		children: /* @__PURE__ */ jsx(PollContent$1, {})
+	});
+};
+//#endregion
+export { Poll };
+
+//# sourceMappingURL=Poll.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Poll.mjs","names":[],"sources":["../../../../src/components/Poll/Poll.tsx"],"sourcesContent":["import React from 'react';\nimport { PollContent as DefaultPollContent } from './PollContent';\nimport { PollProvider, useComponentContext } from '../../context';\nimport type { Poll as PollClass } from 'stream-chat';\n\nexport const Poll = ({ poll }: { poll: PollClass }) => {\n  const { PollContent = DefaultPollContent } = useComponentContext();\n  if (!poll) return null;\n  return (\n    <PollProvider poll={poll}>\n      <PollContent />\n    </PollProvider>\n  );\n};\n"],"mappings":";;;;;;AAKA,IAAa,QAAQ,EAAE,WAAgC;CACrD,MAAM,EAAE,aAAA,gBAAc,gBAAuB,oBAAoB;CACjE,IAAI,CAAC,MAAM,OAAO;CAClB,OACE,oBAAC,cAAD;EAAoB;YAClB,oBAAC,eAAD,CAAc,CAAA;CACF,CAAA;AAElB"}

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

@@ -0,0 +1,79 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.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 { useCallback, useEffect, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/AddCommentPrompt.tsx
+var pollStateSelector = (nextValue) => ({ ownAnswer: nextValue.ownAnswer });
+var AddCommentPrompt = ({ messageId }) => {
+	const { t } = useTranslationContext();
+	const { close } = useModalContext();
+	const { poll } = usePollContext();
+	const { ownAnswer } = useStateStore(poll.state, pollStateSelector);
+	const [input, setInput] = useState(null);
+	const initialComment = ownAnswer?.answer_text ?? "";
+	const initialValue = useMemo(() => ({ comment: initialComment }), [initialComment]);
+	const validators = useMemo(() => ({ comment: (v) => {
+		if (!(typeof v === "string" ? v.trim() : "")) return new Error(t("This field cannot be empty or contain only spaces"));
+	} }), [t]);
+	const { fieldErrors, handleSubmit, setFieldValue, value } = useFormState({
+		initialValue,
+		onSubmit: useCallback(async (formValue) => {
+			await poll.addAnswer(formValue.comment, messageId);
+			close();
+		}, [
+			poll,
+			messageId,
+			close
+		]),
+		validators
+	});
+	useEffect(() => {
+		input?.focus();
+	}, [input]);
+	const title = ownAnswer ? t("Update your comment") : t("Add a comment");
+	const description = ownAnswer ? t("Update the comment attached to your poll answer") : t("Add a comment to your poll answer");
+	const submitDisabled = !value.comment?.trim() || value.comment === ownAnswer?.answer_text;
+	return /* @__PURE__ */ jsxs(Prompt.Root, {
+		className: "str-chat__modal__poll-add-comment",
+		children: [title && /* @__PURE__ */ jsx(Prompt.Header, {
+			close,
+			description,
+			title
+		}), /* @__PURE__ */ jsxs("form", {
+			autoComplete: "off",
+			onSubmit: handleSubmit,
+			children: [/* @__PURE__ */ jsx(Prompt.Body, { children: /* @__PURE__ */ jsx(TextInput, {
+				"aria-label": title,
+				error: !!fieldErrors.comment,
+				errorMessage: fieldErrors.comment?.message,
+				id: "comment",
+				name: "comment",
+				onChange: (e) => setFieldValue("comment", e.target.value),
+				placeholder: t("placeholder/PollComment"),
+				ref: setInput,
+				required: true,
+				type: "text",
+				value: value.comment
+			}) }), /* @__PURE__ */ jsx(Prompt.Footer, { children: /* @__PURE__ */ jsxs(Prompt.FooterControls, { children: [/* @__PURE__ */ jsx(Prompt.FooterControlsButtonSecondary, {
+				className: "str-chat__prompt__footer__controls-button--cancel",
+				onClick: close,
+				type: "button",
+				children: t("Cancel")
+			}), /* @__PURE__ */ jsx(Prompt.FooterControlsButtonPrimary, {
+				className: "str-chat__prompt__footer__controls-button--submit",
+				disabled: Object.keys(fieldErrors).length > 0 || submitDisabled,
+				type: "submit",
+				children: initialComment ? t("Update") : t("Send")
+			})] }) })]
+		})]
+	});
+};
+//#endregion
+export { AddCommentPrompt };
+
+//# sourceMappingURL=AddCommentPrompt.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"AddCommentPrompt.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/AddCommentPrompt.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from 'react';\nimport { useStateStore } from '../../../store';\nimport { useModalContext, usePollContext, useTranslationContext } from '../../../context';\nimport type { PollAnswer, PollState } from 'stream-chat';\nimport { Prompt } from '../../Dialog';\nimport { TextInput } from '../../Form';\nimport { useFormState } from '../../Form/hooks';\n\ntype PollStateSelectorReturnValue = { ownAnswer: PollAnswer | undefined };\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  ownAnswer: nextValue.ownAnswer,\n});\n\nexport type AddCommentPromptProps = {\n  messageId: string;\n};\n\nexport const AddCommentPrompt = ({ messageId }: AddCommentPromptProps) => {\n  const { t } = useTranslationContext();\n  const { close } = useModalContext();\n  const { poll } = usePollContext();\n  const { ownAnswer } = useStateStore(poll.state, pollStateSelector);\n  const [input, setInput] = useState<HTMLInputElement | null>(null);\n\n  const initialComment = ownAnswer?.answer_text ?? '';\n  const initialValue = useMemo(() => ({ comment: initialComment }), [initialComment]);\n  const validators = useMemo(\n    () => ({\n      comment: (v: string) => {\n        const trimmed = typeof v === 'string' ? v.trim() : '';\n        if (!trimmed) {\n          return new Error(t('This field cannot be empty or contain only spaces'));\n        }\n        return undefined;\n      },\n    }),\n    [t],\n  );\n  const onSubmit = useCallback(\n    async (formValue: { comment: string }) => {\n      await poll.addAnswer(formValue.comment, messageId);\n      close();\n    },\n    [poll, messageId, close],\n  );\n  const { fieldErrors, handleSubmit, setFieldValue, value } = useFormState<{\n    comment: string;\n  }>({\n    initialValue,\n    onSubmit,\n    validators,\n  });\n\n  useEffect(() => {\n    input?.focus();\n  }, [input]);\n\n  const title = ownAnswer ? t('Update your comment') : t('Add a comment');\n  const description = ownAnswer\n    ? t('Update the comment attached to your poll answer')\n    : t('Add a comment to your poll answer');\n  const submitDisabled =\n    !value.comment?.trim() || value.comment === ownAnswer?.answer_text;\n\n  return (\n    <Prompt.Root className='str-chat__modal__poll-add-comment'>\n      {title && <Prompt.Header close={close} description={description} title={title} />}\n      <form autoComplete='off' onSubmit={handleSubmit}>\n        <Prompt.Body>\n          <TextInput\n            aria-label={title}\n            error={!!fieldErrors.comment}\n            errorMessage={fieldErrors.comment?.message}\n            id='comment'\n            name='comment'\n            onChange={(e) => setFieldValue('comment', e.target.value)}\n            placeholder={t('placeholder/PollComment')}\n            ref={setInput}\n            required\n            type='text'\n            value={value.comment}\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              type='button'\n            >\n              {t('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              {initialComment ? t('Update') : t('Send')}\n            </Prompt.FooterControlsButtonPrimary>\n          </Prompt.FooterControls>\n        </Prompt.Footer>\n      </form>\n    </Prompt.Root>\n  );\n};\n"],"mappings":";;;;;;;;;;AASA,IAAM,qBAAqB,eAAwD,EACjF,WAAW,UAAU,UACvB;AAMA,IAAa,oBAAoB,EAAE,gBAAuC;CACxE,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,UAAU,gBAAgB;CAClC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,cAAc,cAAc,KAAK,OAAO,iBAAiB;CACjE,MAAM,CAAC,OAAO,YAAY,SAAkC,IAAI;CAEhE,MAAM,iBAAiB,WAAW,eAAe;CACjD,MAAM,eAAe,eAAe,EAAE,SAAS,eAAe,IAAI,CAAC,cAAc,CAAC;CAClF,MAAM,aAAa,eACV,EACL,UAAU,MAAc;EAEtB,IAAI,EADY,OAAO,MAAM,WAAW,EAAE,KAAK,IAAI,KAEjD,OAAO,IAAI,MAAM,EAAE,mDAAmD,CAAC;CAG3E,EACF,IACA,CAAC,CAAC,CACJ;CAQA,MAAM,EAAE,aAAa,cAAc,eAAe,UAAU,aAEzD;EACD;EACA,UAXe,YACf,OAAO,cAAmC;GACxC,MAAM,KAAK,UAAU,UAAU,SAAS,SAAS;GACjD,MAAM;EACR,GACA;GAAC;GAAM;GAAW;EAAK,CAMvB;EACA;CACF,CAAC;CAED,gBAAgB;EACd,OAAO,MAAM;CACf,GAAG,CAAC,KAAK,CAAC;CAEV,MAAM,QAAQ,YAAY,EAAE,qBAAqB,IAAI,EAAE,eAAe;CACtE,MAAM,cAAc,YAChB,EAAE,iDAAiD,IACnD,EAAE,mCAAmC;CACzC,MAAM,iBACJ,CAAC,MAAM,SAAS,KAAK,KAAK,MAAM,YAAY,WAAW;CAEzD,OACE,qBAAC,OAAO,MAAR;EAAa,WAAU;YAAvB,CACG,SAAS,oBAAC,OAAO,QAAR;GAAsB;GAAoB;GAAoB;EAAQ,CAAA,GAChF,qBAAC,QAAD;GAAM,cAAa;GAAM,UAAU;aAAnC,CACE,oBAAC,OAAO,MAAR,EAAA,UACE,oBAAC,WAAD;IACE,cAAY;IACZ,OAAO,CAAC,CAAC,YAAY;IACrB,cAAc,YAAY,SAAS;IACnC,IAAG;IACH,MAAK;IACL,WAAW,MAAM,cAAc,WAAW,EAAE,OAAO,KAAK;IACxD,aAAa,EAAE,yBAAyB;IACxC,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;IACT,MAAK;cAEJ,EAAE,QAAQ;GACyB,CAAA,GACtC,oBAAC,OAAO,6BAAR;IACE,WAAU;IACV,UAAU,OAAO,KAAK,WAAW,CAAC,CAAC,SAAS,KAAK;IACjD,MAAK;cAEJ,iBAAiB,EAAE,QAAQ,IAAI,EAAE,MAAM;GACN,CAAA,CACf,EAAA,CAAA,EACV,CAAA,CACX;IACK;;AAEjB"}

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

@@ -0,0 +1,61 @@
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Button } from "../../Button/Button.mjs";
+import { Alert } from "../../Dialog/components/Alert.mjs";
+import { useNotificationApi } from "../../Notifications/hooks/useNotificationApi.mjs";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Poll/PollActions/EndPollAlert.tsx
+var EndPollAlert = () => {
+	const { addNotification } = useNotificationApi();
+	const { t } = useTranslationContext();
+	const { poll } = usePollContext();
+	const { close } = useModalContext();
+	return /* @__PURE__ */ jsxs(Alert.Root, {
+		className: "str-chat__end-poll-alert",
+		children: [/* @__PURE__ */ jsx(Alert.Header, {
+			description: t("Do you want to end this poll now? Nobody will be able to vote in this poll anymore."),
+			title: t("End this poll?")
+		}), /* @__PURE__ */ jsxs(Alert.Actions, { children: [/* @__PURE__ */ jsx(Button, {
+			appearance: "outline",
+			className: "str-chat__end-poll-alert__end-vote-button",
+			"data-testid": "end-poll-alert-end-vote-button",
+			onClick: async () => {
+				try {
+					await poll.close();
+					close();
+					addNotification({
+						emitter: "EndPollAlert",
+						message: t("Poll ended"),
+						severity: "success",
+						type: "api:poll:end:success"
+					});
+				} catch (e) {
+					addNotification({
+						emitter: "EndPollAlert",
+						error: e instanceof Error ? e : void 0,
+						message: t("Failed to end the poll"),
+						severity: "error",
+						type: "api:poll:end:failed"
+					});
+				}
+			},
+			size: "md",
+			variant: "danger",
+			children: t("End poll")
+		}), /* @__PURE__ */ jsx(Button, {
+			appearance: "outline",
+			className: "str-chat__end-poll-alert__cancel-button",
+			"data-testid": "end-poll-alert-cancel-button",
+			onClick: close,
+			size: "md",
+			variant: "secondary",
+			children: t("Cancel")
+		})] })]
+	});
+};
+//#endregion
+export { EndPollAlert };
+
+//# sourceMappingURL=EndPollAlert.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EndPollAlert.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/EndPollAlert.tsx"],"sourcesContent":["import React from 'react';\nimport { Alert } from '../../Dialog';\nimport { useModalContext, usePollContext, useTranslationContext } from '../../../context';\nimport { Button } from '../../Button';\nimport { useNotificationApi } from '../../Notifications';\n\nexport const EndPollAlert = () => {\n  const { addNotification } = useNotificationApi();\n  const { t } = useTranslationContext();\n  const { poll } = usePollContext();\n  const { close } = useModalContext();\n\n  return (\n    <Alert.Root className={'str-chat__end-poll-alert'}>\n      <Alert.Header\n        description={t(\n          'Do you want to end this poll now? Nobody will be able to vote in this poll anymore.',\n        )}\n        title={t('End this poll?')}\n      ></Alert.Header>\n      <Alert.Actions>\n        <Button\n          appearance='outline'\n          className='str-chat__end-poll-alert__end-vote-button'\n          data-testid='end-poll-alert-end-vote-button'\n          onClick={async () => {\n            try {\n              await poll.close();\n              close();\n              addNotification({\n                emitter: 'EndPollAlert',\n                message: t('Poll ended'),\n                severity: 'success',\n                type: 'api:poll:end:success',\n              });\n            } catch (e) {\n              addNotification({\n                emitter: 'EndPollAlert',\n                error: e instanceof Error ? e : undefined,\n                message: t('Failed to end the poll'),\n                severity: 'error',\n                type: 'api:poll:end:failed',\n              });\n            }\n          }}\n          size='md'\n          variant='danger'\n        >\n          {t('End poll')}\n        </Button>\n        <Button\n          appearance='outline'\n          className='str-chat__end-poll-alert__cancel-button'\n          data-testid='end-poll-alert-cancel-button'\n          onClick={close}\n          size='md'\n          variant='secondary'\n        >\n          {t('Cancel')}\n        </Button>\n      </Alert.Actions>\n    </Alert.Root>\n  );\n};\n"],"mappings":";;;;;;;;;AAMA,IAAa,qBAAqB;CAChC,MAAM,EAAE,oBAAoB,mBAAmB;CAC/C,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EAAE,UAAU,gBAAgB;CAElC,OACE,qBAAC,MAAM,MAAP;EAAY,WAAW;YAAvB,CACE,oBAAC,MAAM,QAAP;GACE,aAAa,EACX,qFACF;GACA,OAAO,EAAE,gBAAgB;EACZ,CAAA,GACf,qBAAC,MAAM,SAAP,EAAA,UAAA,CACE,oBAAC,QAAD;GACE,YAAW;GACX,WAAU;GACV,eAAY;GACZ,SAAS,YAAY;IACnB,IAAI;KACF,MAAM,KAAK,MAAM;KACjB,MAAM;KACN,gBAAgB;MACd,SAAS;MACT,SAAS,EAAE,YAAY;MACvB,UAAU;MACV,MAAM;KACR,CAAC;IACH,SAAS,GAAG;KACV,gBAAgB;MACd,SAAS;MACT,OAAO,aAAa,QAAQ,IAAI,KAAA;MAChC,SAAS,EAAE,wBAAwB;MACnC,UAAU;MACV,MAAM;KACR,CAAC;IACH;GACF;GACA,MAAK;GACL,SAAQ;aAEP,EAAE,UAAU;EACP,CAAA,GACR,oBAAC,QAAD;GACE,YAAW;GACX,WAAU;GACV,eAAY;GACZ,SAAS;GACT,MAAK;GACL,SAAQ;aAEP,EAAE,QAAQ;EACL,CAAA,CACK,EAAA,CAAA,CACL;;AAEhB"}

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

@@ -0,0 +1,27 @@
+import { useComponentContext } from "../../../context/ComponentContext.mjs";
+import { Button } from "../../Button/Button.mjs";
+import { GlobalModal } from "../../Modal/GlobalModal.mjs";
+import "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+//#region src/components/Poll/PollActions/PollAction.tsx
+var PollAction = ({ buttonText, children, closeModal, isAdditionalAction, modalClassName, modalIsOpen, openModal }) => {
+	const { Modal = GlobalModal } = useComponentContext();
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Button, {
+		appearance: "outline",
+		className: clsx("str-chat__poll-action", { "str-chat__poll-action--additional": isAdditionalAction }),
+		onClick: openModal,
+		size: "md",
+		variant: "secondary",
+		children: buttonText
+	}), /* @__PURE__ */ jsx(Modal, {
+		className: modalClassName,
+		onClose: closeModal,
+		open: modalIsOpen,
+		children
+	})] });
+};
+//#endregion
+export { PollAction };
+
+//# sourceMappingURL=PollAction.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PollAction.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/PollAction.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport React from 'react';\nimport { GlobalModal } from '../../Modal';\nimport { useComponentContext } from '../../../context';\nimport { Button } from '../../Button';\nimport clsx from 'clsx';\n\nexport type PollActionProps = {\n  buttonText: string;\n  closeModal: () => void;\n  modalIsOpen: boolean;\n  openModal: () => void;\n  /**\n   * Additional actions are shown based on the poll settings defined by the creator.\n   * Examples are \"Suggest an option\", \"Add a comment\", \"View N comment(s)\".\n   */\n  isAdditionalAction?: boolean;\n  modalClassName?: string;\n};\n\nexport const PollAction = ({\n  buttonText,\n  children,\n  closeModal,\n  isAdditionalAction,\n  modalClassName,\n  modalIsOpen,\n  openModal,\n}: PropsWithChildren<PollActionProps>) => {\n  const { Modal = GlobalModal } = useComponentContext();\n  return (\n    <>\n      <Button\n        appearance='outline'\n        className={clsx('str-chat__poll-action', {\n          'str-chat__poll-action--additional': isAdditionalAction,\n        })}\n        onClick={openModal}\n        size='md'\n        variant='secondary'\n      >\n        {buttonText}\n      </Button>\n      <Modal className={modalClassName} onClose={closeModal} open={modalIsOpen}>\n        {children}\n      </Modal>\n    </>\n  );\n};\n"],"mappings":";;;;;;;AAoBA,IAAa,cAAc,EACzB,YACA,UACA,YACA,oBACA,gBACA,aACA,gBACwC;CACxC,MAAM,EAAE,QAAQ,gBAAgB,oBAAoB;CACpD,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,QAAD;EACE,YAAW;EACX,WAAW,KAAK,yBAAyB,EACvC,qCAAqC,mBACvC,CAAC;EACD,SAAS;EACT,MAAK;EACL,SAAQ;YAEP;CACK,CAAA,GACR,oBAAC,OAAD;EAAO,WAAW;EAAgB,SAAS;EAAY,MAAM;EAC1D;CACI,CAAA,CACP,EAAA,CAAA;AAEN"}

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

@@ -0,0 +1,92 @@
+import { useChannelStateContext } from "../../../context/ChannelStateContext.mjs";
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useMessageContext } from "../../../context/MessageContext.mjs";
+import { usePollContext } from "../../../context/PollContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { AddCommentPrompt } from "./AddCommentPrompt.mjs";
+import { EndPollAlert } from "./EndPollAlert.mjs";
+import { PollAction } from "./PollAction.mjs";
+import { SuggestPollOptionPrompt } from "./SuggestPollOptionPrompt.mjs";
+import { PollAnswerList } from "./PollAnswerList.mjs";
+import { PollResults } from "./PollResults/PollResults.mjs";
+import { useCallback, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+//#region src/components/Poll/PollActions/PollActions.tsx
+var COMMON_MODAL_CLASS = "str-chat__poll-action-modal";
+var pollStateSelector = (nextValue) => ({
+	allow_answers: nextValue.allow_answers,
+	allow_user_suggested_options: nextValue.allow_user_suggested_options,
+	answers_count: nextValue.answers_count,
+	created_by_id: nextValue.created_by_id,
+	is_closed: nextValue.is_closed,
+	options: nextValue.options,
+	ownAnswer: nextValue.ownAnswer,
+	voteCount: nextValue.vote_count
+});
+var PollActions = ({ AddCommentPrompt: AddCommentPrompt$1 = AddCommentPrompt, EndPollAlert: EndPollAlert$1 = EndPollAlert, PollAnswerList: PollAnswerList$1 = PollAnswerList, PollResults: PollResults$1 = PollResults, SuggestPollOptionForm = SuggestPollOptionPrompt }) => {
+	const { client } = useChatContext();
+	const { t } = useTranslationContext("PollActions");
+	const { channelCapabilities = {} } = useChannelStateContext("PollActions");
+	const { message } = useMessageContext("PollActions");
+	const { poll } = usePollContext();
+	const { allow_answers, allow_user_suggested_options, answers_count, created_by_id, is_closed, options, ownAnswer, voteCount } = useStateStore(poll.state, pollStateSelector);
+	const [modalOpen, setModalOpen] = useState();
+	const canCastVote = channelCapabilities["cast-poll-vote"] && !is_closed;
+	const closeModal = useCallback(() => setModalOpen(void 0), []);
+	const onUpdateAnswerClick = useCallback(() => setModalOpen("add-comment"), []);
+	if (!(!is_closed && created_by_id === client.user?.id || !!voteCount || canCastVote && allow_user_suggested_options && options.length < 100 || !is_closed && allow_answers || answers_count > 0 && channelCapabilities["query-poll-votes"])) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "str-chat__poll-actions",
+		children: [
+			!is_closed && created_by_id === client.user?.id && /* @__PURE__ */ jsx(PollAction, {
+				buttonText: t("End poll"),
+				closeModal,
+				modalClassName: clsx(COMMON_MODAL_CLASS, "str-chat__end-poll-modal"),
+				modalIsOpen: modalOpen === "end-vote",
+				openModal: () => setModalOpen("end-vote"),
+				children: /* @__PURE__ */ jsx(EndPollAlert$1, {})
+			}),
+			!!voteCount && /* @__PURE__ */ jsx(PollAction, {
+				buttonText: t("View results"),
+				closeModal,
+				modalClassName: clsx(COMMON_MODAL_CLASS, "str-chat__poll-results-modal"),
+				modalIsOpen: modalOpen === "view-results",
+				openModal: () => setModalOpen("view-results"),
+				children: /* @__PURE__ */ jsx(PollResults$1, {})
+			}),
+			canCastVote && allow_user_suggested_options && options.length < 100 && /* @__PURE__ */ jsx(PollAction, {
+				buttonText: t("Suggest an option"),
+				closeModal,
+				isAdditionalAction: true,
+				modalClassName: clsx(COMMON_MODAL_CLASS, "str-chat__suggest-poll-option-modal"),
+				modalIsOpen: modalOpen === "suggest-option",
+				openModal: () => setModalOpen("suggest-option"),
+				children: /* @__PURE__ */ jsx(SuggestPollOptionForm, {})
+			}),
+			!is_closed && allow_answers && /* @__PURE__ */ jsx(PollAction, {
+				buttonText: ownAnswer ? t("Update your comment") : t("Add a comment"),
+				closeModal,
+				isAdditionalAction: true,
+				modalClassName: clsx(COMMON_MODAL_CLASS, "str-chat__add-poll-answer-modal"),
+				modalIsOpen: modalOpen === "add-comment",
+				openModal: () => setModalOpen("add-comment"),
+				children: /* @__PURE__ */ jsx(AddCommentPrompt$1, { messageId: message.id })
+			}),
+			answers_count > 0 && channelCapabilities["query-poll-votes"] && /* @__PURE__ */ jsx(PollAction, {
+				buttonText: t("View {{count}} comments", { count: answers_count }),
+				closeModal,
+				isAdditionalAction: true,
+				modalClassName: clsx(COMMON_MODAL_CLASS, "str-chat__poll-answer-list-modal"),
+				modalIsOpen: modalOpen === "view-comments",
+				openModal: () => setModalOpen("view-comments"),
+				children: /* @__PURE__ */ jsx(PollAnswerList$1, { onUpdateOwnAnswerClick: onUpdateAnswerClick })
+			})
+		]
+	});
+};
+//#endregion
+export { PollActions };
+
+//# sourceMappingURL=PollActions.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"PollActions.mjs","names":[],"sources":["../../../../../src/components/Poll/PollActions/PollActions.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport React, { useCallback, useState } from 'react';\nimport { PollAction } from './PollAction';\nimport type { AddCommentPromptProps } from './AddCommentPrompt';\nimport { AddCommentPrompt as DefaultAddCommentPrompt } from './AddCommentPrompt';\nimport type { SuggestPollOptionFormProps } from './SuggestPollOptionPrompt';\nimport { SuggestPollOptionPrompt as DefaultSuggestPollOptionForm } from './SuggestPollOptionPrompt';\nimport { EndPollAlert as DefaultEndPollAlert } from './EndPollAlert';\nimport type { PollAnswerListProps } from './PollAnswerList';\nimport { PollAnswerList as DefaultPollAnswerList } from './PollAnswerList';\nimport { PollResults as DefaultPollResults } from './PollResults';\nimport { MAX_POLL_OPTIONS } from '../constants';\nimport {\n  useChannelStateContext,\n  useChatContext,\n  useMessageContext,\n  usePollContext,\n  useTranslationContext,\n} from '../../../context';\nimport { useStateStore } from '../../../store';\n\nimport type { PollState } from 'stream-chat';\n\nconst COMMON_MODAL_CLASS = 'str-chat__poll-action-modal' as const;\n\ntype ModalName =\n  | 'suggest-option'\n  | 'add-comment'\n  | 'view-comments'\n  | 'view-results'\n  | 'end-vote';\n\nconst pollStateSelector = (nextValue: PollState) => ({\n  allow_answers: nextValue.allow_answers,\n  allow_user_suggested_options: nextValue.allow_user_suggested_options,\n  answers_count: nextValue.answers_count,\n  created_by_id: nextValue.created_by_id,\n  is_closed: nextValue.is_closed,\n  options: nextValue.options,\n  ownAnswer: nextValue.ownAnswer,\n  voteCount: nextValue.vote_count,\n});\n\nexport type PollActionsProps = {\n  AddCommentPrompt?: React.ComponentType<AddCommentPromptProps>;\n  EndPollAlert?: React.ComponentType;\n  PollAnswerList?: React.ComponentType<PollAnswerListProps>;\n  PollResults?: React.ComponentType;\n  SuggestPollOptionForm?: React.ComponentType<SuggestPollOptionFormProps>;\n};\n\nexport const PollActions = ({\n  AddCommentPrompt = DefaultAddCommentPrompt,\n  EndPollAlert = DefaultEndPollAlert,\n  PollAnswerList = DefaultPollAnswerList,\n  PollResults = DefaultPollResults,\n  SuggestPollOptionForm = DefaultSuggestPollOptionForm,\n}: PollActionsProps) => {\n  const { client } = useChatContext();\n  const { t } = useTranslationContext('PollActions');\n  const { channelCapabilities = {} } = useChannelStateContext('PollActions');\n  const { message } = useMessageContext('PollActions');\n  const { poll } = usePollContext();\n  const {\n    allow_answers,\n    allow_user_suggested_options,\n    answers_count,\n    created_by_id,\n    is_closed,\n    options,\n    ownAnswer,\n    voteCount,\n  } = useStateStore(poll.state, pollStateSelector);\n  const [modalOpen, setModalOpen] = useState<ModalName | undefined>();\n\n  const canCastVote = channelCapabilities['cast-poll-vote'] && !is_closed;\n  const closeModal = useCallback(() => setModalOpen(undefined), []);\n  const onUpdateAnswerClick = useCallback(() => setModalOpen('add-comment'), []);\n\n  const hasContents =\n    (!is_closed && created_by_id === client.user?.id) ||\n    !!voteCount ||\n    (canCastVote && allow_user_suggested_options && options.length < MAX_POLL_OPTIONS) ||\n    (!is_closed && allow_answers) ||\n    (answers_count > 0 && channelCapabilities['query-poll-votes']);\n\n  if (!hasContents) return null;\n\n  return (\n    <div className='str-chat__poll-actions'>\n      {!is_closed && created_by_id === client.user?.id && (\n        <PollAction\n          buttonText={t('End poll')}\n          closeModal={closeModal}\n          modalClassName={clsx(COMMON_MODAL_CLASS, 'str-chat__end-poll-modal')}\n          modalIsOpen={modalOpen === 'end-vote'}\n          openModal={() => setModalOpen('end-vote')}\n        >\n          <EndPollAlert />\n        </PollAction>\n      )}\n\n      {!!voteCount && (\n        <PollAction\n          buttonText={t('View results')}\n          closeModal={closeModal}\n          modalClassName={clsx(COMMON_MODAL_CLASS, 'str-chat__poll-results-modal')}\n          modalIsOpen={modalOpen === 'view-results'}\n          openModal={() => setModalOpen('view-results')}\n        >\n          <PollResults />\n        </PollAction>\n      )}\n\n      {canCastVote &&\n        allow_user_suggested_options &&\n        options.length < MAX_POLL_OPTIONS && (\n          <PollAction\n            buttonText={t('Suggest an option')}\n            closeModal={closeModal}\n            isAdditionalAction\n            modalClassName={clsx(\n              COMMON_MODAL_CLASS,\n              'str-chat__suggest-poll-option-modal',\n            )}\n            modalIsOpen={modalOpen === 'suggest-option'}\n            openModal={() => setModalOpen('suggest-option')}\n          >\n            <SuggestPollOptionForm />\n          </PollAction>\n        )}\n\n      {!is_closed && allow_answers && (\n        <PollAction\n          buttonText={ownAnswer ? t('Update your comment') : t('Add a comment')}\n          closeModal={closeModal}\n          isAdditionalAction\n          modalClassName={clsx(COMMON_MODAL_CLASS, 'str-chat__add-poll-answer-modal')}\n          modalIsOpen={modalOpen === 'add-comment'}\n          openModal={() => setModalOpen('add-comment')}\n        >\n          <AddCommentPrompt messageId={message.id} />\n        </PollAction>\n      )}\n\n      {answers_count > 0 && channelCapabilities['query-poll-votes'] && (\n        <PollAction\n          buttonText={t('View {{count}} comments', { count: answers_count })}\n          closeModal={closeModal}\n          isAdditionalAction\n          modalClassName={clsx(COMMON_MODAL_CLASS, 'str-chat__poll-answer-list-modal')}\n          modalIsOpen={modalOpen === 'view-comments'}\n          openModal={() => setModalOpen('view-comments')}\n        >\n          <PollAnswerList onUpdateOwnAnswerClick={onUpdateAnswerClick} />\n        </PollAction>\n      )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAuBA,IAAM,qBAAqB;AAS3B,IAAM,qBAAqB,eAA0B;CACnD,eAAe,UAAU;CACzB,8BAA8B,UAAU;CACxC,eAAe,UAAU;CACzB,eAAe,UAAU;CACzB,WAAW,UAAU;CACrB,SAAS,UAAU;CACnB,WAAW,UAAU;CACrB,WAAW,UAAU;AACvB;AAUA,IAAa,eAAe,EAC1B,kBAAA,qBAAmB,kBACnB,cAAA,iBAAe,cACf,gBAAA,mBAAiB,gBACjB,aAAA,gBAAc,aACd,wBAAwB,8BACF;CACtB,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,EAAE,MAAM,sBAAsB,aAAa;CACjD,MAAM,EAAE,sBAAsB,CAAC,MAAM,uBAAuB,aAAa;CACzE,MAAM,EAAE,YAAY,kBAAkB,aAAa;CACnD,MAAM,EAAE,SAAS,eAAe;CAChC,MAAM,EACJ,eACA,8BACA,eACA,eACA,WACA,SACA,WACA,cACE,cAAc,KAAK,OAAO,iBAAiB;CAC/C,MAAM,CAAC,WAAW,gBAAgB,SAAgC;CAElE,MAAM,cAAc,oBAAoB,qBAAqB,CAAC;CAC9D,MAAM,aAAa,kBAAkB,aAAa,KAAA,CAAS,GAAG,CAAC,CAAC;CAChE,MAAM,sBAAsB,kBAAkB,aAAa,aAAa,GAAG,CAAC,CAAC;CAS7E,IAAI,EAND,CAAC,aAAa,kBAAkB,OAAO,MAAM,MAC9C,CAAC,CAAC,aACD,eAAe,gCAAgC,QAAQ,SAAA,OACvD,CAAC,aAAa,iBACd,gBAAgB,KAAK,oBAAoB,sBAE1B,OAAO;CAEzB,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACG,CAAC,aAAa,kBAAkB,OAAO,MAAM,MAC5C,oBAAC,YAAD;IACE,YAAY,EAAE,UAAU;IACZ;IACZ,gBAAgB,KAAK,oBAAoB,0BAA0B;IACnE,aAAa,cAAc;IAC3B,iBAAiB,aAAa,UAAU;cAExC,oBAAC,gBAAD,CAAe,CAAA;GACL,CAAA;GAGb,CAAC,CAAC,aACD,oBAAC,YAAD;IACE,YAAY,EAAE,cAAc;IAChB;IACZ,gBAAgB,KAAK,oBAAoB,8BAA8B;IACvE,aAAa,cAAc;IAC3B,iBAAiB,aAAa,cAAc;cAE5C,oBAAC,eAAD,CAAc,CAAA;GACJ,CAAA;GAGb,eACC,gCACA,QAAQ,SAAA,OACN,oBAAC,YAAD;IACE,YAAY,EAAE,mBAAmB;IACrB;IACZ,oBAAA;IACA,gBAAgB,KACd,oBACA,qCACF;IACA,aAAa,cAAc;IAC3B,iBAAiB,aAAa,gBAAgB;cAE9C,oBAAC,uBAAD,CAAwB,CAAA;GACd,CAAA;GAGf,CAAC,aAAa,iBACb,oBAAC,YAAD;IACE,YAAY,YAAY,EAAE,qBAAqB,IAAI,EAAE,eAAe;IACxD;IACZ,oBAAA;IACA,gBAAgB,KAAK,oBAAoB,iCAAiC;IAC1E,aAAa,cAAc;IAC3B,iBAAiB,aAAa,aAAa;cAE3C,oBAAC,oBAAD,EAAkB,WAAW,QAAQ,GAAK,CAAA;GAChC,CAAA;GAGb,gBAAgB,KAAK,oBAAoB,uBACxC,oBAAC,YAAD;IACE,YAAY,EAAE,2BAA2B,EAAE,OAAO,cAAc,CAAC;IACrD;IACZ,oBAAA;IACA,gBAAgB,KAAK,oBAAoB,kCAAkC;IAC3E,aAAa,cAAc;IAC3B,iBAAiB,aAAa,eAAe;cAE7C,oBAAC,kBAAD,EAAgB,wBAAwB,oBAAsB,CAAA;GACpD,CAAA;EAEX;;AAET"}

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

@@ -0,0 +1,70 @@
+import { useChatContext } from "../../../context/ChatContext.mjs";
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.mjs";
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { Button } from "../../Button/Button.mjs";
+import { LoadingIndicator } from "../../Loading/LoadingIndicator.mjs";
+import { Viewer } from "../../Dialog/components/Viewer.mjs";
+import { PollVote } from "../PollVote.mjs";
+import { usePollAnswerPagination } from "../hooks/usePollAnswerPagination.mjs";
+import { InfiniteScrollPaginator } from "../../InfiniteScrollPaginator/InfiniteScrollPaginator.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("Review comments submitted with poll answers"),
+			title: t("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("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 { PollAnswer, PollState } from 'stream-chat';\n\ntype PollStateSelectorReturnValue = {\n  is_closed: boolean | undefined;\n  ownAnswer: PollAnswer | 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('Review comments submitted with poll answers')}\n        title={t('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('Update your comment')}\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 ? t('Update your comment') : t('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,EAAE,6CAA6C;GAC5D,OAAO,EAAE,eAAe;EACzB,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,EAAE,qBAAqB;OAClB,CAAA;MACL,CAAA,CAEJ;QApBuC,WAAW,OAAO,IAoBzD,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;IAaF;;AAEjB"}

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

@@ -0,0 +1,32 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useModalContext } from "../../../context/ModalContext.mjs";
+import { usePollContext } from "../../../context/PollContext.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 "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("Review all options available in this poll"),
+			title: t("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('Review all options available in this poll')}\n        title={t('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,EAAE,2CAA2C;GAC1D,OAAO,EAAE,cAAc;EACxB,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("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'>{t('Question')}</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;aAAyC,EAAE,UAAU;EAAO,CAAA,GAC3E,oBAAC,OAAD;GAAK,WAAU;aAAwC;EAAc,CAAA,CAClE;;AAET"}

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

@@ -0,0 +1,49 @@
+import { useChannelStateContext } from "../../../../context/ChannelStateContext.mjs";
+import { useStateStore } from "../../../../store/hooks/useStateStore.mjs";
+import { usePollContext } from "../../../../context/PollContext.mjs";
+import { useTranslationContext } from "../../../../context/TranslationContext.mjs";
+import { Button } from "../../../Button/Button.mjs";
+import { PollVoteListing } from "../../PollVote.mjs";
+import { PollOptionWithVotesHeader } from "./PollOptionWithVotesHeader.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 { t } = useTranslationContext();
+	const { channelCapabilities = {} } = useChannelStateContext("PollOptionWithVotes");
+	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["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("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 {\n  useChannelStateContext,\n  usePollContext,\n  useTranslationContext,\n} from '../../../../context';\nimport type { PollOption, PollState, PollVote } from 'stream-chat';\nimport { Button } from '../../../Button';\nimport clsx from 'clsx';\n\ntype PollStateSelectorReturnValue = {\n  latest_votes_by_option: Record<string, PollVote[]>;\n};\n\nconst pollStateSelector = (nextValue: PollState): PollStateSelectorReturnValue => ({\n  latest_votes_by_option: nextValue.latest_votes_by_option,\n});\n\nexport type PollOptionWithVotesProps = {\n  option: PollOption;\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 { t } = useTranslationContext();\n  const { channelCapabilities = {} } = useChannelStateContext('PollOptionWithVotes');\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['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('View all')}\n            </Button>\n          </div>\n        )}\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;;;;AAiBA,IAAM,qBAAqB,eAAwD,EACjF,wBAAwB,UAAU,uBACpC;AASA,IAAa,uBAAuB,EAClC,mBACA,QACA,aACA,mBAC8B;CAC9B,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,sBAAsB,CAAC,MAAM,uBAAuB,qBAAqB;CACjF,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,uBACnB,gBACA,kBACA,OAAO,SAAS,qBACd,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,QAAD;KACE,YAAW;KACX,WAAU;KACV,SAAS;KACT,MAAK;KACL,SAAQ;eAEP,EAAE,UAAU;IACP,CAAA;GACL,CAAA;EAEN;;AAET"}