@botonic/react 0.56.0-alpha.0 → 0.57.0-rslib-esm.1

package/lib/webchat/custom-messages/rating/icons/face-smile.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+
+
+/** biome-ignore-all lint/a11y/noSvgWithoutTitle: This is a SVG icon */ 
+const FaceSmileSvg = ({ color, selected })=>{
+    return selected ? /*#__PURE__*/ jsx("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 512 512",
+        color: color,
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM164.1 325.5C182 346.2 212.6 368 256 368s74-21.8 91.9-42.5c5.8-6.7 15.9-7.4 22.6-1.6s7.4 15.9 1.6 22.6C349.8 372.1 311.1 400 256 400s-93.8-27.9-116.1-53.5c-5.8-6.7-5.1-16.8 1.6-22.6s16.8-5.1 22.6 1.6zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z",
+            fill: "currentColor"
+        })
+    }) : /*#__PURE__*/ jsx("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 512 512",
+        color: color,
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm177.6 62.1C192.8 334.5 218.8 352 256 352s63.2-17.5 78.4-33.9c9-9.7 24.2-10.4 33.9-1.4s10.4 24.2 1.4 33.9c-22 23.8-60 49.4-113.6 49.4s-91.7-25.5-113.6-49.4c-9-9.7-8.4-24.9 1.4-33.9s24.9-8.4 33.9 1.4zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z",
+            fill: "currentColor"
+        })
+    });
+};
+
+export { FaceSmileSvg };
+
+//# sourceMappingURL=face-smile.js.map

package/lib/webchat/custom-messages/rating/icons/face-smile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/icons/face-smile.js","sources":["../../../../../src/webchat/custom-messages/rating/icons/face-smile.tsx"],"sourcesContent":["/** biome-ignore-all lint/a11y/noSvgWithoutTitle: This is a SVG icon */\nimport type { RatingIconProps } from '../types'\n\nexport const FaceSmileSvg = ({ color, selected }: RatingIconProps) => {\n  return selected ? (\n    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' color={color}>\n      <path\n        d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM164.1 325.5C182 346.2 212.6 368 256 368s74-21.8 91.9-42.5c5.8-6.7 15.9-7.4 22.6-1.6s7.4 15.9 1.6 22.6C349.8 372.1 311.1 400 256 400s-93.8-27.9-116.1-53.5c-5.8-6.7-5.1-16.8 1.6-22.6s16.8-5.1 22.6 1.6zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'\n        fill='currentColor'\n      />\n    </svg>\n  ) : (\n    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' color={color}>\n      <path\n        d='M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm177.6 62.1C192.8 334.5 218.8 352 256 352s63.2-17.5 78.4-33.9c9-9.7 24.2-10.4 33.9-1.4s10.4 24.2 1.4 33.9c-22 23.8-60 49.4-113.6 49.4s-91.7-25.5-113.6-49.4c-9-9.7-8.4-24.9 1.4-33.9s24.9-8.4 33.9 1.4zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'\n        fill='currentColor'\n      />\n    </svg>\n  )\n}\n"],"names":["FaceSmileSvg","color","selected"],"mappings":";;;AAAA,qEAAqE;AAG9D,MAAMA,YAAYA,GAAG,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAmB;IAC/D,OAAOA,yBACL,IAAC;QAAI,OAAM;QAA6B,SAAQ;QAAc,OAAOD;kBACnE,kBAAC;YACC,GAAE;YACF,MAAK;;uBAIT,IAAC;QAAI,OAAM;QAA6B,SAAQ;QAAc,OAAOA;kBACnE,kBAAC;YACC,GAAE;YACF,MAAK;;;AAIb,EAAC"}

package/lib/webchat/custom-messages/rating/icons/index.d.ts

@@ -0,0 +1,6 @@
+export * from './face-angry.js';
+export * from './face-frown.js';
+export * from './face-grin-beam.js';
+export * from './face-meh.js';
+export * from './face-smile.js';
+export * from './star.js';

package/lib/webchat/custom-messages/rating/icons/index.js

@@ -0,0 +1,15 @@
+export * from "./face-angry.js";
+export * from "./face-frown.js";
+export * from "./face-grin-beam.js";
+export * from "./face-meh.js";
+export * from "./face-smile.js";
+export * from "./star.js";
+
+
+
+
+
+
+
+
+//# sourceMappingURL=index.js.map

package/lib/webchat/custom-messages/rating/icons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/icons/index.js","sources":["../../../../../src/webchat/custom-messages/rating/icons/index.ts"],"sourcesContent":["export * from './face-angry'\nexport * from './face-frown'\nexport * from './face-grin-beam'\nexport * from './face-meh'\nexport * from './face-smile'\nexport * from './star'\n"],"names":[],"mappings":";;;;;;AAA4B;AACA;AACI;AACN;AACE;AACN"}

package/lib/webchat/custom-messages/rating/icons/star.d.ts

@@ -0,0 +1,3 @@
+/** biome-ignore-all lint/a11y/noSvgWithoutTitle: This is a SVG icon */
+import type { RatingIconProps } from '../types.js';
+export declare const StarSvg: ({ color, selected }: RatingIconProps) => import("react").JSX.Element;

package/lib/webchat/custom-messages/rating/icons/star.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+
+
+/** biome-ignore-all lint/a11y/noSvgWithoutTitle: This is a SVG icon */ 
+const StarSvg = ({ color, selected })=>{
+    return selected ? /*#__PURE__*/ jsx("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 576 512",
+        color: color,
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z",
+            fill: "currentColor"
+        })
+    }) : /*#__PURE__*/ jsx("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        viewBox: "0 0 576 512",
+        color: color,
+        children: /*#__PURE__*/ jsx("path", {
+            d: "M287.9 0c9.2 0 17.6 5.2 21.6 13.5l68.6 141.3 153.2 22.6c9 1.3 16.5 7.6 19.3 16.3s.5 18.1-5.9 24.5L433.6 328.4l26.2 155.6c1.5 9-2.2 18.1-9.7 23.5s-17.3 6-25.3 1.7l-137-73.2L151 509.1c-8.1 4.3-17.9 3.7-25.3-1.7s-11.2-14.5-9.7-23.5l26.2-155.6L31.1 218.2c-6.5-6.4-8.7-15.9-5.9-24.5s10.3-14.9 19.3-16.3l153.2-22.6L266.3 13.5C270.4 5.2 278.7 0 287.9 0zm0 79L235.4 187.2c-3.5 7.1-10.2 12.1-18.1 13.3L99 217.9 184.9 303c5.5 5.5 8.1 13.3 6.8 21L171.4 443.7l105.2-56.2c7.1-3.8 15.6-3.8 22.6 0l105.2 56.2L384.2 324.1c-1.3-7.7 1.2-15.5 6.8-21l85.9-85.1L358.6 200.5c-7.8-1.2-14.6-6.1-18.1-13.3L287.9 79z",
+            fill: "currentColor"
+        })
+    });
+};
+
+export { StarSvg };
+
+//# sourceMappingURL=star.js.map

package/lib/webchat/custom-messages/rating/icons/star.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/icons/star.js","sources":["../../../../../src/webchat/custom-messages/rating/icons/star.tsx"],"sourcesContent":["/** biome-ignore-all lint/a11y/noSvgWithoutTitle: This is a SVG icon */\nimport type { RatingIconProps } from '../types'\n\nexport const StarSvg = ({ color, selected }: RatingIconProps) => {\n  return selected ? (\n    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512' color={color}>\n      <path\n        d='M316.9 18C311.6 7 300.4 0 288.1 0s-23.4 7-28.8 18L195 150.3 51.4 171.5c-12 1.8-22 10.2-25.7 21.7s-.7 24.2 7.9 32.7L137.8 329 113.2 474.7c-2 12 3 24.2 12.9 31.3s23 8 33.8 2.3l128.3-68.5 128.3 68.5c10.8 5.7 23.9 4.9 33.8-2.3s14.9-19.3 12.9-31.3L438.5 329 542.7 225.9c8.6-8.5 11.7-21.2 7.9-32.7s-13.7-19.9-25.7-21.7L381.2 150.3 316.9 18z'\n        fill='currentColor'\n      />\n    </svg>\n  ) : (\n    <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 576 512' color={color}>\n      <path\n        d='M287.9 0c9.2 0 17.6 5.2 21.6 13.5l68.6 141.3 153.2 22.6c9 1.3 16.5 7.6 19.3 16.3s.5 18.1-5.9 24.5L433.6 328.4l26.2 155.6c1.5 9-2.2 18.1-9.7 23.5s-17.3 6-25.3 1.7l-137-73.2L151 509.1c-8.1 4.3-17.9 3.7-25.3-1.7s-11.2-14.5-9.7-23.5l26.2-155.6L31.1 218.2c-6.5-6.4-8.7-15.9-5.9-24.5s10.3-14.9 19.3-16.3l153.2-22.6L266.3 13.5C270.4 5.2 278.7 0 287.9 0zm0 79L235.4 187.2c-3.5 7.1-10.2 12.1-18.1 13.3L99 217.9 184.9 303c5.5 5.5 8.1 13.3 6.8 21L171.4 443.7l105.2-56.2c7.1-3.8 15.6-3.8 22.6 0l105.2 56.2L384.2 324.1c-1.3-7.7 1.2-15.5 6.8-21l85.9-85.1L358.6 200.5c-7.8-1.2-14.6-6.1-18.1-13.3L287.9 79z'\n        fill='currentColor'\n      />\n    </svg>\n  )\n}\n"],"names":["StarSvg","color","selected"],"mappings":";;;AAAA,qEAAqE;AAG9D,MAAMA,OAAOA,GAAG,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAmB;IAC1D,OAAOA,yBACL,IAAC;QAAI,OAAM;QAA6B,SAAQ;QAAc,OAAOD;kBACnE,kBAAC;YACC,GAAE;YACF,MAAK;;uBAIT,IAAC;QAAI,OAAM;QAA6B,SAAQ;QAAc,OAAOA;kBACnE,kBAAC;YACC,GAAE;YACF,MAAK;;;AAIb,EAAC"}

package/lib/webchat/custom-messages/rating/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("../../../index.js").CustomMessageType;
+export default _default;

package/lib/webchat/custom-messages/rating/index.js

@@ -0,0 +1,105 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { INPUT } from "@botonic/core";
+import { useContext, useState } from "react";
+import { ThemeContext } from "styled-components";
+import { Button, customMessage } from "../../../components/index.js";
+import { WebchatContext } from "../../context/index.js";
+import { RatingSelector } from "./rating-selector.js";
+import { MessageBubble } from "./styles.js";
+import { RatingType } from "./types.js";
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const ratingValues = {
+    [RatingType.Stars]: [
+        '⭐'.repeat(1),
+        '⭐'.repeat(2),
+        '⭐'.repeat(3),
+        '⭐'.repeat(4),
+        '⭐'.repeat(5)
+    ],
+    [RatingType.Smileys]: [
+        '😠',
+        '🙁',
+        '😐',
+        '🙂',
+        '😄'
+    ]
+};
+const CustomRatingMessage = (props)=>{
+    const { payloads, messageText, buttonText, ratingType, id, valueSent } = props;
+    const { updateCustomMessageProps, sendInput } = useContext(WebchatContext);
+    const theme = useContext(ThemeContext);
+    const color = theme?.brand?.color ?? '';
+    const [ratingValue, setRatingValue] = useState(valueSent ? valueSent : -1);
+    const [showRating, setShowRating] = useState(true);
+    const ratingChanged = (newRating)=>{
+        setRatingValue(newRating);
+    };
+    const handleButtonSend = ()=>{
+        if (ratingValue === -1) {
+            return;
+        }
+        const json = {
+            valueSent: ratingValue
+        };
+        updateCustomMessageProps(json, id);
+        setShowRating(false);
+        const payload = payloads[ratingValue - 1];
+        const input = {
+            type: INPUT.POSTBACK,
+            payload,
+            referral: ratingValues[ratingType][ratingValue - 1]
+        };
+        void sendInput(input);
+    };
+    const disabled = ratingValue === -1;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "rating-message-container",
+        children: [
+            /*#__PURE__*/ jsxs(MessageBubble, {
+                className: "rating-message-bubble",
+                children: [
+                    messageText,
+                    /*#__PURE__*/ jsx(RatingSelector, {
+                        color: color,
+                        onRatingChange: ratingChanged,
+                        ratingValue: ratingValue,
+                        ratingType: ratingType,
+                        valueSent: valueSent
+                    })
+                ]
+            }),
+            !props?.valueSent && showRating && /*#__PURE__*/ jsx(Button, {
+                autodisable: true,
+                disabled: disabled,
+                onClick: handleButtonSend,
+                children: buttonText
+            })
+        ]
+    });
+};
+/* export default */ const rating = (customMessage({
+    name: 'custom-rating',
+    component: CustomRatingMessage
+}));
+
+export default rating;
+
+//# sourceMappingURL=index.js.map

package/lib/webchat/custom-messages/rating/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/index.js","sources":["../../../../src/webchat/custom-messages/rating/index.tsx"],"sourcesContent":["import { INPUT, type InputType } from '@botonic/core'\nimport type React from 'react'\nimport { useContext, useState } from 'react'\nimport { ThemeContext } from 'styled-components'\n\nimport { Button, customMessage } from '../../../components'\nimport { WebchatContext } from '../../context'\nimport { RatingSelector } from './rating-selector'\nimport { MessageBubble } from './styles'\nimport { RatingType } from './types'\n\ninterface CustomRatingMessageProps {\n  payloads: string[]\n  messageText: string\n  buttonText: string\n  ratingType: RatingType\n  id?: string // This id not exist in local development\n  valueSent?: number\n}\n\nconst ratingValues = {\n  [RatingType.Stars]: [\n    '⭐'.repeat(1),\n    '⭐'.repeat(2),\n    '⭐'.repeat(3),\n    '⭐'.repeat(4),\n    '⭐'.repeat(5),\n  ],\n  [RatingType.Smileys]: ['😠', '🙁', '😐', '🙂', '😄'],\n} as const\n\nconst CustomRatingMessage: React.FC<CustomRatingMessageProps> = props => {\n  const { payloads, messageText, buttonText, ratingType, id, valueSent } = props\n  const { updateCustomMessageProps, sendInput } = useContext(WebchatContext)\n\n  const theme = useContext(ThemeContext)\n  const color = theme?.brand?.color ?? ''\n\n  const [ratingValue, setRatingValue] = useState(valueSent ? valueSent : -1)\n  const [showRating, setShowRating] = useState(true)\n\n  const ratingChanged = (newRating: number) => {\n    setRatingValue(newRating)\n  }\n\n  const handleButtonSend = () => {\n    if (ratingValue === -1) {\n      return\n    }\n\n    const json = {\n      valueSent: ratingValue,\n    }\n    updateCustomMessageProps(json, id)\n\n    setShowRating(false)\n    const payload = payloads[ratingValue - 1]\n\n    const input = {\n      type: INPUT.POSTBACK as InputType,\n      payload,\n      referral: ratingValues[ratingType][ratingValue - 1],\n    }\n    void sendInput(input)\n  }\n\n  const disabled = ratingValue === -1\n\n  return (\n    <div className='rating-message-container'>\n      <MessageBubble className='rating-message-bubble'>\n        {messageText}\n        <RatingSelector\n          color={color}\n          onRatingChange={ratingChanged}\n          ratingValue={ratingValue}\n          ratingType={ratingType}\n          valueSent={valueSent}\n        />\n      </MessageBubble>\n      {!props?.valueSent && showRating && (\n        <Button\n          autodisable={true}\n          disabled={disabled}\n          onClick={handleButtonSend}\n        >\n          {buttonText}\n        </Button>\n      )}\n    </div>\n  )\n}\n\nexport default customMessage({\n  name: 'custom-rating',\n  component: CustomRatingMessage,\n})\n"],"names":["INPUT","useContext","useState","ThemeContext","Button","customMessage","WebchatContext","RatingSelector","MessageBubble","RatingType","ratingValues","CustomRatingMessage","props","payloads","messageText","buttonText","ratingType","id","valueSent","updateCustomMessageProps","sendInput","theme","color","ratingValue","setRatingValue","showRating","setShowRating","ratingChanged","newRating","handleButtonSend","json","payload","input","disabled"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAqD;AAET;AACI;AAEW;AACb;AACI;AACV;AACJ;AAWpC,MAAMU,YAAYA,GAAG;IACnB,CAACD,gBAAgB,CAAC,EAAE;QAClB,IAAI,MAAM,CAAC;QACX,IAAI,MAAM,CAAC;QACX,IAAI,MAAM,CAAC;QACX,IAAI,MAAM,CAAC;QACX,IAAI,MAAM,CAAC;KACZ;IACD,CAACA,kBAAkB,CAAC,EAAE;QAAC;QAAM;QAAM;QAAM;QAAM;KAAK;AACtD;AAEA,MAAME,mBAAmBA,GAAuCC,CAAAA;IAC9D,MAAM,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,UAAU,EAAEC,UAAU,EAAEC,EAAE,EAAEC,SAAS,EAAE,GAAGN;IACzE,MAAM,EAAEO,wBAAwB,EAAEC,SAAS,EAAE,GAAGnB,UAAUA,CAACK,cAAcA;IAEzE,MAAMe,QAAQpB,UAAUA,CAACE,YAAYA;IACrC,MAAMmB,QAAQD,OAAO,OAAO,SAAS;IAErC,MAAM,CAACE,aAAaC,eAAe,GAAGtB,QAAQA,CAACgB,YAAYA,YAAY,CAAC;IACxE,MAAM,CAACO,YAAYC,cAAc,GAAGxB,QAAQA,CAAC;IAE7C,MAAMyB,gBAAgB,CAACC;QACrBJ,eAAeI;IACjB;IAEA,MAAMC,mBAAmB;QACvB,IAAIN,gBAAgB,CAAC,GAAG;YACtB;QACF;QAEA,MAAMO,OAAO;YACX,WAAWP;QACb;QACAJ,yBAAyBW,MAAMb;QAE/BS,cAAc;QACd,MAAMK,UAAUlB,QAAQ,CAACU,cAAc,EAAE;QAEzC,MAAMS,QAAQ;YACZ,MAAMhC,cAAc;YACpB+B;YACA,UAAUrB,YAAY,CAACM,WAAW,CAACO,cAAc,EAAE;QACrD;QACA,KAAKH,UAAUY;IACjB;IAEA,MAAMC,WAAWV,gBAAgB,CAAC;IAElC,qBACE,KAAC;QAAI,WAAU;;0BACb,KAACf,aAAaA;gBAAC,WAAU;;oBACtBM;kCACD,IAACP,cAAcA;wBACb,OAAOe;wBACP,gBAAgBK;wBAChB,aAAaJ;wBACb,YAAYP;wBACZ,WAAWE;;;;YAGd,CAACN,OAAO,aAAaa,4BACpB,IAACrB,MAAMA;gBACL,aAAa;gBACb,UAAU6B;gBACV,SAASJ;0BAERd;;;;AAKX;AAEA,qCAAeV,aAAaA,CAAC;IAC3B,MAAM;IACN,WAAWM,mBAAmBA;AAChC,EAAE"}

package/lib/webchat/custom-messages/rating/rating-selector.d.ts

@@ -0,0 +1,11 @@
+import { RatingType } from './types.js';
+interface RatingSelectorProps {
+    color: string;
+    isSent?: boolean;
+    onRatingChange: (newRating: number) => void;
+    ratingValue: number;
+    ratingType: RatingType;
+    valueSent?: number;
+}
+export declare const RatingSelector: ({ color, isSent, onRatingChange, ratingValue, ratingType, valueSent, }: RatingSelectorProps) => import("react").JSX.Element;
+export {};

package/lib/webchat/custom-messages/rating/rating-selector.js

@@ -0,0 +1,57 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Smileys } from "./smileys.js";
+import { Stars } from "./stars.js";
+import { RatingSelectorContainer } from "./styles.js";
+import { RatingType } from "./types.js";
+
+
+
+
+
+
+
+
+/** biome-ignore-all lint/a11y/noStaticElementInteractions: we need to use static elements for the rating selector */ /** biome-ignore-all lint/a11y/useKeyWithClickEvents: we need to use key with click events for the rating selector */ 
+
+
+
+
+const NUMBER_OF_RATING_BUTTONS = 5;
+const RatingSelector = ({ color, isSent, onRatingChange, ratingValue, ratingType, valueSent })=>{
+    const [hover, setHover] = useState(valueSent ? valueSent : -1);
+    const onHover = (ratingNumber)=>{
+        if (!valueSent) {
+            setHover(ratingNumber);
+        }
+    };
+    return /*#__PURE__*/ jsx(RatingSelectorContainer, {
+        isSent: isSent,
+        children: Array.from({
+            length: NUMBER_OF_RATING_BUTTONS
+        }, (_star, i)=>{
+            const ratingNumber = i + 1;
+            return /*#__PURE__*/ jsxs("div", {
+                onMouseEnter: ()=>onHover(ratingNumber),
+                onMouseLeave: ()=>onHover(ratingValue),
+                onClick: ()=>onRatingChange(ratingNumber),
+                children: [
+                    ratingType === RatingType.Stars && /*#__PURE__*/ jsx(Stars, {
+                        color: color,
+                        ratingNumber: ratingNumber,
+                        hover: hover
+                    }),
+                    ratingType === RatingType.Smileys && /*#__PURE__*/ jsx(Smileys, {
+                        color: color,
+                        ratingNumber: ratingNumber,
+                        hover: hover
+                    })
+                ]
+            }, ratingNumber);
+        })
+    });
+};
+
+export { RatingSelector };
+
+//# sourceMappingURL=rating-selector.js.map

package/lib/webchat/custom-messages/rating/rating-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/rating-selector.js","sources":["../../../../src/webchat/custom-messages/rating/rating-selector.tsx"],"sourcesContent":["/** biome-ignore-all lint/a11y/noStaticElementInteractions: we need to use static elements for the rating selector */\n/** biome-ignore-all lint/a11y/useKeyWithClickEvents: we need to use key with click events for the rating selector */\nimport { useState } from 'react'\n\nimport { Smileys } from './smileys'\nimport { Stars } from './stars'\nimport { RatingSelectorContainer } from './styles'\nimport { RatingType } from './types'\n\nconst NUMBER_OF_RATING_BUTTONS = 5\ninterface RatingSelectorProps {\n  color: string\n  isSent?: boolean\n  onRatingChange: (newRating: number) => void\n  ratingValue: number\n  ratingType: RatingType\n  valueSent?: number\n}\n\nexport const RatingSelector = ({\n  color,\n  isSent,\n  onRatingChange,\n  ratingValue,\n  ratingType,\n  valueSent,\n}: RatingSelectorProps) => {\n  const [hover, setHover] = useState<number>(valueSent ? valueSent : -1)\n\n  const onHover = (ratingNumber: number) => {\n    if (!valueSent) {\n      setHover(ratingNumber)\n    }\n  }\n\n  return (\n    <RatingSelectorContainer isSent={isSent}>\n      {Array.from({ length: NUMBER_OF_RATING_BUTTONS }, (_star, i) => {\n        const ratingNumber = i + 1\n\n        return (\n          <div\n            key={ratingNumber}\n            onMouseEnter={() => onHover(ratingNumber)}\n            onMouseLeave={() => onHover(ratingValue)}\n            onClick={() => onRatingChange(ratingNumber)}\n          >\n            {ratingType === RatingType.Stars && (\n              <Stars color={color} ratingNumber={ratingNumber} hover={hover} />\n            )}\n            {ratingType === RatingType.Smileys && (\n              <Smileys\n                color={color}\n                ratingNumber={ratingNumber}\n                hover={hover}\n              />\n            )}\n          </div>\n        )\n      })}\n    </RatingSelectorContainer>\n  )\n}\n"],"names":["useState","Smileys","Stars","RatingSelectorContainer","RatingType","NUMBER_OF_RATING_BUTTONS","RatingSelector","color","isSent","onRatingChange","ratingValue","ratingType","valueSent","hover","setHover","onHover","ratingNumber","Array","_star","i"],"mappings":";;;;;;;;;;;;;;AAAA,mHAAmH,GACnH,mHAAmH,GACnF;AAEG;AACJ;AACmB;AACd;AAEpC,MAAMK,wBAAwBA,GAAG;AAU1B,MAAMC,cAAcA,GAAG,CAAC,EAC7BC,KAAK,EACLC,MAAM,EACNC,cAAc,EACdC,WAAW,EACXC,UAAU,EACVC,SAAS,EACW;IACpB,MAAM,CAACC,OAAOC,SAAS,GAAGd,QAAQA,CAASY,YAAYA,YAAY,CAAC;IAEpE,MAAMG,UAAU,CAACC;QACf,IAAI,CAACJ,WAAW;YACdE,SAASE;QACX;IACF;IAEA,qBACE,IAACb,uBAAuBA;QAAC,QAAQK;kBAC9BS,MAAM,IAAI,CAAC;YAAE,QAAQZ,wBAAwBA;QAAC,GAAG,CAACa,OAAOC;YACxD,MAAMH,eAAeG,IAAI;YAEzB,qBACE,KAAC;gBAEC,cAAc,IAAMJ,QAAQC;gBAC5B,cAAc,IAAMD,QAAQL;gBAC5B,SAAS,IAAMD,eAAeO;;oBAE7BL,eAAeP,gBAAgB,kBAC9B,IAACF,KAAKA;wBAAC,OAAOK;wBAAO,cAAcS;wBAAc,OAAOH;;oBAEzDF,eAAeP,kBAAkB,kBAChC,IAACH,OAAOA;wBACN,OAAOM;wBACP,cAAcS;wBACd,OAAOH;;;eAZNG;QAiBX;;AAGN,EAAC"}

package/lib/webchat/custom-messages/rating/smileys.d.ts

@@ -0,0 +1,2 @@
+import type { RatingItemProps } from './types.js';
+export declare const Smileys: ({ color, ratingNumber, hover }: RatingItemProps) => import("react").JSX.Element | null;

package/lib/webchat/custom-messages/rating/smileys.js

@@ -0,0 +1,26 @@
+import { jsx } from "react/jsx-runtime";
+import { FaceAngrySvg, FaceFrownSvg, FaceGrinBeamSvg, FaceMehSvg, FaceSmileSvg } from "./icons/index.js";
+
+
+
+
+
+const SMILEY_MAP = {
+    1: FaceAngrySvg,
+    2: FaceFrownSvg,
+    3: FaceMehSvg,
+    4: FaceSmileSvg,
+    5: FaceGrinBeamSvg
+};
+const Smileys = ({ color, ratingNumber, hover })=>{
+    const isSelected = hover === ratingNumber;
+    const SmileyComponent = SMILEY_MAP[ratingNumber];
+    return SmileyComponent ? /*#__PURE__*/ jsx(SmileyComponent, {
+        color: color,
+        selected: isSelected
+    }) : null;
+};
+
+export { Smileys };
+
+//# sourceMappingURL=smileys.js.map

package/lib/webchat/custom-messages/rating/smileys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/smileys.js","sources":["../../../../src/webchat/custom-messages/rating/smileys.tsx"],"sourcesContent":["import {\n  FaceAngrySvg,\n  FaceFrownSvg,\n  FaceGrinBeamSvg,\n  FaceMehSvg,\n  FaceSmileSvg,\n} from './icons'\nimport type { RatingItemProps } from './types'\n\nconst SMILEY_MAP = {\n  1: FaceAngrySvg,\n  2: FaceFrownSvg,\n  3: FaceMehSvg,\n  4: FaceSmileSvg,\n  5: FaceGrinBeamSvg,\n} as const\n\nexport const Smileys = ({ color, ratingNumber, hover }: RatingItemProps) => {\n  const isSelected = hover === ratingNumber\n  const SmileyComponent = SMILEY_MAP[ratingNumber as keyof typeof SMILEY_MAP]\n\n  return SmileyComponent ? (\n    <SmileyComponent color={color} selected={isSelected} />\n  ) : null\n}\n"],"names":["FaceAngrySvg","FaceFrownSvg","FaceGrinBeamSvg","FaceMehSvg","FaceSmileSvg","SMILEY_MAP","Smileys","color","ratingNumber","hover","isSelected","SmileyComponent"],"mappings":";;;;;;AAMgB;AAGhB,MAAMK,UAAUA,GAAG;IACjB,GAAGL,YAAYA;IACf,GAAGC,YAAYA;IACf,GAAGE,UAAUA;IACb,GAAGC,YAAYA;IACf,GAAGF,eAAeA;AACpB;AAEO,MAAMI,OAAOA,GAAG,CAAC,EAAEC,KAAK,EAAEC,YAAY,EAAEC,KAAK,EAAmB;IACrE,MAAMC,aAAaD,UAAUD;IAC7B,MAAMG,kBAAkBN,UAAU,CAACG,aAAwC;IAE3E,OAAOG,gCACL,IAACA;QAAgB,OAAOJ;QAAO,UAAUG;SACvC;AACN,EAAC"}

package/lib/webchat/custom-messages/rating/stars.d.ts

@@ -0,0 +1,2 @@
+import type { RatingItemProps } from './types.js';
+export declare const Stars: ({ color, ratingNumber, hover }: RatingItemProps) => import("react").JSX.Element;

package/lib/webchat/custom-messages/rating/stars.js

@@ -0,0 +1,18 @@
+import { jsx } from "react/jsx-runtime";
+import { StarSvg } from "./icons/index.js";
+
+
+
+
+
+const Stars = ({ color, ratingNumber, hover })=>{
+    const isSelected = hover >= ratingNumber;
+    return /*#__PURE__*/ jsx(StarSvg, {
+        color: color,
+        selected: isSelected
+    });
+};
+
+export { Stars };
+
+//# sourceMappingURL=stars.js.map

package/lib/webchat/custom-messages/rating/stars.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/stars.js","sources":["../../../../src/webchat/custom-messages/rating/stars.tsx"],"sourcesContent":["import { StarSvg } from './icons/index'\nimport type { RatingItemProps } from './types'\n\nexport const Stars = ({ color, ratingNumber, hover }: RatingItemProps) => {\n  const isSelected = hover >= ratingNumber\n  return <StarSvg color={color} selected={isSelected} />\n}\n"],"names":["StarSvg","Stars","color","ratingNumber","hover","isSelected"],"mappings":";;;;;;AAAuC;AAGhC,MAAMC,KAAKA,GAAG,CAAC,EAAEC,KAAK,EAAEC,YAAY,EAAEC,KAAK,EAAmB;IACnE,MAAMC,aAAaD,SAASD;IAC5B,qBAAO,IAACH,OAAOA;QAAC,OAAOE;QAAO,UAAUG;;AAC1C,EAAC"}

package/lib/webchat/custom-messages/rating/styles.js

@@ -0,0 +1,27 @@
+import styled_components from "styled-components";
+
+
+
+// TODO: Review how define all this styles
+const MessageBubble = styled_components.div`
+  margin: 0px 0px 5px 0px;
+`;
+const RatingSelectorContainer = styled_components.div`
+  display: flex;
+  justify-content: center;
+  gap: 8px;
+  margin-top: 16px;
+
+  & > div {
+    cursor: ${(props)=>props.isSent ? 'default' : 'pointer'};
+
+    svg {
+      height: 27px;
+      width: 27px;
+    }
+  }
+`;
+
+export { MessageBubble, RatingSelectorContainer };
+
+//# sourceMappingURL=styles.js.map

package/lib/webchat/custom-messages/rating/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/styles.js","sources":["../../../../src/webchat/custom-messages/rating/styles.ts"],"sourcesContent":["import styled from 'styled-components'\n\n// TODO: Review how define all this styles\nexport const MessageBubble = styled.div`\n  margin: 0px 0px 5px 0px;\n`\n\ninterface RatingSelectorContainerProps {\n  isSent?: boolean\n}\n\nexport const RatingSelectorContainer = styled.div<RatingSelectorContainerProps>`\n  display: flex;\n  justify-content: center;\n  gap: 8px;\n  margin-top: 16px;\n\n  & > div {\n    cursor: ${props => (props.isSent ? 'default' : 'pointer')};\n\n    svg {\n      height: 27px;\n      width: 27px;\n    }\n  }\n`\n"],"names":["styled","MessageBubble","RatingSelectorContainer","props"],"mappings":";;;AAAsC;AAEtC,0CAA0C;AACnC,MAAMC,aAAaA,GAAGD,qBAAU,CAAC;;AAExC,CAAC;AAMM,MAAME,uBAAuBA,GAAGF,qBAAwC,CAAC;;;;;;;YAOpE,EAAEG,CAAAA,QAAUA,MAAM,MAAM,GAAG,YAAY,UAAW;;;;;;;AAO9D,CAAC"}

package/lib/webchat/custom-messages/rating/types.js

@@ -0,0 +1,9 @@
+var types_RatingType = /*#__PURE__*/ function(RatingType) {
+    RatingType["Stars"] = "stars";
+    RatingType["Smileys"] = "smileys";
+    return RatingType;
+}({});
+
+export { types_RatingType as RatingType };
+
+//# sourceMappingURL=types.js.map

package/lib/webchat/custom-messages/rating/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/custom-messages/rating/types.js","sources":["../../../../src/webchat/custom-messages/rating/types.ts"],"sourcesContent":["export enum RatingType {\n  Stars = 'stars',\n  Smileys = 'smileys',\n}\n\nexport interface RatingItemProps {\n  color: string\n  ratingNumber: number\n  hover: number\n}\n\nexport interface RatingIconProps {\n  color: string\n  selected?: boolean\n}\n"],"names":["RatingType"],"mappings":"AAAO,IAAKA,gBAAUA,0BAAVA;;;WAAAA;MAGX"}

package/lib/webchat/devices/index.js

@@ -0,0 +1,20 @@
+const DEVICES = Object.freeze({
+    MOBILE: {
+        IPHONE: 'iPhone',
+        ANDROID: 'Android',
+        WEBOS: 'webOS',
+        BLACKBERRY: 'BlackBerry',
+        WINDOWS_PHONE: 'Windows Phone'
+    }
+});
+const isDevice = (deviceName)=>{
+    // https://stackoverflow.com/questions/19877924/what-is-the-list-of-possible-values-for-navigator-platform-as-of-today
+    return !!navigator.platform && navigator.platform.toLowerCase().includes(deviceName.toLowerCase());
+};
+const isMobileDevice = ()=>{
+    return Object.values(DEVICES.MOBILE).some((deviceName)=>isDevice(deviceName));
+};
+
+export { DEVICES, isDevice, isMobileDevice };
+
+//# sourceMappingURL=index.js.map

package/lib/webchat/devices/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/devices/index.js","sources":["../../../src/webchat/devices/index.js"],"sourcesContent":["export const DEVICES = Object.freeze({\n  MOBILE: {\n    IPHONE: 'iPhone',\n    ANDROID: 'Android',\n    WEBOS: 'webOS',\n    BLACKBERRY: 'BlackBerry',\n    WINDOWS_PHONE: 'Windows Phone',\n  },\n})\n\nexport const isDevice = deviceName => {\n  // https://stackoverflow.com/questions/19877924/what-is-the-list-of-possible-values-for-navigator-platform-as-of-today\n  return (\n    !!navigator.platform &&\n    navigator.platform.toLowerCase().includes(deviceName.toLowerCase())\n  )\n}\n\nexport const isMobileDevice = () => {\n  return Object.values(DEVICES.MOBILE).some(deviceName => isDevice(deviceName))\n}\n"],"names":["DEVICES","Object","isDevice","deviceName","navigator","isMobileDevice"],"mappings":"AAAO,MAAMA,OAAOA,GAAGC,OAAO,MAAM,CAAC;IACnC,QAAQ;QACN,QAAQ;QACR,SAAS;QACT,OAAO;QACP,YAAY;QACZ,eAAe;IACjB;AACF,GAAE;AAEK,MAAMC,QAAQA,GAAGC,CAAAA;IACtB,sHAAsH;IACtH,OACE,CAAC,CAACC,UAAU,QAAQ,IACpBA,UAAU,QAAQ,CAAC,WAAW,GAAG,QAAQ,CAACD,WAAW,WAAW;AAEpE,EAAC;AAEM,MAAME,cAAcA,GAAG;IAC5B,OAAOJ,OAAO,MAAM,CAACD,OAAOA,CAAC,MAAM,EAAE,IAAI,CAACG,CAAAA,aAAcD,QAAQA,CAACC;AACnE,EAAC"}

package/lib/webchat/global.d.ts

@@ -0,0 +1,3 @@
+interface Window {
+  _botonicInsertStyles?: HTMLStyleElement[]
+}

package/lib/webchat/header/default-header.d.ts

@@ -0,0 +1 @@
+export declare const DefaultHeader: () => import("react").JSX.Element;

package/lib/webchat/header/default-header.js

@@ -0,0 +1,75 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useContext } from "react";
+import { ROLES, WEBCHAT } from "../../constants.js";
+import { Scale } from "../../shared/styles.js";
+import { resolveImage } from "../../util/environment.js";
+import { ConditionalWrapper } from "../../util/react.js";
+import { WebchatContext } from "../context/index.js";
+import { CloseHeader, HeaderContainer, ImageContainer, Subtitle, TextContainer, Title } from "./styles.js";
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const DefaultHeader = ()=>{
+    const { getThemeProperty, toggleWebchat } = useContext(WebchatContext);
+    const animationsEnabled = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.enableAnimations);
+    const headerImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.headerImage, getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.brandImage));
+    const headerTitle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.headerTitle);
+    const headerSubtitle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.headerSubtitle);
+    const handleCloseWebchat = ()=>{
+        toggleWebchat(false);
+    };
+    const color = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.brandColor);
+    return /*#__PURE__*/ jsxs(HeaderContainer, {
+        role: ROLES.HEADER,
+        color: color,
+        style: {
+            ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.headerStyle)
+        },
+        children: [
+            headerImage && /*#__PURE__*/ jsx(ImageContainer, {
+                children: /*#__PURE__*/ jsx("img", {
+                    src: resolveImage(headerImage),
+                    alt: "Header"
+                })
+            }),
+            /*#__PURE__*/ jsxs(TextContainer, {
+                children: [
+                    /*#__PURE__*/ jsx(Title, {
+                        children: headerTitle
+                    }),
+                    headerSubtitle ? /*#__PURE__*/ jsx(Subtitle, {
+                        children: headerSubtitle
+                    }) : null
+                ]
+            }),
+            /*#__PURE__*/ jsx(ConditionalWrapper, {
+                condition: animationsEnabled,
+                wrapper: (children)=>/*#__PURE__*/ jsx(Scale, {
+                        children: children
+                    }),
+                children: /*#__PURE__*/ jsx(CloseHeader, {
+                    onClick: handleCloseWebchat,
+                    children: "⨯"
+                })
+            })
+        ]
+    });
+};
+
+export { DefaultHeader };
+
+//# sourceMappingURL=default-header.js.map

package/lib/webchat/header/default-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/header/default-header.js","sources":["../../../src/webchat/header/default-header.tsx"],"sourcesContent":["import { useContext } from 'react'\n\nimport { ROLES, WEBCHAT } from '../../constants'\nimport { Scale } from '../../shared/styles'\nimport { resolveImage } from '../../util/environment'\nimport { ConditionalWrapper } from '../../util/react'\nimport { WebchatContext } from '../../webchat/context'\nimport {\n  CloseHeader,\n  HeaderContainer,\n  ImageContainer,\n  Subtitle,\n  TextContainer,\n  Title,\n} from './styles'\n\nexport const DefaultHeader = () => {\n  const { getThemeProperty, toggleWebchat } = useContext(WebchatContext)\n\n  const animationsEnabled = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.enableAnimations\n  )\n\n  const headerImage = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.headerImage,\n    getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.brandImage)\n  )\n\n  const headerTitle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.headerTitle)\n\n  const headerSubtitle = getThemeProperty(\n    WEBCHAT.CUSTOM_PROPERTIES.headerSubtitle\n  )\n\n  const handleCloseWebchat = () => {\n    toggleWebchat(false)\n  }\n\n  const color = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.brandColor)\n\n  return (\n    <HeaderContainer\n      role={ROLES.HEADER}\n      color={color}\n      style={{ ...getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.headerStyle) }}\n    >\n      {headerImage && (\n        <ImageContainer>\n          <img src={resolveImage(headerImage)} alt='Header' />\n        </ImageContainer>\n      )}\n      <TextContainer>\n        <Title>{headerTitle}</Title>\n        {headerSubtitle ? <Subtitle>{headerSubtitle}</Subtitle> : null}\n      </TextContainer>\n      <ConditionalWrapper\n        condition={animationsEnabled}\n        wrapper={children => <Scale>{children}</Scale>}\n      >\n        <CloseHeader onClick={handleCloseWebchat}>⨯</CloseHeader>\n      </ConditionalWrapper>\n    </HeaderContainer>\n  )\n}\n"],"names":["useContext","ROLES","WEBCHAT","Scale","resolveImage","ConditionalWrapper","WebchatContext","CloseHeader","HeaderContainer","ImageContainer","Subtitle","TextContainer","Title","DefaultHeader","getThemeProperty","toggleWebchat","animationsEnabled","headerImage","headerTitle","headerSubtitle","handleCloseWebchat","color","children"],"mappings":";;;;;;;;;;;;;;;;;;AAAkC;AAEc;AACL;AACU;AACA;AACC;AAQrC;AAEV,MAAMa,aAAaA,GAAG;IAC3B,MAAM,EAAEC,gBAAgB,EAAEC,aAAa,EAAE,GAAGf,UAAUA,CAACM,cAAcA;IAErE,MAAMU,oBAAoBF,iBACxBZ,0CAA0C;IAG5C,MAAMe,cAAcH,iBAClBZ,qCAAqC,EACrCY,iBAAiBZ,oCAAoC;IAGvD,MAAMgB,cAAcJ,iBAAiBZ,qCAAqC;IAE1E,MAAMiB,iBAAiBL,iBACrBZ,wCAAwC;IAG1C,MAAMkB,qBAAqB;QACzBL,cAAc;IAChB;IAEA,MAAMM,QAAQP,iBAAiBZ,oCAAoC;IAEnE,qBACE,KAACM,eAAeA;QACd,MAAMP,YAAY;QAClB,OAAOoB;QACP,OAAO;YAAE,GAAGP,iBAAiBZ,qCAAqC,CAAC;QAAC;;YAEnEe,6BACC,IAACR,cAAcA;0BACb,kBAAC;oBAAI,KAAKL,YAAYA,CAACa;oBAAc,KAAI;;;0BAG7C,KAACN,aAAaA;;kCACZ,IAACC,KAAKA;kCAAEM;;oBACPC,+BAAiB,IAACT,QAAQA;kCAAES;yBAA6B;;;0BAE5D,IAACd,kBAAkBA;gBACjB,WAAWW;gBACX,SAASM,CAAAA,yBAAY,IAACnB,KAAKA;kCAAEmB;;0BAE7B,kBAACf,WAAWA;oBAAC,SAASa;8BAAoB;;;;;AAIlD,EAAC"}

package/lib/webchat/header/index.js

@@ -0,0 +1,48 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, useContext } from "react";
+import { WEBCHAT } from "../../constants.js";
+import { WebchatContext } from "../context/index.js";
+import { BotonicContainerId } from "../constants.js";
+import { DefaultHeader } from "./default-header.js";
+import { StyledWebchatHeader } from "./styles.js";
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+const WebchatHeader = /*#__PURE__*/ forwardRef((_, ref)=>{
+    const { getThemeProperty, toggleWebchat } = useContext(WebchatContext);
+    const handleCloseWebchat = ()=>{
+        toggleWebchat(false);
+    };
+    const CustomHeader = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.customHeader);
+    if (CustomHeader) {
+        return /*#__PURE__*/ jsx("div", {
+            id: BotonicContainerId.Header,
+            ref: ref,
+            children: /*#__PURE__*/ jsx(CustomHeader, {
+                onCloseClick: handleCloseWebchat
+            })
+        });
+    }
+    return /*#__PURE__*/ jsx(StyledWebchatHeader, {
+        id: BotonicContainerId.Header,
+        ref: ref,
+        children: /*#__PURE__*/ jsx(DefaultHeader, {})
+    });
+});
+WebchatHeader.displayName = 'WebchatHeader';
+
+export { WebchatHeader };
+
+//# sourceMappingURL=index.js.map

package/lib/webchat/header/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"webchat/header/index.js","sources":["../../../src/webchat/header/index.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, useContext } from 'react'\n\nimport { WEBCHAT } from '../../constants'\nimport { WebchatContext } from '../../webchat/context'\nimport { BotonicContainerId } from '../constants'\nimport { DefaultHeader } from './default-header'\nimport { StyledWebchatHeader } from './styles'\n\nexport const WebchatHeader = forwardRef(\n  (_, ref: ForwardedRef<HTMLDivElement>) => {\n    const { getThemeProperty, toggleWebchat } = useContext(WebchatContext)\n\n    const handleCloseWebchat = () => {\n      toggleWebchat(false)\n    }\n\n    const CustomHeader = getThemeProperty(\n      WEBCHAT.CUSTOM_PROPERTIES.customHeader\n    )\n\n    if (CustomHeader) {\n      return (\n        <div id={BotonicContainerId.Header} ref={ref}>\n          <CustomHeader onCloseClick={handleCloseWebchat} />\n        </div>\n      )\n    }\n\n    return (\n      <StyledWebchatHeader id={BotonicContainerId.Header} ref={ref}>\n        <DefaultHeader />\n      </StyledWebchatHeader>\n    )\n  }\n)\n\nWebchatHeader.displayName = 'WebchatHeader'\n"],"names":["forwardRef","useContext","WEBCHAT","WebchatContext","BotonicContainerId","DefaultHeader","StyledWebchatHeader","WebchatHeader","_","ref","getThemeProperty","toggleWebchat","handleCloseWebchat","CustomHeader"],"mappings":";;;;;;;;;;;;;;;;AAAiE;AAExB;AACa;AACL;AACD;AACF;AAEvC,MAAMO,aAAaA,iBAAGP,UAAUA,CACrC,CAACQ,GAAGC;IACF,MAAM,EAAEC,gBAAgB,EAAEC,aAAa,EAAE,GAAGV,UAAUA,CAACE,cAAcA;IAErE,MAAMS,qBAAqB;QACzBD,cAAc;IAChB;IAEA,MAAME,eAAeH,iBACnBR,sCAAsC;IAGxC,IAAIW,cAAc;QAChB,qBACE,IAAC;YAAI,IAAIT,yBAAyB;YAAE,KAAKK;sBACvC,kBAACI;gBAAa,cAAcD;;;IAGlC;IAEA,qBACE,IAACN,mBAAmBA;QAAC,IAAIF,yBAAyB;QAAE,KAAKK;kBACvD,kBAACJ,aAAaA;;AAGpB,GACD;AAEDE,aAAaA,CAAC,WAAW,GAAG"}