@yext/chat-ui-react 0.12.1 → 0.12.2

package/lib/commonjs/src/components/InitialMessagePopUp.d.ts

@@ -1,33 +0,0 @@
-import React from "react";
-/**
- * The CSS class interface for the InitialMessagePopUp component.
- *
- * @public
- */
-export interface InitialMessagePopUpCssClasses {
-    container?: string;
-    closeButton?: string;
-    closeButtonIcon?: string;
-    message?: string;
-}
-/**
- * The props for the {@link InitialMessagePopUp} component.
- *
- * @internal
- */
-interface InitialMessagePopUpProps {
-    /** CSS classes for customizing the component styling. */
-    customCssClasses?: InitialMessagePopUpCssClasses;
-    /** Function to call when user click on the close button */
-    onClose: () => void;
-}
-/**
- * A component that renders a popup bubble displaying the initial message from chat bot.
- *
- * @internal
- *
- * @param props - {@link InitialMessagePopUpProps}
- */
-export declare function InitialMessagePopUp({ onClose, customCssClasses, }: InitialMessagePopUpProps): React.JSX.Element;
-export {};
-//# sourceMappingURL=InitialMessagePopUp.d.ts.map

package/lib/commonjs/src/components/InitialMessagePopUp.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"InitialMessagePopUp.d.ts","sourceRoot":"","sources":["../../../../src/components/InitialMessagePopUp.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAMvC;;;;GAIG;AACH,MAAM,WAAW,6BAA6B;IAC5C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;GAIG;AACH,UAAU,wBAAwB;IAChC,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,6BAA6B,CAAC;IACjD,2DAA2D;IAC3D,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAWD;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,gBAAgB,GACjB,EAAE,wBAAwB,qBA0B1B"}

package/lib/commonjs/src/components/InitialMessagePopUp.js

@@ -1,44 +0,0 @@
-'use strict';
-
-var React = require('react');
-var Cross = require('../icons/Cross.js');
-var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-var chatHeadlessReact = require('@yext/chat-headless-react');
-var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-const builtInCssClasses = withStylelessCssClasses.withStylelessCssClasses("InitialMessagePopUp", {
-    container: "flex gap-x-1 animate-fade-in",
-    closeButton: "bg-white w-4 h-4 rounded-full border border-slate-300",
-    closeButtonIcon: "",
-    message: "line-clamp-2 w-60 p-2.5 bg-white rounded-xl shadow-xl text-sm lg:text-base",
-});
-/**
- * A component that renders a popup bubble displaying the initial message from chat bot.
- *
- * @internal
- *
- * @param props - {@link InitialMessagePopUpProps}
- */
-function InitialMessagePopUp({ onClose, customCssClasses, }) {
-    const messages = chatHeadlessReact.useChatState((s) => s.conversation.messages);
-    const cssClasses = useComposedCssClasses.useComposedCssClasses(builtInCssClasses, customCssClasses);
-    const firstBotMessage = React.useMemo(() => {
-        return messages.length !== 0 && messages[0].source === chatHeadlessReact.MessageSource.BOT
-            ? messages[0].text
-            : "";
-    }, [messages]);
-    if (firstBotMessage.length === 0) {
-        return React__default.default.createElement(React__default.default.Fragment, null);
-    }
-    return (React__default.default.createElement("div", { className: cssClasses.container },
-        React__default.default.createElement("button", { "aria-label": "Close Initial Message", onClick: onClose, className: cssClasses.closeButton },
-            React__default.default.createElement(Cross.CrossIcon, { className: cssClasses.closeButtonIcon })),
-        React__default.default.createElement("div", { className: cssClasses.message }, firstBotMessage)));
-}
-
-exports.InitialMessagePopUp = InitialMessagePopUp;
-//# sourceMappingURL=InitialMessagePopUp.js.map

package/lib/commonjs/src/components/InitialMessagePopUp.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InitialMessagePopUp.js","sources":["../../../../src/components/InitialMessagePopUp.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { CrossIcon } from \"../icons/Cross\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { MessageSource, useChatState } from \"@yext/chat-headless-react\";\n\n/**\n * The CSS class interface for the InitialMessagePopUp component.\n *\n * @public\n */\nexport interface InitialMessagePopUpCssClasses {\n  container?: string;\n  closeButton?: string;\n  closeButtonIcon?: string;\n  message?: string;\n}\n\n/**\n * The props for the {@link InitialMessagePopUp} component.\n *\n * @internal\n */\ninterface InitialMessagePopUpProps {\n  /** CSS classes for customizing the component styling. */\n  customCssClasses?: InitialMessagePopUpCssClasses;\n  /** Function to call when user click on the close button */\n  onClose: () => void;\n}\n\nconst builtInCssClasses: InitialMessagePopUpCssClasses =\n  withStylelessCssClasses(\"InitialMessagePopUp\", {\n    container: \"flex gap-x-1 animate-fade-in\",\n    closeButton: \"bg-white w-4 h-4 rounded-full border border-slate-300\",\n    closeButtonIcon: \"\",\n    message:\n      \"line-clamp-2 w-60 p-2.5 bg-white rounded-xl shadow-xl text-sm lg:text-base\",\n  });\n\n/**\n * A component that renders a popup bubble displaying the initial message from chat bot.\n *\n * @internal\n *\n * @param props - {@link InitialMessagePopUpProps}\n */\nexport function InitialMessagePopUp({\n  onClose,\n  customCssClasses,\n}: InitialMessagePopUpProps) {\n  const messages = useChatState((s) => s.conversation.messages);\n  const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n\n  const firstBotMessage: string = useMemo(() => {\n    return messages.length !== 0 && messages[0].source === MessageSource.BOT\n      ? messages[0].text\n      : \"\";\n  }, [messages]);\n\n  if (firstBotMessage.length === 0) {\n    return <></>;\n  }\n\n  return (\n    <div className={cssClasses.container}>\n      <button\n        aria-label=\"Close Initial Message\"\n        onClick={onClose}\n        className={cssClasses.closeButton}\n      >\n        <CrossIcon className={cssClasses.closeButtonIcon} />\n      </button>\n      <div className={cssClasses.message}>{firstBotMessage}</div>\n    </div>\n  );\n}\n"],"names":["withStylelessCssClasses","useChatState","useComposedCssClasses","useMemo","MessageSource","React","CrossIcon"],"mappings":";;;;;;;;;;;;AA8BA,MAAM,iBAAiB,GACrBA,+CAAuB,CAAC,qBAAqB,EAAE;AAC7C,IAAA,SAAS,EAAE,8BAA8B;AACzC,IAAA,WAAW,EAAE,uDAAuD;AACpE,IAAA,eAAe,EAAE,EAAE;AACnB,IAAA,OAAO,EACL,4EAA4E;AAC/E,CAAA,CAAC,CAAC;AAEL;;;;;;AAMG;SACa,mBAAmB,CAAC,EAClC,OAAO,EACP,gBAAgB,GACS,EAAA;AACzB,IAAA,MAAM,QAAQ,GAAGC,8BAAY,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;IAC9D,MAAM,UAAU,GAAGC,2CAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;AAE9E,IAAA,MAAM,eAAe,GAAWC,aAAO,CAAC,MAAK;AAC3C,QAAA,OAAO,QAAQ,CAAC,MAAM,KAAK,CAAC,IAAI,QAAQ,CAAC,CAAC,CAAC,CAAC,MAAM,KAAKC,+BAAa,CAAC,GAAG;AACtE,cAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI;cAChB,EAAE,CAAC;AACT,KAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;AAEf,IAAA,IAAI,eAAe,CAAC,MAAM,KAAK,CAAC,EAAE;AAChC,QAAA,OAAOC,2EAAK,CAAC;AACd,KAAA;AAED,IAAA,QACEA,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,SAAS,EAAA;QAClCA,sBACa,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,YAAA,EAAA,uBAAuB,EAClC,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,UAAU,CAAC,WAAW,EAAA;YAEjCA,sBAAC,CAAA,aAAA,CAAAC,eAAS,IAAC,SAAS,EAAE,UAAU,CAAC,eAAe,GAAI,CAC7C;QACTD,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,CAAC,OAAO,IAAG,eAAe,CAAO,CACvD,EACN;AACJ;;;;"}

package/lib/commonjs/src/components/LoadingDots.d.ts

@@ -1,10 +0,0 @@
-import React from "react";
-/**
- * A component that signifies loading status.
- *
- * @internal
- */
-export declare function LoadingDots({ className }: {
-    className?: string;
-}): React.JSX.Element;
-//# sourceMappingURL=LoadingDots.d.ts.map

package/lib/commonjs/src/components/LoadingDots.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoadingDots.d.ts","sourceRoot":"","sources":["../../../../src/components/LoadingDots.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,qBAWhE"}

package/lib/commonjs/src/components/LoadingDots.js

@@ -1,23 +0,0 @@
-'use strict';
-
-var React = require('react');
-var tailwindMerge = require('tailwind-merge');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-/**
- * A component that signifies loading status.
- *
- * @internal
- */
-function LoadingDots({ className }) {
-    return (React__default.default.createElement("div", { "aria-label": "Loading Indicator", className: tailwindMerge.twMerge("flex gap-1 p-2 animate-fade-in", className) },
-        React__default.default.createElement("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite]" }),
-        React__default.default.createElement("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.3s]" }),
-        React__default.default.createElement("div", { className: "w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.6s]" })));
-}
-
-exports.LoadingDots = LoadingDots;
-//# sourceMappingURL=LoadingDots.js.map

package/lib/commonjs/src/components/LoadingDots.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoadingDots.js","sources":["../../../../src/components/LoadingDots.tsx"],"sourcesContent":["import React from \"react\";\nimport { twMerge } from \"tailwind-merge\";\n\n/**\n * A component that signifies loading status.\n *\n * @internal\n */\nexport function LoadingDots({ className }: { className?: string }) {\n  return (\n    <div\n      aria-label=\"Loading Indicator\"\n      className={twMerge(\"flex gap-1 p-2 animate-fade-in\", className)}\n    >\n      <div className=\"w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite]\" />\n      <div className=\"w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.3s]\" />\n      <div className=\"w-2 h-2 bg-slate-500 rounded-full animate-[bounce_1s_infinite_0.6s]\" />\n    </div>\n  );\n}\n"],"names":["React","twMerge"],"mappings":";;;;;;;;;AAGA;;;;AAIG;AACa,SAAA,WAAW,CAAC,EAAE,SAAS,EAA0B,EAAA;IAC/D,QACEA,sBACa,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,YAAA,EAAA,mBAAmB,EAC9B,SAAS,EAAEC,qBAAO,CAAC,gCAAgC,EAAE,SAAS,CAAC,EAAA;QAE/DD,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,gEAAgE,EAAG,CAAA;QAClFA,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAC,qEAAqE,EAAG,CAAA;AACvF,QAAAA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qEAAqE,EAAG,CAAA,CACnF,EACN;AACJ;;;;"}

package/lib/commonjs/src/components/Markdown.d.ts

@@ -1,39 +0,0 @@
-import React from "react";
-/**
- * The CSS class interface for the Markdown component.
- *
- * @internal
- */
-export interface MarkdownCssClasses {
-    container?: string;
-    link?: string;
-}
-interface MarkdownProps {
-    /** Stringified markdown. */
-    content: string;
-    /** The response ID correlates to the current message. */
-    responseId?: string;
-    /** CSS classes for customizing the component styling. */
-    customCssClasses?: MarkdownCssClasses;
-    /**
-     * Action to report for analytics event when a link is clicked.
-     * Defaults to 'CHAT_LINK_CLICK'.
-     */
-    linkClickEvent?: "WEBSITE" | "CHAT_LINK_CLICK";
-    /** Link target open behavior on click. */
-    linkTarget?: string;
-    /** A callback which is called when a link is clicked. */
-    onLinkClick?: (href?: string) => void;
-}
-/**
- * Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include
- * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.
- *
- * @remarks
- * A link click will send a CHAT_LINK_CLICK analytics event
- *
- * @internal
- */
-export declare function Markdown({ content, responseId, customCssClasses, linkClickEvent, linkTarget, onLinkClick, }: MarkdownProps): React.JSX.Element;
-export {};
-//# sourceMappingURL=Markdown.d.ts.map

package/lib/commonjs/src/components/Markdown.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../src/components/Markdown.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAevC;;;;GAIG;AACH,MAAM,WAAW,kBAAkB;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAMD,UAAU,aAAa;IACrB,4BAA4B;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,kBAAkB,CAAC;IACtC;;;OAGG;IACH,cAAc,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAC;IAC/C,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yDAAyD;IACzD,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,EACvB,OAAO,EACP,UAAU,EACV,gBAAgB,EAChB,cAAkC,EAClC,UAAU,EACV,WAAW,GACZ,EAAE,aAAa,qBAgDf"}

package/lib/commonjs/src/components/Markdown.js

@@ -1,72 +0,0 @@
-'use strict';
-
-var ReactMarkdown = require('react-markdown');
-var remarkGfm = require('remark-gfm');
-var rehypeRaw = require('rehype-raw');
-var rehypeSanitize = require('rehype-sanitize');
-var React = require('react');
-var useReportAnalyticsEvent = require('../hooks/useReportAnalyticsEvent.js');
-var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var ReactMarkdown__default = /*#__PURE__*/_interopDefault(ReactMarkdown);
-var remarkGfm__default = /*#__PURE__*/_interopDefault(remarkGfm);
-var rehypeRaw__default = /*#__PURE__*/_interopDefault(rehypeRaw);
-var rehypeSanitize__default = /*#__PURE__*/_interopDefault(rehypeSanitize);
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-// The Remark and Rehype plugins to use in conjunction with ReactMarkdown.
-const unifiedPlugins = {
-    remark: [
-        remarkGfm__default.default, //renders Github-Flavored Markdown
-    ],
-    rehype: [
-        rehypeRaw__default.default,
-        rehypeSanitize__default.default, //to sanitize HTML content
-    ],
-};
-const builtInCssClasses = {
-    link: "cursor-pointer",
-};
-/**
- * Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include
- * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.
- *
- * @remarks
- * A link click will send a CHAT_LINK_CLICK analytics event
- *
- * @internal
- */
-function Markdown({ content, responseId, customCssClasses, linkClickEvent = "CHAT_LINK_CLICK", linkTarget, onLinkClick, }) {
-    const reportAnalyticsEvent = useReportAnalyticsEvent.useReportAnalyticsEvent();
-    const cssClasses = useComposedCssClasses.useComposedCssClasses(builtInCssClasses, customCssClasses);
-    const components = React.useMemo(() => {
-        const createClickHandlerFn = (href) => () => {
-            reportAnalyticsEvent({
-                action: linkClickEvent,
-                destinationUrl: href,
-                chat: {
-                    responseId,
-                },
-            });
-            onLinkClick?.(href);
-        };
-        return {
-            a: ({ node: _, children, ...props }) => {
-                return (React__default.default.createElement("a", { ...props, onClick: createClickHandlerFn(props.href), target: linkTarget, rel: "noopener noreferrer", className: cssClasses.link }, children));
-            },
-        };
-    }, [
-        reportAnalyticsEvent,
-        linkClickEvent,
-        responseId,
-        cssClasses,
-        linkTarget,
-        onLinkClick,
-    ]);
-    return (React__default.default.createElement(ReactMarkdown__default.default, { className: cssClasses.container, children: content, remarkPlugins: unifiedPlugins.remark, rehypePlugins: unifiedPlugins.rehype, components: components }));
-}
-
-exports.Markdown = Markdown;
-//# sourceMappingURL=Markdown.js.map

package/lib/commonjs/src/components/Markdown.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Markdown.js","sources":["../../../../src/components/Markdown.tsx"],"sourcesContent":["import ReactMarkdown, {\n  PluggableList,\n  ReactMarkdownOptions,\n} from \"react-markdown\";\nimport remarkGfm from \"remark-gfm\";\nimport rehypeRaw from \"rehype-raw\";\nimport rehypeSanitize from \"rehype-sanitize\";\nimport React, { useMemo } from \"react\";\nimport { useReportAnalyticsEvent } from \"../hooks/useReportAnalyticsEvent\";\nimport { useComposedCssClasses } from \"../hooks/useComposedCssClasses\";\n\n// The Remark and Rehype plugins to use in conjunction with ReactMarkdown.\nconst unifiedPlugins: { remark?: PluggableList; rehype: PluggableList } = {\n  remark: [\n    remarkGfm, //renders Github-Flavored Markdown\n  ],\n  rehype: [\n    rehypeRaw, //to support HTML embedded in markdown\n    rehypeSanitize, //to sanitize HTML content\n  ],\n};\n\n/**\n * The CSS class interface for the Markdown component.\n *\n * @internal\n */\nexport interface MarkdownCssClasses {\n  container?: string;\n  link?: string;\n}\n\nconst builtInCssClasses: MarkdownCssClasses = {\n  link: \"cursor-pointer\",\n};\n\ninterface MarkdownProps {\n  /** Stringified markdown. */\n  content: string;\n  /** The response ID correlates to the current message. */\n  responseId?: string;\n  /** CSS classes for customizing the component styling. */\n  customCssClasses?: MarkdownCssClasses;\n  /**\n   * Action to report for analytics event when a link is clicked.\n   * Defaults to 'CHAT_LINK_CLICK'.\n   */\n  linkClickEvent?: \"WEBSITE\" | \"CHAT_LINK_CLICK\";\n  /** Link target open behavior on click. */\n  linkTarget?: string;\n  /** A callback which is called when a link is clicked. */\n  onLinkClick?: (href?: string) => void;\n}\n\n/**\n * Renders Github-Flavored Markdown from the Knowledge Graph. This Markdown can include\n * arbitrary HTML. Any HTML will be sanitized according to Rehype's default Schema.\n *\n * @remarks\n * A link click will send a CHAT_LINK_CLICK analytics event\n *\n * @internal\n */\nexport function Markdown({\n  content,\n  responseId,\n  customCssClasses,\n  linkClickEvent = \"CHAT_LINK_CLICK\",\n  linkTarget,\n  onLinkClick,\n}: MarkdownProps) {\n  const reportAnalyticsEvent = useReportAnalyticsEvent();\n  const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n\n  const components: ReactMarkdownOptions[\"components\"] = useMemo(() => {\n    const createClickHandlerFn = (href?: string) => () => {\n      reportAnalyticsEvent({\n        action: linkClickEvent,\n        destinationUrl: href,\n        chat: {\n          responseId,\n        },\n      });\n      onLinkClick?.(href);\n    };\n    return {\n      a: ({ node: _, children, ...props }) => {\n        return (\n          <a\n            {...props}\n            onClick={createClickHandlerFn(props.href)}\n            target={linkTarget}\n            rel=\"noopener noreferrer\"\n            className={cssClasses.link}\n          >\n            {children}\n          </a>\n        );\n      },\n    };\n  }, [\n    reportAnalyticsEvent,\n    linkClickEvent,\n    responseId,\n    cssClasses,\n    linkTarget,\n    onLinkClick,\n  ]);\n\n  return (\n    <ReactMarkdown\n      className={cssClasses.container}\n      children={content}\n      remarkPlugins={unifiedPlugins.remark}\n      rehypePlugins={unifiedPlugins.rehype}\n      components={components}\n    />\n  );\n}\n"],"names":["remarkGfm","rehypeRaw","rehypeSanitize","useReportAnalyticsEvent","useComposedCssClasses","useMemo","React","ReactMarkdown"],"mappings":";;;;;;;;;;;;;;;;;;AAWA;AACA,MAAM,cAAc,GAAsD;AACxE,IAAA,MAAM,EAAE;AACN,QAAAA,0BAAS;AACV,KAAA;AACD,IAAA,MAAM,EAAE;QACNC,0BAAS;AACT,QAAAC,+BAAc;AACf,KAAA;CACF,CAAC;AAYF,MAAM,iBAAiB,GAAuB;AAC5C,IAAA,IAAI,EAAE,gBAAgB;CACvB,CAAC;AAoBF;;;;;;;;AAQG;SACa,QAAQ,CAAC,EACvB,OAAO,EACP,UAAU,EACV,gBAAgB,EAChB,cAAc,GAAG,iBAAiB,EAClC,UAAU,EACV,WAAW,GACG,EAAA;AACd,IAAA,MAAM,oBAAoB,GAAGC,+CAAuB,EAAE,CAAC;IACvD,MAAM,UAAU,GAAGC,2CAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;AAE9E,IAAA,MAAM,UAAU,GAAuCC,aAAO,CAAC,MAAK;QAClE,MAAM,oBAAoB,GAAG,CAAC,IAAa,KAAK,MAAK;AACnD,YAAA,oBAAoB,CAAC;AACnB,gBAAA,MAAM,EAAE,cAAc;AACtB,gBAAA,cAAc,EAAE,IAAI;AACpB,gBAAA,IAAI,EAAE;oBACJ,UAAU;AACX,iBAAA;AACF,aAAA,CAAC,CAAC;AACH,YAAA,WAAW,GAAG,IAAI,CAAC,CAAC;AACtB,SAAC,CAAC;QACF,OAAO;AACL,YAAA,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,KAAI;AACrC,gBAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAA,GACM,KAAK,EACT,OAAO,EAAE,oBAAoB,CAAC,KAAK,CAAC,IAAI,CAAC,EACzC,MAAM,EAAE,UAAU,EAClB,GAAG,EAAC,qBAAqB,EACzB,SAAS,EAAE,UAAU,CAAC,IAAI,EAAA,EAEzB,QAAQ,CACP,EACJ;aACH;SACF,CAAC;AACJ,KAAC,EAAE;QACD,oBAAoB;QACpB,cAAc;QACd,UAAU;QACV,UAAU;QACV,UAAU;QACV,WAAW;AACZ,KAAA,CAAC,CAAC;AAEH,IAAA,QACEA,sBAAA,CAAA,aAAA,CAACC,8BAAa,EAAA,EACZ,SAAS,EAAE,UAAU,CAAC,SAAS,EAC/B,QAAQ,EAAE,OAAO,EACjB,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,aAAa,EAAE,cAAc,CAAC,MAAM,EACpC,UAAU,EAAE,UAAU,EAAA,CACtB,EACF;AACJ;;;;"}

package/lib/commonjs/src/components/MessageBubble.d.ts

@@ -1,64 +0,0 @@
-import React from "react";
-import { Message } from "@yext/chat-headless-react";
-import { FeedbackButtonsCssClasses } from "./FeedbackButtons";
-/**
- * The CSS class interface for the {@link MessageBubble} component.
- *
- * @public
- */
-export interface MessageBubbleCssClasses {
-    topContainer?: string;
-    subContainer?: string;
-    subContainer__bot?: string;
-    subContainer__user?: string;
-    bubble?: string;
-    bubble__bot?: string;
-    bubble__user?: string;
-    text?: string;
-    text__bot?: string;
-    text__user?: string;
-    timestamp?: string;
-    timestamp__bot?: string;
-    timestamp__user?: string;
-    feedbackButtonsCssClasses?: FeedbackButtonsCssClasses;
-}
-/**
- * The props for the {@link MessageBubble} component.
- *
- * @public
- */
-export interface MessageBubbleProps {
-    /** The message to display. */
-    message: Message;
-    /**
-     * Whether to show the feedback buttons on the message bubble.
-     * Defaults to true.
-     */
-    showFeedbackButtons?: boolean;
-    /**
-     * Whether to show the timestamp of the message with the message bubble.
-     * Defaults to true.
-     */
-    showTimestamp?: boolean;
-    /**
-     * A function which is called to format the message's timestamp given in
-     * ISO format (e.g. "2023-05-18T19:33:34.553Z").
-     * Defaults to "HH:MM A" (e.g. "7:33 PM").
-     */
-    formatTimestamp?: (timestamp: string) => string;
-    /** CSS classes for customizing the component styling. */
-    customCssClasses?: MessageBubbleCssClasses;
-    /** Link target open behavior on click. */
-    linkTarget?: string;
-    /** A callback which is called when user clicks a link. */
-    onLinkClick?: (href?: string) => void;
-}
-/**
- * A component that displays the provided message.
- *
- * @public
- *
- * @param props - {@link MessageBubbleProps}
- */
-export declare function MessageBubble({ message, showFeedbackButtons, showTimestamp, customCssClasses, formatTimestamp, linkTarget, onLinkClick, }: MessageBubbleProps): React.JSX.Element;
-//# sourceMappingURL=MessageBubble.d.ts.map

package/lib/commonjs/src/components/MessageBubble.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MessageBubble.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageBubble.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,OAAO,EAAiB,MAAM,2BAA2B,CAAC;AAKnE,OAAO,EAAmB,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AAE/E;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,yBAAyB,CAAC,EAAE,yBAAyB,CAAC;CACvD;AAuBD;;;;GAIG;AACH,MAAM,WAAW,kBAAkB;IACjC,8BAA8B;IAC9B,OAAO,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;;OAIG;IACH,eAAe,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IAChD,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,uBAAuB,CAAC;IAC3C,0CAA0C;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,EAC5B,OAAO,EACP,mBAA0B,EAC1B,aAAoB,EACpB,gBAAgB,EAChB,eAAwC,EACxC,UAAU,EACV,WAAW,GACZ,EAAE,kBAAkB,qBA6DpB"}

package/lib/commonjs/src/components/MessageBubble.js

@@ -1,77 +0,0 @@
-'use strict';
-
-var React = require('react');
-var chatHeadlessReact = require('@yext/chat-headless-react');
-var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-var tailwindMerge = require('tailwind-merge');
-var Markdown = require('./Markdown.js');
-var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
-var FeedbackButtons = require('./FeedbackButtons.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-const builtInCssClasses = withStylelessCssClasses.withStylelessCssClasses("MessageBubble", {
-    topContainer: "w-full animate-fade-in @container",
-    subContainer: "flex flex-col @lg:flex-row @lg:items-center @lg:gap-x-2 @lg:m-1",
-    subContainer__bot: "",
-    subContainer__user: "@lg:flex-row-reverse",
-    bubble: "relative group peer w-fit max-w-[80%] rounded-2xl p-4",
-    bubble__bot: "bg-gradient-to-tr from-slate-50 to-slate-100",
-    bubble__user: "ml-auto @lg:ml-0 bg-gradient-to-tr from-blue-600 to-blue-700 text-white",
-    text: "text-[13px] @[480px]:text-base prose overflow-x-auto",
-    text__bot: "text-slate-900",
-    text__user: "text-white break-words",
-    timestamp: "w-fit ml-4 @lg:ml-0 text-slate-400 text-[10px] @[480px]:text-[13px] opacity-0 peer-hover:opacity-100 duration-200 whitespace-pre-wrap",
-    timestamp__bot: "",
-    timestamp__user: "ml-auto",
-    feedbackButtonsCssClasses: {},
-});
-/**
- * A component that displays the provided message.
- *
- * @public
- *
- * @param props - {@link MessageBubbleProps}
- */
-function MessageBubble({ message, showFeedbackButtons = true, showTimestamp = true, customCssClasses, formatTimestamp = defaultFormatTimestamp, linkTarget, onLinkClick, }) {
-    const cssClasses = useComposedCssClasses.useComposedCssClasses(builtInCssClasses, customCssClasses);
-    const bubbleCssClasses = tailwindMerge.twMerge(cssClasses.bubble, message.source === chatHeadlessReact.MessageSource.USER
-        ? cssClasses.bubble__user
-        : cssClasses.bubble__bot);
-    const textCssClasses = tailwindMerge.twMerge(cssClasses.text, message.source === chatHeadlessReact.MessageSource.USER
-        ? cssClasses.text__user
-        : cssClasses.text__bot);
-    const subContainerCssClasses = tailwindMerge.twMerge(cssClasses.subContainer, message.source === chatHeadlessReact.MessageSource.USER
-        ? cssClasses.subContainer__user
-        : cssClasses.subContainer__bot);
-    const timestampCssClasses = tailwindMerge.twMerge(cssClasses.timestamp, message.source === chatHeadlessReact.MessageSource.USER
-        ? cssClasses.timestamp__user
-        : cssClasses.timestamp__bot);
-    const markdownCssClasses = React.useMemo(() => ({
-        container: textCssClasses,
-    }), [textCssClasses]);
-    return (React__default.default.createElement("div", { className: cssClasses.topContainer },
-        React__default.default.createElement("div", { className: subContainerCssClasses },
-            React__default.default.createElement("div", { className: bubbleCssClasses },
-                showFeedbackButtons && message.source === chatHeadlessReact.MessageSource.BOT && (React__default.default.createElement(FeedbackButtons.FeedbackButtons, { customCssClasses: cssClasses.feedbackButtonsCssClasses, responseId: message.responseId })),
-                React__default.default.createElement(Markdown.Markdown, { content: message.text, responseId: message.responseId, customCssClasses: markdownCssClasses, linkTarget: linkTarget, onLinkClick: onLinkClick })),
-            showTimestamp && (React__default.default.createElement("div", { className: timestampCssClasses }, message.timestamp ? formatTimestamp(message.timestamp) : " ")))));
-}
-/**
- * Formats message's timestamp from "2023-05-18T19:33:34.553Z" to "7:33 PM"
- *
- * @param timestamp - the timestamp to convert from
- * @returns formatted timestamp
- */
-function defaultFormatTimestamp(timestamp) {
-    return new Date(timestamp).toLocaleString(undefined, {
-        hour: "numeric",
-        minute: "numeric",
-        hour12: true,
-    });
-}
-
-exports.MessageBubble = MessageBubble;
-//# sourceMappingURL=MessageBubble.js.map

package/lib/commonjs/src/components/MessageBubble.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MessageBubble.js","sources":["../../../../src/components/MessageBubble.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { Message, MessageSource } from \"@yext/chat-headless-react\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { twMerge } from \"tailwind-merge\";\nimport { Markdown, MarkdownCssClasses } from \"./Markdown\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { FeedbackButtons, FeedbackButtonsCssClasses } from \"./FeedbackButtons\";\n\n/**\n * The CSS class interface for the {@link MessageBubble} component.\n *\n * @public\n */\nexport interface MessageBubbleCssClasses {\n  topContainer?: string;\n  subContainer?: string;\n  subContainer__bot?: string;\n  subContainer__user?: string;\n  bubble?: string;\n  bubble__bot?: string;\n  bubble__user?: string;\n  text?: string;\n  text__bot?: string;\n  text__user?: string;\n  timestamp?: string;\n  timestamp__bot?: string;\n  timestamp__user?: string;\n  feedbackButtonsCssClasses?: FeedbackButtonsCssClasses;\n}\n\nconst builtInCssClasses: MessageBubbleCssClasses =\n  withStylelessCssClasses<MessageBubbleCssClasses>(\"MessageBubble\", {\n    topContainer: \"w-full animate-fade-in @container\",\n    subContainer:\n      \"flex flex-col @lg:flex-row @lg:items-center @lg:gap-x-2 @lg:m-1\",\n    subContainer__bot: \"\",\n    subContainer__user: \"@lg:flex-row-reverse\",\n    bubble: \"relative group peer w-fit max-w-[80%] rounded-2xl p-4\",\n    bubble__bot: \"bg-gradient-to-tr from-slate-50 to-slate-100\",\n    bubble__user:\n      \"ml-auto @lg:ml-0 bg-gradient-to-tr from-blue-600 to-blue-700 text-white\",\n    text: \"text-[13px] @[480px]:text-base prose overflow-x-auto\",\n    text__bot: \"text-slate-900\",\n    text__user: \"text-white break-words\",\n    timestamp:\n      \"w-fit ml-4 @lg:ml-0 text-slate-400 text-[10px] @[480px]:text-[13px] opacity-0 peer-hover:opacity-100 duration-200 whitespace-pre-wrap\",\n    timestamp__bot: \"\",\n    timestamp__user: \"ml-auto\",\n    feedbackButtonsCssClasses: {},\n  });\n\n/**\n * The props for the {@link MessageBubble} component.\n *\n * @public\n */\nexport interface MessageBubbleProps {\n  /** The message to display. */\n  message: Message;\n  /**\n   * Whether to show the feedback buttons on the message bubble.\n   * Defaults to true.\n   */\n  showFeedbackButtons?: boolean;\n  /**\n   * Whether to show the timestamp of the message with the message bubble.\n   * Defaults to true.\n   */\n  showTimestamp?: boolean;\n  /**\n   * A function which is called to format the message's timestamp given in\n   * ISO format (e.g. \"2023-05-18T19:33:34.553Z\").\n   * Defaults to \"HH:MM A\" (e.g. \"7:33 PM\").\n   */\n  formatTimestamp?: (timestamp: string) => string;\n  /** CSS classes for customizing the component styling. */\n  customCssClasses?: MessageBubbleCssClasses;\n  /** Link target open behavior on click. */\n  linkTarget?: string;\n  /** A callback which is called when user clicks a link. */\n  onLinkClick?: (href?: string) => void;\n}\n\n/**\n * A component that displays the provided message.\n *\n * @public\n *\n * @param props - {@link MessageBubbleProps}\n */\nexport function MessageBubble({\n  message,\n  showFeedbackButtons = true,\n  showTimestamp = true,\n  customCssClasses,\n  formatTimestamp = defaultFormatTimestamp,\n  linkTarget,\n  onLinkClick,\n}: MessageBubbleProps) {\n  const cssClasses = useComposedCssClasses(builtInCssClasses, customCssClasses);\n  const bubbleCssClasses = twMerge(\n    cssClasses.bubble,\n    message.source === MessageSource.USER\n      ? cssClasses.bubble__user\n      : cssClasses.bubble__bot\n  );\n  const textCssClasses = twMerge(\n    cssClasses.text,\n    message.source === MessageSource.USER\n      ? cssClasses.text__user\n      : cssClasses.text__bot\n  );\n  const subContainerCssClasses = twMerge(\n    cssClasses.subContainer,\n    message.source === MessageSource.USER\n      ? cssClasses.subContainer__user\n      : cssClasses.subContainer__bot\n  );\n  const timestampCssClasses = twMerge(\n    cssClasses.timestamp,\n    message.source === MessageSource.USER\n      ? cssClasses.timestamp__user\n      : cssClasses.timestamp__bot\n  );\n\n  const markdownCssClasses: MarkdownCssClasses = useMemo(\n    () => ({\n      container: textCssClasses,\n    }),\n    [textCssClasses]\n  );\n\n  return (\n    <div className={cssClasses.topContainer}>\n      <div className={subContainerCssClasses}>\n        <div className={bubbleCssClasses}>\n          {showFeedbackButtons && message.source === MessageSource.BOT && (\n            <FeedbackButtons\n              customCssClasses={cssClasses.feedbackButtonsCssClasses}\n              responseId={message.responseId}\n            />\n          )}\n          <Markdown\n            content={message.text}\n            responseId={message.responseId}\n            customCssClasses={markdownCssClasses}\n            linkTarget={linkTarget}\n            onLinkClick={onLinkClick}\n          />\n        </div>\n        {/* fallback on empty space here to perserve the height for timestamp div */}\n        {showTimestamp && (\n          <div className={timestampCssClasses}>\n            {message.timestamp ? formatTimestamp(message.timestamp) : \" \"}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/**\n * Formats message's timestamp from \"2023-05-18T19:33:34.553Z\" to \"7:33 PM\"\n *\n * @param timestamp - the timestamp to convert from\n * @returns formatted timestamp\n */\nfunction defaultFormatTimestamp(timestamp: string): string {\n  return new Date(timestamp).toLocaleString(undefined, {\n    hour: \"numeric\",\n    minute: \"numeric\",\n    hour12: true,\n  });\n}\n"],"names":["withStylelessCssClasses","useComposedCssClasses","twMerge","MessageSource","useMemo","React","FeedbackButtons","Markdown"],"mappings":"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"}

package/lib/commonjs/src/components/MessageSuggestions.d.ts

@@ -1,37 +0,0 @@
-import React from "react";
-/**
- * The CSS class interface for the MessageSuggestion component.
- *
- * @public
- */
-export interface MessageSuggestionCssClasses {
-    container?: string;
-    suggestion?: string;
-}
-/**
- * The props for the MessageSuggestions component.
- *
- * @public
- */
-export interface MessageSuggestionsProps {
-    /** List of clickable message suggestions to render. */
-    suggestions: string[];
-    /** {@inheritdoc ChatInputProps.handleError} */
-    handleError?: (e: unknown) => void;
-    /** CSS classes for customizing the component styling. */
-    customCssClasses?: MessageSuggestionCssClasses;
-    /** {@inheritdoc ChatInputProps.stream} */
-    stream?: boolean;
-    /** {@inheritdoc ChatInputProps.onSend} */
-    onSend?: (message: string) => void;
-    /** {@inheritdoc ChatInputProps.onRetry} */
-    onRetry?: (e: unknown) => void;
-}
-/**
- * A component that displays a list of suggested messages
- * to the user, which they can click to send the message to the bot.
- *
- * @internal
- */
-export declare const MessageSuggestions: React.FC<MessageSuggestionsProps>;
-//# sourceMappingURL=MessageSuggestions.d.ts.map

package/lib/commonjs/src/components/MessageSuggestions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MessageSuggestions.d.ts","sourceRoot":"","sources":["../../../../src/components/MessageSuggestions.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAW3C;;;;GAIG;AACH,MAAM,WAAW,2BAA2B;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;;;GAIG;AACH,MAAM,WAAW,uBAAuB;IACtC,uDAAuD;IACvD,WAAW,EAAE,MAAM,EAAE,CAAC;IACtB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACnC,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,2BAA2B,CAAC;IAC/C,0CAA0C;IAC1C,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,0CAA0C;IAC1C,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,2CAA2C;IAC3C,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;CAChC;AAWD;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAmDhE,CAAC"}

package/lib/commonjs/src/components/MessageSuggestions.js

@@ -1,55 +0,0 @@
-'use strict';
-
-var React = require('react');
-var chatHeadlessReact = require('@yext/chat-headless-react');
-var useDefaultHandleApiError = require('../hooks/useDefaultHandleApiError.js');
-var withStylelessCssClasses = require('../utils/withStylelessCssClasses.js');
-var useComposedCssClasses = require('../hooks/useComposedCssClasses.js');
-var useSendMessageWithRetries = require('../hooks/useSendMessageWithRetries.js');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-
-const defaultClassnames = withStylelessCssClasses.withStylelessCssClasses("Suggestions", {
-    container: "flex gap-2 mb-4 w-full overflow-x-auto flex-wrap",
-    suggestion: "hover:cursor-pointer px-2 py-1 bg-white hover:bg-slate-300 rounded-full text-sm text-blue-700 border border-blue-700 hover:underline",
-});
-/**
- * A component that displays a list of suggested messages
- * to the user, which they can click to send the message to the bot.
- *
- * @internal
- */
-const MessageSuggestions = ({ handleError, suggestions, customCssClasses, stream = false, onSend, onRetry, }) => {
-    const actions = chatHeadlessReact.useChatActions();
-    const notes = chatHeadlessReact.useChatState((state) => state.conversation.notes);
-    const defaultHandleApiError = useDefaultHandleApiError.useDefaultHandleApiError();
-    const sendMessageWithRetries = useSendMessageWithRetries.useSendMessageWithRetries(stream, 1, onRetry);
-    const sendMsg = React.useCallback((msg) => {
-        const newNotes = {
-            ...(notes || {}),
-            suggestedReplies: undefined,
-        };
-        actions.setMessageNotes(newNotes);
-        sendMessageWithRetries(msg)
-            .catch(handleError ?? defaultHandleApiError)
-            .finally(() => {
-            onSend?.(msg);
-        });
-    }, [
-        notes,
-        actions,
-        sendMessageWithRetries,
-        handleError,
-        defaultHandleApiError,
-        onSend,
-    ]);
-    const classes = useComposedCssClasses.useComposedCssClasses(defaultClassnames, customCssClasses);
-    return (React__default.default.createElement("div", { className: classes.container }, suggestions.map((suggestion, index) => (React__default.default.createElement("button", { key: index, className: classes.suggestion, 
-        // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop
-        onClick: () => sendMsg(suggestion) }, suggestion)))));
-};
-
-exports.MessageSuggestions = MessageSuggestions;
-//# sourceMappingURL=MessageSuggestions.js.map

package/lib/commonjs/src/components/MessageSuggestions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MessageSuggestions.js","sources":["../../../../src/components/MessageSuggestions.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport {\n  MessageNotes,\n  useChatActions,\n  useChatState,\n} from \"@yext/chat-headless-react\";\nimport { useDefaultHandleApiError } from \"../hooks/useDefaultHandleApiError\";\nimport { withStylelessCssClasses } from \"../utils/withStylelessCssClasses\";\nimport { useComposedCssClasses } from \"../hooks\";\nimport { useSendMessageWithRetries } from \"../hooks/useSendMessageWithRetries\";\n\n/**\n * The CSS class interface for the MessageSuggestion component.\n *\n * @public\n */\nexport interface MessageSuggestionCssClasses {\n  container?: string;\n  suggestion?: string;\n}\n\n/**\n * The props for the MessageSuggestions component.\n *\n * @public\n */\nexport interface MessageSuggestionsProps {\n  /** List of clickable message suggestions to render. */\n  suggestions: string[];\n  /** {@inheritdoc ChatInputProps.handleError} */\n  handleError?: (e: unknown) => void;\n  /** CSS classes for customizing the component styling. */\n  customCssClasses?: MessageSuggestionCssClasses;\n  /** {@inheritdoc ChatInputProps.stream} */\n  stream?: boolean;\n  /** {@inheritdoc ChatInputProps.onSend} */\n  onSend?: (message: string) => void;\n  /** {@inheritdoc ChatInputProps.onRetry} */\n  onRetry?: (e: unknown) => void;\n}\n\nconst defaultClassnames: MessageSuggestionCssClasses = withStylelessCssClasses(\n  \"Suggestions\",\n  {\n    container: \"flex gap-2 mb-4 w-full overflow-x-auto flex-wrap\",\n    suggestion:\n      \"hover:cursor-pointer px-2 py-1 bg-white hover:bg-slate-300 rounded-full text-sm text-blue-700 border border-blue-700 hover:underline\",\n  }\n);\n\n/**\n * A component that displays a list of suggested messages\n * to the user, which they can click to send the message to the bot.\n *\n * @internal\n */\nexport const MessageSuggestions: React.FC<MessageSuggestionsProps> = ({\n  handleError,\n  suggestions,\n  customCssClasses,\n  stream = false,\n  onSend,\n  onRetry,\n}) => {\n  const actions = useChatActions();\n  const notes = useChatState((state) => state.conversation.notes);\n  const defaultHandleApiError = useDefaultHandleApiError();\n  const sendMessageWithRetries = useSendMessageWithRetries(stream, 1, onRetry);\n  const sendMsg = useCallback(\n    (msg: string) => {\n      const newNotes = {\n        ...(notes || {}),\n        suggestedReplies: undefined,\n      } satisfies MessageNotes;\n      actions.setMessageNotes(newNotes);\n      sendMessageWithRetries(msg)\n        .catch(handleError ?? defaultHandleApiError)\n        .finally(() => {\n          onSend?.(msg);\n        });\n    },\n    [\n      notes,\n      actions,\n      sendMessageWithRetries,\n      handleError,\n      defaultHandleApiError,\n      onSend,\n    ]\n  );\n\n  const classes = useComposedCssClasses(defaultClassnames, customCssClasses);\n\n  return (\n    <div className={classes.container}>\n      {suggestions.map((suggestion, index) => (\n        <button\n          key={index}\n          className={classes.suggestion}\n          // eslint-disable-next-line react-perf/jsx-no-new-function-as-prop\n          onClick={() => sendMsg(suggestion)}\n        >\n          {suggestion}\n        </button>\n      ))}\n    </div>\n  );\n};\n"],"names":["withStylelessCssClasses","useChatActions","useChatState","useDefaultHandleApiError","useSendMessageWithRetries","useCallback","useComposedCssClasses","React"],"mappings":";;;;;;;;;;;;;AAyCA,MAAM,iBAAiB,GAAgCA,+CAAuB,CAC5E,aAAa,EACb;AACE,IAAA,SAAS,EAAE,kDAAkD;AAC7D,IAAA,UAAU,EACR,sIAAsI;AACzI,CAAA,CACF,CAAC;AAEF;;;;;AAKG;MACU,kBAAkB,GAAsC,CAAC,EACpE,WAAW,EACX,WAAW,EACX,gBAAgB,EAChB,MAAM,GAAG,KAAK,EACd,MAAM,EACN,OAAO,GACR,KAAI;AACH,IAAA,MAAM,OAAO,GAAGC,gCAAc,EAAE,CAAC;AACjC,IAAA,MAAM,KAAK,GAAGC,8BAAY,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;AAChE,IAAA,MAAM,qBAAqB,GAAGC,iDAAwB,EAAE,CAAC;IACzD,MAAM,sBAAsB,GAAGC,mDAAyB,CAAC,MAAM,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC;AAC7E,IAAA,MAAM,OAAO,GAAGC,iBAAW,CACzB,CAAC,GAAW,KAAI;AACd,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,KAAK,IAAI,EAAE,CAAC;AAChB,YAAA,gBAAgB,EAAE,SAAS;SACL,CAAC;AACzB,QAAA,OAAO,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC;QAClC,sBAAsB,CAAC,GAAG,CAAC;AACxB,aAAA,KAAK,CAAC,WAAW,IAAI,qBAAqB,CAAC;aAC3C,OAAO,CAAC,MAAK;AACZ,YAAA,MAAM,GAAG,GAAG,CAAC,CAAC;AAChB,SAAC,CAAC,CAAC;AACP,KAAC,EACD;QACE,KAAK;QACL,OAAO;QACP,sBAAsB;QACtB,WAAW;QACX,qBAAqB;QACrB,MAAM;AACP,KAAA,CACF,CAAC;IAEF,MAAM,OAAO,GAAGC,2CAAqB,CAAC,iBAAiB,EAAE,gBAAgB,CAAC,CAAC;AAE3E,IAAA,QACEC,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,SAAS,EAAA,EAC9B,WAAW,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,KAAK,MACjCA,sBACE,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,GAAG,EAAE,KAAK,EACV,SAAS,EAAE,OAAO,CAAC,UAAU;;AAE7B,QAAA,OAAO,EAAE,MAAM,OAAO,CAAC,UAAU,CAAC,EAAA,EAEjC,UAAU,CACJ,CACV,CAAC,CACE,EACN;AACJ;;;;"}

package/lib/commonjs/src/components/index.d.ts

@@ -1,14 +0,0 @@
-export { ChatInput } from "./ChatInput";
-export type { ChatInputCssClasses, ChatInputProps } from "./ChatInput";
-export { ChatHeader } from "./ChatHeader";
-export type { ChatHeaderCssClasses, ChatHeaderProps } from "./ChatHeader";
-export { MessageBubble } from "./MessageBubble";
-export type { MessageBubbleCssClasses, MessageBubbleProps, } from "./MessageBubble";
-export { ChatPanel } from "./ChatPanel";
-export type { ChatPanelCssClasses, ChatPanelProps } from "./ChatPanel";
-export { ChatPopUp } from "./ChatPopUp";
-export type { ChatPopUpCssClasses, ChatPopUpProps } from "./ChatPopUp";
-export type { FeedbackButtonsCssClasses } from "./FeedbackButtons";
-export type { InitialMessagePopUpCssClasses } from "./InitialMessagePopUp";
-export type { MessageSuggestionCssClasses, MessageSuggestionsProps, } from "./MessageSuggestions";
-//# sourceMappingURL=index.d.ts.map

package/lib/commonjs/src/components/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEvE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,oBAAoB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAE1E,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EACV,uBAAuB,EACvB,kBAAkB,GACnB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEvE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,YAAY,EAAE,mBAAmB,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAEvE,YAAY,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAC;AACnE,YAAY,EAAE,6BAA6B,EAAE,MAAM,uBAAuB,CAAC;AAE3E,YAAY,EACV,2BAA2B,EAC3B,uBAAuB,GACxB,MAAM,sBAAsB,CAAC"}

package/lib/commonjs/src/hooks/index.d.ts

@@ -1,3 +0,0 @@
-export { useComposedCssClasses } from "./useComposedCssClasses";
-export { useReportAnalyticsEvent } from "./useReportAnalyticsEvent";
-//# sourceMappingURL=index.d.ts.map

package/lib/commonjs/src/hooks/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC"}

package/lib/commonjs/src/hooks/useComposedCssClasses.d.ts

@@ -1,30 +0,0 @@
-/**
- * useComposedCssClasses merges a component's built-in tailwind classes with custom tailwind classes.
- *
- * @remarks
- * Tailwind classes will be merged without conflict, with custom classes having higher priority
- * than built-in ones.
- *
- * @example
- * Suppose a component has built-in classes of `{ container: 'px-4 text-slate-700' }`.
- *
- * Passing in the custom classes:
- *
- * ```ts
- * { container: 'text-red-200 mb-3' }
- * ```
- *
- * results in the merged classes of:
- *
- * ```ts
- * { container: 'px-4 text-red-200 mb-3' }
- * ```
- *
- * @public
- *
- * @param builtInClasses - The component's built-in tailwind classes
- * @param customClasses - The custom tailwind classes to merge with the built-in ones
- * @returns The composed CSS classes
- */
-export declare function useComposedCssClasses<ClassInterface extends Partial<Record<keyof ClassInterface, string | object>>>(builtInClasses: Readonly<ClassInterface>, customClasses?: Partial<ClassInterface>): ClassInterface;
-//# sourceMappingURL=useComposedCssClasses.d.ts.map

package/lib/commonjs/src/hooks/useComposedCssClasses.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useComposedCssClasses.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useComposedCssClasses.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,qBAAqB,CACnC,cAAc,SAAS,OAAO,CAAC,MAAM,CAAC,MAAM,cAAc,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC,EAE7E,cAAc,EAAE,QAAQ,CAAC,cAAc,CAAC,EACxC,aAAa,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,GACtC,cAAc,CAyBhB"}