open-chat-studio-widget 0.3.0 → 0.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -33,7 +33,7 @@ const ChevronDownIcon = () => {
33
33
  index.h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m19.5 8.25-7.5 7.5-7.5-7.5" }));
34
34
  };
35
35
 
36
- const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block;z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}";
36
+ const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block}#ocs-chat-window{z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}";
37
37
  const OpenChatStudioWidgetStyle0 = ocsChatCss;
38
38
 
39
39
  const allowedHosts = ["chatbots.dimagi.com"];
@@ -98,7 +98,7 @@ const OcsChat = class {
98
98
  if (this.error) {
99
99
  return (index.h(index.Host, null, index.h("p", null, this.error)));
100
100
  }
101
- return (index.h(index.Host, null, index.h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (index.h("div", { class: this.getPositionClasses() }, index.h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, index.h("div", { class: "flex gap-1" }, index.h("button", { class: {
101
+ return (index.h(index.Host, null, index.h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (index.h("div", { id: "ocs-chat-window", class: this.getPositionClasses() }, index.h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, index.h("div", { class: "flex gap-1" }, index.h("button", { class: {
102
102
  'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,
103
103
  'text-blue-600': this.position === 'left',
104
104
  'text-gray-500': this.position !== 'left'
@@ -1 +1 @@
1
- {"file":"open-chat-studio-widget.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n z-index: var(--chat-z-index);\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"open-chat-studio-widget.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n#ocs-chat-window {\n z-index: var(--chat-z-index);\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div id=\"ocs-chat-window\" class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
@@ -683,9 +683,11 @@ video {
683
683
  --chat-z-index: 50;
684
684
 
685
685
  display: block;
686
- z-index: var(--chat-z-index);
687
686
  }
688
687
  /* These custom button styles need to remain since they use CSS variables */
688
+ #ocs-chat-window {
689
+ z-index: var(--chat-z-index);
690
+ }
689
691
  .iframe-placeholder {
690
692
  /*loading-dots*/
691
693
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);
@@ -61,7 +61,7 @@ export class OcsChat {
61
61
  if (this.error) {
62
62
  return (h(Host, null, h("p", null, this.error)));
63
63
  }
64
- return (h(Host, null, h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (h("div", { class: this.getPositionClasses() }, h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, h("div", { class: "flex gap-1" }, h("button", { class: {
64
+ return (h(Host, null, h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (h("div", { id: "ocs-chat-window", class: this.getPositionClasses() }, h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, h("div", { class: "flex gap-1" }, h("button", { class: {
65
65
  'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,
66
66
  'text-blue-600': this.position === 'left',
67
67
  'text-gray-500': this.position !== 'left'
@@ -1 +1 @@
1
- {"version":3,"file":"ocs-chat.js","sourceRoot":"","sources":["../../../src/components/ocs-chat/ocs-chat.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AACvE,OAAO,EACL,2BAA2B,EAC3B,4BAA4B,EAC5B,qBAAqB,EACrB,oBAAoB,EACpB,SAAS,EACT,eAAe,EACf,aAAa,GACd,MAAM,aAAa,CAAC;AAErB,MAAM,YAAY,GAAG,CAAC,qBAAqB,CAAC,CAAC;AAO7C,MAAM,OAAO,OAAO;IALpB;QAYE;;WAEG;QACK,eAAU,GAAW,MAAM,CAAC;QAEpC;;WAEG;QACsB,YAAO,GAAY,KAAK,CAAC;QAElD;;WAEG;QACsB,aAAQ,GAAgC,OAAO,CAAC;QAEzE;;WAEG;QACsB,aAAQ,GAAY,KAAK,CAAC;QAE1C,WAAM,GAAY,KAAK,CAAC;QACxB,UAAK,GAAW,EAAE,CAAC;KA6H7B;IA3HC,iBAAiB;QACf,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC;QAC3B,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;YACjB,IAAI,CAAC;gBACH,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;gBACjC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;oBACrC,IAAI,CAAC,KAAK,GAAG,oBAAoB,IAAI,CAAC,MAAM,EAAE,CAAC;gBACjD,CAAC;YACH,CAAC;YAAC,WAAM,CAAC;gBACP,IAAI,CAAC,KAAK,GAAG,oBAAoB,IAAI,CAAC,MAAM,EAAE,CAAC;YACjD,CAAC;QACH,CAAC;IACH,CAAC;IAED,IAAI;QACF,IAAI,CAAC,OAAO,GAAG,CAAC,IAAI,CAAC,OAAO,CAAC;QAC7B,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;IACrB,CAAC;IAED,WAAW,CAAC,QAAqC;QAC/C,IAAI,QAAQ,KAAK,IAAI,CAAC,QAAQ;YAAE,OAAO;QACvC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAC3B,CAAC;IAED,UAAU;QACR,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;IACjC,CAAC;IAED,kBAAkB;QAChB,MAAM,WAAW,GAAG,6BAA6B,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,qFAAqF,CAAC;QAExK,MAAM,eAAe,GAAG;YACtB,IAAI,EAAE,uCAAuC;YAC7C,KAAK,EAAE,yCAAyC;YAChD,MAAM,EAAE,oDAAoD;SAC7D,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAEjB,OAAO,GAAG,WAAW,IAAI,eAAe,EAAE,CAAC;IAC7C,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,OAAO,CACL,EAAC,IAAI;gBACH,aAAI,IAAI,CAAC,KAAK,CAAK,CACd,CACR,CAAC;QACJ,CAAC;QAED,OAAO,CACL,EAAC,IAAI;YACH,cAAQ,KAAK,EAAC,KAAK,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,IAAG,IAAI,CAAC,UAAU,CAAU;YACzE,IAAI,CAAC,OAAO,IAAI,CACf,WAAK,KAAK,EAAE,IAAI,CAAC,kBAAkB,EAAE;gBACnC,WAAK,KAAK,EAAC,sEAAsE;oBAC/E,WAAK,KAAK,EAAC,YAAY;wBACrB,cACE,KAAK,EAAE;gCACL,mFAAmF,EAAE,IAAI;gCACzF,eAAe,EAAE,IAAI,CAAC,QAAQ,KAAK,MAAM;gCACzC,eAAe,EAAE,IAAI,CAAC,QAAQ,KAAK,MAAM;6BAC1C,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,gBAC5B,cAAc,EACzB,KAAK,EAAC,cAAc;4BAEpB,EAAC,2BAA2B,OAAE,CACvB;wBACT,cACE,KAAK,EAAE;gCACL,mEAAmE,EAAE,IAAI;gCACzE,eAAe,EAAE,IAAI,CAAC,QAAQ,KAAK,QAAQ;gCAC3C,eAAe,EAAE,IAAI,CAAC,QAAQ,KAAK,QAAQ;6BAC5C,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,gBAC9B,QAAQ,EACnB,KAAK,EAAC,QAAQ;4BAEd,EAAC,oBAAoB,OAAE,CAChB;wBACT,cACE,KAAK,EAAE;gCACL,mEAAmE,EAAE,IAAI;gCACzE,eAAe,EAAE,IAAI,CAAC,QAAQ,KAAK,OAAO;gCAC1C,eAAe,EAAE,IAAI,CAAC,QAAQ,KAAK,OAAO;6BAC3C,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,gBAC7B,eAAe,EAC1B,KAAK,EAAC,eAAe;4BAErB,YAAM,KAAK,EAAC,iBAAiB;gCAAC,EAAC,4BAA4B,OAAE,CAAO;4BACpE,YAAM,KAAK,EAAC,WAAW;gCAAC,EAAC,qBAAqB,OAAE,CAAO,CAChD,CACL;oBACN,WAAK,KAAK,EAAC,YAAY;wBACrB,cACE,KAAK,EAAC,iFAAiF,EACvF,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,UAAU,EAAE,gBACpB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,EACjD,KAAK,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,IAE3C,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAC,eAAe,OAAE,CAAC,CAAC,CAAC,EAAC,aAAa,OAAE,CAC/C;wBACT,cACE,KAAK,EAAC,iFAAiF,EACvF,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,KAAK,gBACxB,OAAO;4BAElB,EAAC,SAAS,OAAE,CACL,CACL,CACF;gBACL,IAAI,CAAC,MAAM,IAAI,CACd,cACE,KAAK,EAAC,iDAAiD,EACvD,GAAG,EAAE,IAAI,CAAC,MAAM,GACR,CACX,CACG,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"ocs-chat.js","sourceRoot":"","sources":["../../../src/components/ocs-chat/ocs-chat.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div id=\"ocs-chat-window\" class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
@@ -29,7 +29,7 @@ const ChevronDownIcon = () => {
29
29
  h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m19.5 8.25-7.5 7.5-7.5-7.5" }));
30
30
  };
31
31
 
32
- const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block;z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}";
32
+ const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block}#ocs-chat-window{z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}";
33
33
  const OpenChatStudioWidgetStyle0 = ocsChatCss;
34
34
 
35
35
  const allowedHosts = ["chatbots.dimagi.com"];
@@ -96,7 +96,7 @@ const OcsChat = /*@__PURE__*/ proxyCustomElement(class OcsChat extends HTMLEleme
96
96
  if (this.error) {
97
97
  return (h(Host, null, h("p", null, this.error)));
98
98
  }
99
- return (h(Host, null, h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (h("div", { class: this.getPositionClasses() }, h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, h("div", { class: "flex gap-1" }, h("button", { class: {
99
+ return (h(Host, null, h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (h("div", { id: "ocs-chat-window", class: this.getPositionClasses() }, h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, h("div", { class: "flex gap-1" }, h("button", { class: {
100
100
  'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,
101
101
  'text-blue-600': this.position === 'left',
102
102
  'text-gray-500': this.position !== 'left'
@@ -1 +1 @@
1
- {"file":"open-chat-studio-widget.js","mappings":"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","names":[],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n z-index: var(--chat-z-index);\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"open-chat-studio-widget.js","mappings":"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","names":[],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n#ocs-chat-window {\n z-index: var(--chat-z-index);\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div id=\"ocs-chat-window\" class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
@@ -29,7 +29,7 @@ const ChevronDownIcon = () => {
29
29
  h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", d: "m19.5 8.25-7.5 7.5-7.5-7.5" }));
30
30
  };
31
31
 
32
- const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block;z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}";
32
+ const ocsChatCss = "*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:''}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type='button']),input:where([type='reset']),input:where([type='submit']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role=\"button\"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=\"until-found\"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block}#ocs-chat-window{z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}";
33
33
  const OpenChatStudioWidgetStyle0 = ocsChatCss;
34
34
 
35
35
  const allowedHosts = ["chatbots.dimagi.com"];
@@ -94,7 +94,7 @@ const OcsChat = class {
94
94
  if (this.error) {
95
95
  return (h(Host, null, h("p", null, this.error)));
96
96
  }
97
- return (h(Host, null, h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (h("div", { class: this.getPositionClasses() }, h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, h("div", { class: "flex gap-1" }, h("button", { class: {
97
+ return (h(Host, null, h("button", { class: "btn", onClick: () => this.load() }, this.buttonText), this.visible && (h("div", { id: "ocs-chat-window", class: this.getPositionClasses() }, h("div", { class: "flex justify-between items-center px-2 py-2 border-b border-gray-100" }, h("div", { class: "flex gap-1" }, h("button", { class: {
98
98
  'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,
99
99
  'text-blue-600': this.position === 'left',
100
100
  'text-gray-500': this.position !== 'left'
@@ -1 +1 @@
1
- {"file":"open-chat-studio-widget.entry.js","mappings":"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","names":[],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n z-index: var(--chat-z-index);\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"open-chat-studio-widget.entry.js","mappings":"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","names":[],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n#ocs-chat-window {\n z-index: var(--chat-z-index);\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div id=\"ocs-chat-window\" class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1,2 +1,2 @@
1
- import{p as t,b as o}from"./p-4cdc34c1.js";export{s as setNonce}from"./p-4cdc34c1.js";import{g as e}from"./p-e1255160.js";var r=()=>{const o=import.meta.url;const e={};if(o!==""){e.resourcesUrl=new URL(".",o).href}return t(e)};r().then((async t=>{await e();return o([["p-acba9216",[[1,"open-chat-studio-widget",{botUrl:[1,"bot-url"],buttonText:[1,"button-text"],visible:[1028],position:[1025],expanded:[1028],loaded:[32],error:[32]}]]]],t)}));
1
+ import{p as t,b as o}from"./p-4cdc34c1.js";export{s as setNonce}from"./p-4cdc34c1.js";import{g as e}from"./p-e1255160.js";var r=()=>{const o=import.meta.url;const e={};if(o!==""){e.resourcesUrl=new URL(".",o).href}return t(e)};r().then((async t=>{await e();return o([["p-c4c7c404",[[1,"open-chat-studio-widget",{botUrl:[1,"bot-url"],buttonText:[1,"button-text"],visible:[1028],position:[1025],expanded:[1028],loaded:[32],error:[32]}]]]],t)}));
2
2
  //# sourceMappingURL=open-chat-studio-widget.esm.js.map
@@ -1,2 +1,2 @@
1
- import{h as t,r as o,H as e}from"./p-4cdc34c1.js";const r=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75"}));const i=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25"}));const n=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":1.5,stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25"}));const a=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"}));const s=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18 18 6M6 6l12 12"}));const l=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m4.5 15.75 7.5-7.5 7.5 7.5"}));const d=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"}));const c='*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:\'\'}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type=\'button\']),input:where([type=\'reset\']),input:where([type=\'submit\']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=\'search\']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role="button"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden="until-found"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block;z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}';const h=c;const b=["chatbots.dimagi.com"];const w=class{constructor(t){o(this,t);this.buttonText="Chat";this.visible=false;this.position="right";this.expanded=false;this.loaded=false;this.error=""}componentWillLoad(){this.loaded=this.visible;{try{const t=new URL(this.botUrl);if(!b.includes(t.host)){this.error=`Invalid Bot URL: ${this.botUrl}`}}catch(t){this.error=`Invalid Bot URL: ${this.botUrl}`}}}load(){this.visible=!this.visible;this.loaded=true}setPosition(t){if(t===this.position)return;this.position=t}toggleSize(){this.expanded=!this.expanded}getPositionClasses(){const t=`fixed w-full sm:w-[450px] ${this.expanded?"h-5/6":"h-3/5"} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;const o={left:"left-0 sm:left-5 bottom-0 sm:bottom-5",right:"right-0 sm:right-5 bottom-0 sm:bottom-5",center:"left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"}[this.position];return`${t} ${o}`}render(){if(this.error){return t(e,null,t("p",null,this.error))}return t(e,null,t("button",{class:"btn",onClick:()=>this.load()},this.buttonText),this.visible&&t("div",{class:this.getPositionClasses()},t("div",{class:"flex justify-between items-center px-2 py-2 border-b border-gray-100"},t("div",{class:"flex gap-1"},t("button",{class:{"hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100":true,"text-blue-600":this.position==="left","text-gray-500":this.position!=="left"},onClick:()=>this.setPosition("left"),"aria-label":"Dock to left",title:"Dock to left"},t(r,null)),t("button",{class:{"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100":true,"text-blue-600":this.position==="center","text-gray-500":this.position!=="center"},onClick:()=>this.setPosition("center"),"aria-label":"Center",title:"Center"},t(a,null)),t("button",{class:{"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100":true,"text-blue-600":this.position==="right","text-gray-500":this.position!=="right"},onClick:()=>this.setPosition("right"),"aria-label":"Dock to right",title:"Dock to right"},t("span",{class:"hidden sm:block"},t(i,null)),t("span",{class:"sm:hidden"},t(n,null)))),t("div",{class:"flex gap-1"},t("button",{class:"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500",onClick:()=>this.toggleSize(),"aria-label":this.expanded?"Collapse":"Expand",title:this.expanded?"Collapse":"Expand"},this.expanded?t(d,null):t(l,null)),t("button",{class:"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500",onClick:()=>this.visible=false,"aria-label":"Close"},t(s,null)))),this.loaded&&t("iframe",{class:"flex-grow w-full border-none iframe-placeholder",src:this.botUrl})))}};w.style=h;export{w as open_chat_studio_widget};
2
- //# sourceMappingURL=p-acba9216.entry.js.map
1
+ import{h as t,r as o,H as e}from"./p-4cdc34c1.js";const r=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75"}));const i=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25"}));const n=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":1.5,stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25"}));const a=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"}));const s=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18 18 6M6 6l12 12"}));const l=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m4.5 15.75 7.5-7.5 7.5 7.5"}));const d=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor",class:"size-6"},t("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"m19.5 8.25-7.5 7.5-7.5-7.5"}));const c='*,::before,::after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scroll-snap-strictness:proximity;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(59 130 246 / 0.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;}*,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb;}::before,::after{--tw-content:\'\'}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent;}body{margin:0;line-height:inherit;}hr{height:0;color:inherit;border-top-width:1px;}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse;}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0;}button,select{text-transform:none}button,input:where([type=\'button\']),input:where([type=\'reset\']),input:where([type=\'submit\']){-webkit-appearance:button;background-color:transparent;background-image:none;}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=\'search\']{-webkit-appearance:textfield;outline-offset:-2px;}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af;}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af;}button,[role="button"]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle;}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden="until-found"])){display:none}.btn{margin-inline-end:0.5rem;margin-bottom:0.5rem;border-radius:0.5rem;border-width:1px;padding-top:0.625rem;padding-bottom:0.625rem;padding-left:1.25rem;padding-right:1.25rem;font-size:0.875rem;line-height:1.25rem;font-weight:500}.btn:focus{outline:2px solid transparent;outline-offset:2px}.btn{background-color:var(--button-background-color);color:var(--button-text-color);border-color:var(--button-border-color)}.btn:hover{background-color:var(--button-background-color-hover);color:var(--button-text-color-hover);border-color:var(--button-border-color-hover)}.visible{visibility:visible}.fixed{position:fixed}.bottom-0{bottom:0px}.left-0{left:0px}.left-1\\/2{left:50%}.right-0{right:0px}.top-1\\/2{top:50%}.flex{display:flex}.hidden{display:none}.size-6{width:1.5rem;height:1.5rem}.h-3\\/5{height:60%}.h-5\\/6{height:83.333333%}.w-full{width:100%}.flex-grow{flex-grow:1}.-translate-x-1\\/2{--tw-translate-x:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\\/2{--tw-translate-y:-50%;transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:0.25rem}.overflow-hidden{overflow:hidden}.rounded-lg{border-radius:0.5rem}.rounded-md{border-radius:0.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-none{border-style:none}.border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))}.border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-1\\.5{padding:0.375rem}.px-2{padding-left:0.5rem;padding-right:0.5rem}.py-2{padding-top:0.5rem;padding-bottom:0.5rem}.text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)}.transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms}.duration-200{transition-duration:200ms}:host{--button-background-color:white;--button-background-color-hover:#f3f4f6;--button-text-color:#111827;--button-text-color-hover:#1d4ed8;--button-border-color:#6b7280;--button-border-color-hover:#374151;--chat-z-index:50;display:block}#ocs-chat-window{z-index:var(--chat-z-index)}.iframe-placeholder{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);background-repeat:no-repeat;background-position:center}.hover\\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}@media (min-width: 640px){.sm\\:bottom-5{bottom:1.25rem}.sm\\:left-5{left:1.25rem}.sm\\:right-5{right:1.25rem}.sm\\:block{display:block}.sm\\:hidden{display:none}.sm\\:w-\\[450px\\]{width:450px}}';const h=c;const b=["chatbots.dimagi.com"];const w=class{constructor(t){o(this,t);this.buttonText="Chat";this.visible=false;this.position="right";this.expanded=false;this.loaded=false;this.error=""}componentWillLoad(){this.loaded=this.visible;{try{const t=new URL(this.botUrl);if(!b.includes(t.host)){this.error=`Invalid Bot URL: ${this.botUrl}`}}catch(t){this.error=`Invalid Bot URL: ${this.botUrl}`}}}load(){this.visible=!this.visible;this.loaded=true}setPosition(t){if(t===this.position)return;this.position=t}toggleSize(){this.expanded=!this.expanded}getPositionClasses(){const t=`fixed w-full sm:w-[450px] ${this.expanded?"h-5/6":"h-3/5"} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;const o={left:"left-0 sm:left-5 bottom-0 sm:bottom-5",right:"right-0 sm:right-5 bottom-0 sm:bottom-5",center:"left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2"}[this.position];return`${t} ${o}`}render(){if(this.error){return t(e,null,t("p",null,this.error))}return t(e,null,t("button",{class:"btn",onClick:()=>this.load()},this.buttonText),this.visible&&t("div",{id:"ocs-chat-window",class:this.getPositionClasses()},t("div",{class:"flex justify-between items-center px-2 py-2 border-b border-gray-100"},t("div",{class:"flex gap-1"},t("button",{class:{"hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100":true,"text-blue-600":this.position==="left","text-gray-500":this.position!=="left"},onClick:()=>this.setPosition("left"),"aria-label":"Dock to left",title:"Dock to left"},t(r,null)),t("button",{class:{"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100":true,"text-blue-600":this.position==="center","text-gray-500":this.position!=="center"},onClick:()=>this.setPosition("center"),"aria-label":"Center",title:"Center"},t(a,null)),t("button",{class:{"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100":true,"text-blue-600":this.position==="right","text-gray-500":this.position!=="right"},onClick:()=>this.setPosition("right"),"aria-label":"Dock to right",title:"Dock to right"},t("span",{class:"hidden sm:block"},t(i,null)),t("span",{class:"sm:hidden"},t(n,null)))),t("div",{class:"flex gap-1"},t("button",{class:"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500",onClick:()=>this.toggleSize(),"aria-label":this.expanded?"Collapse":"Expand",title:this.expanded?"Collapse":"Expand"},this.expanded?t(d,null):t(l,null)),t("button",{class:"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500",onClick:()=>this.visible=false,"aria-label":"Close"},t(s,null)))),this.loaded&&t("iframe",{class:"flex-grow w-full border-none iframe-placeholder",src:this.botUrl})))}};w.style=h;export{w as open_chat_studio_widget};
2
+ //# sourceMappingURL=p-c4c7c404.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["ArrowLeftEndOnRectangleIcon","h","xmlns","fill","viewBox","stroke","class","d","ArrowRightEndOnRectangleIcon","ArrowDownOnSquareIcon","ViewfinderCircleIcon","XMarkIcon","ChevronUpIcon","ChevronDownIcon","ocsChatCss","OpenChatStudioWidgetStyle0","allowedHosts","OcsChat","constructor","hostRef","this","buttonText","visible","position","expanded","loaded","error","componentWillLoad","url","URL","botUrl","includes","host","_a","load","setPosition","toggleSize","getPositionClasses","baseClasses","positionClasses","left","right","center","render","Host","onClick","id","title","src"],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n#ocs-chat-window {\n z-index: var(--chat-z-index);\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div id=\"ocs-chat-window\" class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "open-chat-studio-widget",
3
- "version": "0.3.0",
3
+ "version": "0.3.1",
4
4
  "description": "Chat component for Open Chat Studio",
5
5
  "main": "dist/index.cjs.js",
6
6
  "module": "dist/index.js",
@@ -1 +0,0 @@
1
- {"version":3,"names":["ArrowLeftEndOnRectangleIcon","h","xmlns","fill","viewBox","stroke","class","d","ArrowRightEndOnRectangleIcon","ArrowDownOnSquareIcon","ViewfinderCircleIcon","XMarkIcon","ChevronUpIcon","ChevronDownIcon","ocsChatCss","OpenChatStudioWidgetStyle0","allowedHosts","OcsChat","constructor","hostRef","this","buttonText","visible","position","expanded","loaded","error","componentWillLoad","url","URL","botUrl","includes","host","_a","load","setPosition","toggleSize","getPositionClasses","baseClasses","positionClasses","left","right","center","render","Host","onClick","title","src"],"sources":["src/components/ocs-chat/heroicons.tsx","src/components/ocs-chat/ocs-chat.css?tag=open-chat-studio-widget&encapsulation=shadow","src/components/ocs-chat/ocs-chat.tsx"],"sourcesContent":["import {h} from \"@stencil/core\";\n\nexport const ArrowLeftEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\" stroke=\"currentColor\"\n class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M15.75 9V5.25A2.25 2.25 0 0 0 13.5 3h-6a2.25 2.25 0 0 0-2.25 2.25v13.5A2.25 2.25 0 0 0 7.5 21h6a2.25 2.25 0 0 0 2.25-2.25V15M12 9l-3 3m0 0 3 3m-3-3h12.75\"/>\n </svg>;\n}\n\nexport const ArrowRightEndOnRectangleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M8.25 9V5.25A2.25 2.25 0 0 1 10.5 3h6a2.25 2.25 0 0 1 2.25 2.25v13.5A2.25 2.25 0 0 1 16.5 21h-6a2.25 2.25 0 0 1-2.25-2.25V15M12 9l3 3m0 0-3 3m3-3H2.25\"/>\n </svg>;\n}\n\nexport const ArrowDownOnSquareIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width={1.5} stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M9 8.25H7.5a2.25 2.25 0 0 0-2.25 2.25v9a2.25 2.25 0 0 0 2.25 2.25h9a2.25 2.25 0 0 0 2.25-2.25v-9a2.25 2.25 0 0 0-2.25-2.25H15M9 12l3 3m0 0 3-3m-3 3V2.25\" />\n </svg>\n}\n\nexport const ViewfinderCircleIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\"\n d=\"M7.5 3.75H6A2.25 2.25 0 0 0 3.75 6v1.5M16.5 3.75H18A2.25 2.25 0 0 1 20.25 6v1.5m0 9V18A2.25 2.25 0 0 1 18 20.25h-1.5m-9 0H6A2.25 2.25 0 0 1 3.75 18v-1.5M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z\"/>\n </svg>;\n}\n\nexport const XMarkIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18 18 6M6 6l12 12\"/>\n </svg>;\n}\n\nexport const ChevronUpIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m4.5 15.75 7.5-7.5 7.5 7.5\"/>\n </svg>;\n}\n\nexport const ChevronDownIcon = () => {\n return <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke-width=\"1.5\"\n stroke=\"currentColor\" class=\"size-6\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"m19.5 8.25-7.5 7.5-7.5-7.5\"/>\n </svg>;\n}\n","@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n:host {\n /**\n * @prop --button-background-color: Button background color\n * @prop --button-background-color-hover: Button background color on hover\n * @prop --button-text-color: Button text color\n * @prop --button-text-color-hover: Button text color on hover\n * @prop --button-border-color: Button border color\n * @prop --button-border-color-hover: Button border color on hover\n */\n --button-background-color: white;\n /* gray-100 */\n --button-background-color-hover: #f3f4f6;\n /* gray-900 */\n --button-text-color: #111827;\n /* blue-700 */\n --button-text-color-hover: #1d4ed8;\n /* gray-500 */\n --button-border-color: #6b7280;\n /* gray-700 */\n --button-border-color-hover: #374151;\n --chat-z-index: 50;\n\n display: block;\n z-index: var(--chat-z-index);\n}\n\n/* These custom button styles need to remain since they use CSS variables */\n\n@layer components {\n .btn {\n @apply py-2.5 px-5 me-2 mb-2 text-sm font-medium focus:outline-none rounded-lg border;\n background-color: var(--button-background-color);\n color: var(--button-text-color);\n border-color: var(--button-border-color);\n }\n\n .btn:hover {\n background-color: var(--button-background-color-hover);\n color: var(--button-text-color-hover);\n border-color: var(--button-border-color-hover);\n }\n}\n\n.iframe-placeholder {\n /*loading-dots*/\n background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0nMjQnIGhlaWdodD0nMjQnIHZpZXdCb3g9JzAgMCAyNCAyNCcgeG1sbnM9J2h0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnJz48c3R5bGU+LnNwaW5uZXJfcU04M3thbmltYXRpb246c3Bpbm5lcl84SFFHIDEuMDVzIGluZmluaXRlfS5zcGlubmVyX29YUHJ7YW5pbWF0aW9uLWRlbGF5Oi4xc30uc3Bpbm5lcl9aVExme2FuaW1hdGlvbi1kZWxheTouMnN9QGtleWZyYW1lcyBzcGlubmVyXzhIUUd7MCUsNTcuMTQle2FuaW1hdGlvbi10aW1pbmctZnVuY3Rpb246Y3ViaWMtYmV6aWVyKDAuMzMsLjY2LC42NiwxKTt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfTI4LjU3JXthbmltYXRpb24tdGltaW5nLWZ1bmN0aW9uOmN1YmljLWJlemllcigwLjMzLDAsLjY2LC4zMyk7dHJhbnNmb3JtOnRyYW5zbGF0ZVkoLTZweCl9MTAwJXt0cmFuc2Zvcm06dHJhbnNsYXRlKDApfX08L3N0eWxlPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MycgY3g9JzQnIGN5PScxMicgcj0nMycvPjxjaXJjbGUgY2xhc3M9J3NwaW5uZXJfcU04MyBzcGlubmVyX29YUHInIGN4PScxMicgY3k9JzEyJyByPSczJy8+PGNpcmNsZSBjbGFzcz0nc3Bpbm5lcl9xTTgzIHNwaW5uZXJfWlRMZicgY3g9JzIwJyBjeT0nMTInIHI9JzMnLz48L3N2Zz4=);\n background-repeat: no-repeat;\n background-position: center;\n}\n","import { Component, Host, h, Prop, State, Build } from '@stencil/core';\nimport {\n ArrowLeftEndOnRectangleIcon,\n ArrowRightEndOnRectangleIcon,\n ArrowDownOnSquareIcon,\n ViewfinderCircleIcon,\n XMarkIcon,\n ChevronDownIcon,\n ChevronUpIcon,\n} from './heroicons';\n\nconst allowedHosts = [\"chatbots.dimagi.com\"];\n\n@Component({\n tag: 'open-chat-studio-widget',\n styleUrl: 'ocs-chat.css',\n shadow: true,\n})\nexport class OcsChat {\n\n /**\n * The URL of the bot to connect to.\n */\n @Prop() botUrl!: string;\n\n /**\n * The text to display on the button.\n */\n @Prop() buttonText: string = \"Chat\";\n\n /**\n * Whether the chat widget is visible on load.\n */\n @Prop({ mutable: true }) visible: boolean = false;\n\n /**\n * The initial position of the chat widget on the screen.\n */\n @Prop({ mutable: true }) position: 'left' | 'center' | 'right' = 'right';\n\n /**\n * Whether the chat widget is initially expanded.\n */\n @Prop({ mutable: true }) expanded: boolean = false;\n\n @State() loaded: boolean = false;\n @State() error: string = \"\";\n\n componentWillLoad() {\n this.loaded = this.visible;\n if (!Build.isDev) {\n try {\n const url = new URL(this.botUrl);\n if (!allowedHosts.includes(url.host)) {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n } catch {\n this.error = `Invalid Bot URL: ${this.botUrl}`;\n }\n }\n }\n\n load() {\n this.visible = !this.visible;\n this.loaded = true;\n }\n\n setPosition(position: 'left' | 'center' | 'right') {\n if (position === this.position) return;\n this.position = position;\n }\n\n toggleSize() {\n this.expanded = !this.expanded;\n }\n\n getPositionClasses() {\n const baseClasses = `fixed w-full sm:w-[450px] ${this.expanded ? 'h-5/6' : 'h-3/5'} bg-white border border-gray-200 shadow-lg rounded-lg overflow-hidden flex flex-col`;\n\n const positionClasses = {\n left: 'left-0 sm:left-5 bottom-0 sm:bottom-5',\n right: 'right-0 sm:right-5 bottom-0 sm:bottom-5',\n center: 'left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2'\n }[this.position];\n\n return `${baseClasses} ${positionClasses}`;\n }\n\n render() {\n if (this.error) {\n return (\n <Host>\n <p>{this.error}</p>\n </Host>\n );\n }\n\n return (\n <Host>\n <button class=\"btn\" onClick={() => this.load()}>{this.buttonText}</button>\n {this.visible && (\n <div class={this.getPositionClasses()}>\n <div class=\"flex justify-between items-center px-2 py-2 border-b border-gray-100\">\n <div class=\"flex gap-1\">\n <button\n class={{\n 'hidden sm:block p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'left',\n 'text-gray-500': this.position !== 'left'\n }}\n onClick={() => this.setPosition('left')}\n aria-label=\"Dock to left\"\n title=\"Dock to left\"\n >\n <ArrowLeftEndOnRectangleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'center',\n 'text-gray-500': this.position !== 'center'\n }}\n onClick={() => this.setPosition('center')}\n aria-label=\"Center\"\n title=\"Center\"\n >\n <ViewfinderCircleIcon/>\n </button>\n <button\n class={{\n 'p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100': true,\n 'text-blue-600': this.position === 'right',\n 'text-gray-500': this.position !== 'right'\n }}\n onClick={() => this.setPosition('right')}\n aria-label=\"Dock to right\"\n title=\"Dock to right\"\n >\n <span class=\"hidden sm:block\"><ArrowRightEndOnRectangleIcon/></span>\n <span class=\"sm:hidden\"><ArrowDownOnSquareIcon/></span>\n </button>\n </div>\n <div class=\"flex gap-1\">\n <button\n class=\"p-1.5 rounded-md transition-colors duration-200 hover:bg-gray-100 text-gray-500\"\n onClick={() => this.toggleSize()}\n aria-label={this.expanded ? \"Collapse\" : \"Expand\"}\n title={this.expanded ? \"Collapse\" : \"Expand\"}\n >\n {this.expanded ? <ChevronDownIcon/> : <ChevronUpIcon/>}\n </button>\n <button\n class=\"p-1.5 hover:bg-gray-100 rounded-md transition-colors duration-200 text-gray-500\"\n onClick={() => this.visible = false}\n aria-label=\"Close\"\n >\n <XMarkIcon/>\n </button>\n </div>\n </div>\n {this.loaded && (\n <iframe\n class=\"flex-grow w-full border-none iframe-placeholder\"\n src={this.botUrl}\n ></iframe>\n )}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}