@appbaseio/reactivesearch-vue 3.0.0-rc.3 → 3.0.0-rc.5.alpha.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.
- package/dist/@appbaseio/reactivesearch-vue.umd.js +560 -7200
- package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js +5 -5
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
- package/dist/cjs/{Button-9e179864.js → Button-d4da7470.js} +6 -13
- package/dist/cjs/{ComponentWrapper-0b9ffb1a.js → ComponentWrapper-9146d811.js} +0 -3
- package/dist/cjs/{DropDown-aef75c14.js → DropDown-b16418e9.js} +4 -7
- package/dist/cjs/DynamicRangeSlider.js +1 -1
- package/dist/cjs/{Input-56eba499.js → Input-497be42a.js} +1 -71
- package/dist/cjs/MultiDropdownList.js +5 -6
- package/dist/cjs/MultiList.js +3 -3
- package/dist/cjs/MultiRange.js +2 -2
- package/dist/cjs/{Pagination-58a0cf3f.js → Pagination-b953a80a.js} +2 -2
- package/dist/cjs/RangeInput.js +3 -3
- package/dist/cjs/RangeSlider.js +2 -2
- package/dist/cjs/ReactiveBase.js +4 -4
- package/dist/cjs/ReactiveComponent.js +2 -2
- package/dist/cjs/ReactiveGoogleMap.js +5 -6
- package/dist/cjs/ReactiveList.js +4 -4
- package/dist/cjs/ResultCard.js +1 -1
- package/dist/cjs/ResultList.js +1 -1
- package/dist/cjs/SelectedFilters.js +2 -3
- package/dist/cjs/SingleDropdownList.js +5 -6
- package/dist/cjs/SingleList.js +3 -3
- package/dist/cjs/SingleRange.js +2 -2
- package/dist/cjs/ToggleButton.js +3 -4
- package/dist/cjs/index.js +8 -11
- package/dist/cjs/{install-b495bb2c.js → install-7cdf6798.js} +158 -1301
- package/dist/cjs/install.js +7 -9
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/{vueTypes-a5f1745e.js → vueTypes-1bf00978.js} +0 -18
- package/dist/es/{Button-c2ff5178.js → Button-fd869491.js} +6 -13
- package/dist/es/{ComponentWrapper-a2635cfc.js → ComponentWrapper-8a3c388d.js} +0 -3
- package/dist/es/{DropDown-39fedff8.js → DropDown-fc1fef02.js} +4 -7
- package/dist/es/DynamicRangeSlider.js +1 -1
- package/dist/es/{Input-11d211d2.js → Input-f7499ef8.js} +2 -71
- package/dist/es/MultiDropdownList.js +5 -6
- package/dist/es/MultiList.js +3 -3
- package/dist/es/MultiRange.js +2 -2
- package/dist/es/{Pagination-ae401c33.js → Pagination-c2745bec.js} +2 -2
- package/dist/es/RangeInput.js +3 -3
- package/dist/es/RangeSlider.js +2 -2
- package/dist/es/ReactiveBase.js +4 -4
- package/dist/es/ReactiveComponent.js +2 -2
- package/dist/es/ReactiveGoogleMap.js +5 -6
- package/dist/es/ReactiveList.js +4 -4
- package/dist/es/ResultCard.js +1 -1
- package/dist/es/ResultList.js +1 -1
- package/dist/es/SelectedFilters.js +2 -3
- package/dist/es/SingleDropdownList.js +5 -6
- package/dist/es/SingleList.js +3 -3
- package/dist/es/SingleRange.js +2 -2
- package/dist/es/ToggleButton.js +3 -4
- package/dist/es/index.js +9 -11
- package/dist/es/{install-6011bce3.js → install-0c7962bc.js} +164 -1306
- package/dist/es/install.js +7 -9
- package/dist/es/version.js +1 -1
- package/dist/es/{vueTypes-09cab4d3.js → vueTypes-f1923c72.js} +0 -18
- package/package.json +6 -8
|
@@ -1,32 +1,28 @@
|
|
|
1
1
|
import { helper, Actions, causes } from '@appbaseio/reactivecore';
|
|
2
|
-
import { SEARCH_COMPONENTS_MODES, componentTypes,
|
|
2
|
+
import { SEARCH_COMPONENTS_MODES, componentTypes, TREELIST_VALUES_PATH_SEPARATOR } from '@appbaseio/reactivecore/lib/utils/constants';
|
|
3
3
|
import _transformOn from '@vue/babel-helper-vue-transform-on';
|
|
4
|
-
import { _ as _taggedTemplateLiteralLoose, a as _extends
|
|
5
|
-
import { createVNode, createTextVNode, defineComponent,
|
|
4
|
+
import { _ as _taggedTemplateLiteralLoose, a as _extends } from './_rollupPluginBabelHelpers-ded08042.js';
|
|
5
|
+
import { createVNode, createTextVNode, defineComponent, isVNode, mergeProps, h } from 'vue';
|
|
6
6
|
import VueTypes from 'vue-types';
|
|
7
|
-
import { getQueryOptions,
|
|
7
|
+
import { getQueryOptions, suggestionTypes, recLookup, getClassName as getClassName$2, updateCustomQuery as updateCustomQuery$1, updateDefaultQuery as updateDefaultQuery$1, transformTreeListLocalStateIntoQueryComptaibleFormat, isEqual as isEqual$1, transformRawTreeListData, setDeep, getComponent as getComponent$1, getOptionsFromQuery, checkValueChange as checkValueChange$1, getAggsQuery, updateInternalQuery, isFunction as isFunction$1 } from '@appbaseio/reactivecore/lib/utils/helper';
|
|
8
8
|
import { styled, createGlobalStyle } from '@appbaseio/vue-emotion';
|
|
9
|
-
import { css
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import { t as types } from './vueTypes-09cab4d3.js';
|
|
9
|
+
import { css } from '@emotion/css';
|
|
10
|
+
import { B as Button } from './Button-fd869491.js';
|
|
11
|
+
import { t as types } from './vueTypes-f1923c72.js';
|
|
13
12
|
import { RLConnected as ReactiveList } from './ReactiveList.js';
|
|
14
13
|
import { getInternalComponentID } from '@appbaseio/reactivecore/lib/utils/transform';
|
|
15
14
|
import { g as getComponent, h as hasCustomRenderer, f as decodeHtml, i as isQueryIdentical, u as updateDefaultQuery, j as updateCustomQuery, a as isFunction, k as isEmpty, p as parseFocusShortcuts, l as extractModifierKeysFromFocusShortcuts, c as connect } from './index-882489e1.js';
|
|
16
|
-
import { C as ComponentWrapper } from './ComponentWrapper-
|
|
15
|
+
import { C as ComponentWrapper } from './ComponentWrapper-8a3c388d.js';
|
|
17
16
|
import { P as PreferencesConsumer } from './PreferencesConsumer-b058d14e.js';
|
|
18
17
|
import { T as Title } from './Title-863dfa42.js';
|
|
19
18
|
import { L as ListItem } from './ListItem-e3c6acf4.js';
|
|
20
19
|
import { F as Flex } from './Flex-25792bc3.js';
|
|
21
|
-
import { recordAISessionUsefulness } from '@appbaseio/reactivecore/lib/actions/analytics';
|
|
22
20
|
import ReactiveBase from './ReactiveBase.js';
|
|
23
21
|
import hotkeys from 'hotkeys-js';
|
|
24
|
-
import {
|
|
25
|
-
import {
|
|
26
|
-
import { n as noSuggestions, T as TextArea, I as Input, s as suggestionsContainer, a as suggestions } from './Input-11d211d2.js';
|
|
22
|
+
import { I as IconWrapper, C as CancelSvg, a as IconGroup, D as Downshift, b as InputWrapper } from './DropDown-fc1fef02.js';
|
|
23
|
+
import { n as noSuggestions, s as suggestionsContainer, I as Input, a as suggestions } from './Input-f7499ef8.js';
|
|
27
24
|
import { C as Container } from './Container-d00219f7.js';
|
|
28
25
|
import Highlight from 'vue-highlight-words';
|
|
29
|
-
import { fetchAIResponse } from '@appbaseio/reactivecore/lib/actions/query';
|
|
30
26
|
import { replaceDiacritics } from '@appbaseio/reactivecore/lib/utils/suggestions';
|
|
31
27
|
import { C as Checkbox, R as Radio } from './FormControlList-fe6eaee4.js';
|
|
32
28
|
import { s as sanitizeObject } from './utils-d7dd4f4e.js';
|
|
@@ -48,7 +44,7 @@ import ResultList from './ResultList.js';
|
|
|
48
44
|
import StateProvider from './StateProvider.js';
|
|
49
45
|
|
|
50
46
|
var _templateObject;
|
|
51
|
-
var InputGroup = styled('div')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n
|
|
47
|
+
var InputGroup = styled('div')(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: stretch;\n width: 100%;\n"])));
|
|
52
48
|
InputGroup.defaultProps = {
|
|
53
49
|
className: 'input-group'
|
|
54
50
|
};
|
|
@@ -756,305 +752,9 @@ var _templateObject$7, _templateObject2;
|
|
|
756
752
|
var TagsContainer = styled('div')(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tmargin-top: 10px;\n\twidth: 100%;\n"])));
|
|
757
753
|
var TagItem = styled('span')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n\tcursor: default;\n\tbox-sizing: border-box;\n\tmargin: 0 4px 4px 0;\n\tcolor: #000000d9;\n\tfont-size: 14px;\n\tfont-variant: tabular-nums;\n\tline-height: 1.5715;\n\tlist-style: none;\n\tfont-feature-settings: 'tnum';\n\tdisplay: inline-block;\n\theight: auto;\n\tpadding: 0 2px 0 7px;\n\tfont-size: 12px;\n\tline-height: 22px;\n\twhite-space: nowrap;\n\tbackground: #fafafa;\n\tborder: 1px solid #d9d9d9;\n\tborder-radius: 2px;\n\topacity: 1;\n\ttransition: all 0.3s;\n\n\tspan.close-icon {\n\t\tsvg {\n\t\t\tcursor: pointer;\n\t\t\theight: 15px;\n\t\t\tposition: relative;\n\t\t\ttop: 4px;\n\t\t\tfill: #262626;\n\t\t}\n\t}\n"])));
|
|
758
754
|
|
|
759
|
-
var _templateObject$8, _templateObject2$1, _templateObject3;
|
|
760
|
-
var skeletonAnimation = keyframes(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n 0% {\n background-position: 100% 0;\n }\n 100% {\n background-position: -200% 0;\n }\n"])));
|
|
761
|
-
var SkeletonLoader = styled('div')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 10px;\n"])));
|
|
762
|
-
var SkeletonLine = styled('div')(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n\twidth: 100%;\n\theight: 20px;\n\tbackground: linear-gradient(\n\t\t90deg,\n\t\trgba(220, 220, 220, 0.5) 25%,\n\t\trgba(240, 240, 240, 0.9) 50%,\n\t\trgba(220, 220, 220, 0.5) 75%\n\t);\n\tbackground-size: 200% 100%;\n\tanimation: ", " 1.5s infinite;\n"])), skeletonAnimation);
|
|
763
|
-
var HorizontalSkeletonLoader = defineComponent({
|
|
764
|
-
name: 'HorizontalSkeletonLoader',
|
|
765
|
-
render: function render() {
|
|
766
|
-
return createVNode(SkeletonLoader, null, {
|
|
767
|
-
"default": function _default() {
|
|
768
|
-
return [createVNode(SkeletonLine, null, null), createVNode(SkeletonLine, null, null), createVNode(SkeletonLine, null, null), createVNode(SkeletonLine, null, null)];
|
|
769
|
-
}
|
|
770
|
-
});
|
|
771
|
-
}
|
|
772
|
-
});
|
|
773
|
-
|
|
774
|
-
var _templateObject$9, _templateObject2$2, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
775
|
-
var Chatbox = styled('div')(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose(["\n\tposition: relative;\n\tmargin: 0 auto;\n\tpadding: 10px;\n\tbackground-color: #fafafa;\n\twidth: 100%;\n\tbox-shadow: rgb(0 0 0 / 20%) 0px 0px 6px;\n\tborder-radius: 6px;\n\tmargin-bottom: 20px;\n\tbackground-color: ", ";\n"])), function (props) {
|
|
776
|
-
return props.theme && props.theme.colors ? props.theme.colors.backgroundColor : '#fff';
|
|
777
|
-
});
|
|
778
|
-
var ChatContainer = styled('div')(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n\tposition: relative;\n\t.--ai-answer-error-container {\n\t\ttext-align: center;\n\t\tposition: absolute;\n\t\tbottom: 0px;\n\t\t", ";\n\t\tz-index: 1;\n\t\tleft: 50%;\n\t\ttransform: translateX(-50%);\n\t\twidth: 100%;\n\n\t\t.--default-error-element {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tpadding: 10px;\n\t\t\tbackground-color: ", ";\n\t\t\tbox-shadow: 0 -5px 5px -2px\n\t\t\t\t", ";\n\n\t\t\tspan {\n\t\t\t\tmargin-bottom: 5px;\n\t\t\t}\n\n\t\t\tbutton {\n\t\t\t}\n\t\t}\n\t}\n\n\t", ";\n"])), function (props) {
|
|
779
|
-
return props.showInput ? 'bottom: 48px;' : '';
|
|
780
|
-
}, function (props) {
|
|
781
|
-
return props.theme && props.theme.colors && props.theme.colors.backgroundColor ? props.theme.colors.backgroundColor : '#fff';
|
|
782
|
-
}, function (props) {
|
|
783
|
-
return props.theme && props.theme.colors && props.theme.colors.backgroundColor ? props.theme.colors.backgroundColor : '#fff';
|
|
784
|
-
}, function (props) {
|
|
785
|
-
return props.showInput ? ".--ai-answer-feedback-container {\n\t\tmargin-top: 15px;\n\t\tmargin-bottom: -10px;\n\t}" : ".--ai-answer-feedback-container {\n\t\tmargin-top: 4px;\n\t}";
|
|
786
|
-
});
|
|
787
|
-
var MessagesContainer = styled('div')(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n\tmax-height: 400px;\n overflow-y: auto;\n\tpadding: 10px;\n\tdisplay: flex;\n\tflex-direction: column;\n\tmin-height: 200px;\n\n}};\n"])));
|
|
788
|
-
var typingDots = keyframes(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n 0% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(-70%);\n }\n 100% {\n transform: translateY(0);\n }\n"])));
|
|
789
|
-
var TypingIndicator = styled('div')(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin: 5px !important;\n"])));
|
|
790
|
-
var TypingDot = styled('div')(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n\twidth: 6px;\n\theight: 6px;\n\tbackground-color: ", ";\n\tborder-radius: 50%;\n\tmargin: 0 2px !important;\n\tanimation: ", " 1s infinite;\n\t&:nth-child(2) {\n\t\tanimation-delay: 0.2s;\n\t}\n\t&:nth-child(3) {\n\t\tanimation-delay: 0.4s;\n\t}\n"])), function (props) {
|
|
791
|
-
var finalColor;
|
|
792
|
-
if (props.isSender) {
|
|
793
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor;
|
|
794
|
-
} else {
|
|
795
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.borderColor : props.theme.colors.textColor;
|
|
796
|
-
}
|
|
797
|
-
return finalColor;
|
|
798
|
-
}, typingDots);
|
|
799
|
-
var resetCSS = function resetCSS(props) {
|
|
800
|
-
return "\n\thtml,\n\tbody,\n\tdiv,\n\tspan,\n\tapplet,\n\tobject,\n\tiframe,\n\th1,\n\th2,\n\th3,\n\th4,\n\th5,\n\th6,\n\tp,\n\tblockquote,\n\tpre,\n\ta,\n\tabbr,\n\tacronym,\n\taddress,\n\tbig,\n\tcite,\n\tcode,\n\tdel,\n\tdfn,\n\tem,\n\timg,\n\tins,\n\tkbd,\n\tq,\n\ts,\n\tsamp,\n\tsmall,\n\tstrike,\n\tstrong,\n\tsub,\n\tsup,\n\ttt,\n\tvar,\n\tb,\n\tu,\n\ti,\n\tcenter,\n\tdl,\n\tdt,\n\tdd,\n\tol,\n\tul,\n\tli,\n\tfieldset,\n\tform,\n\tlabel,\n\tlegend,\n\ttable,\n\tcaption,\n\ttbody,\n\ttfoot,\n\tthead,\n\ttr,\n\tth,\n\ttd,\n\tarticle,\n\taside,\n\tcanvas,\n\tdetails,\n\tembed,\n\tfigure,\n\tfigcaption,\n\tfooter,\n\theader,\n\thgroup,\n\tmenu,\n\tnav,\n\toutput,\n\truby,\n\tsection,\n\tsummary,\n\ttime,\n\tmark,\n\taudio,\n\tvideo {\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\tborder: 0;\n\t\tfont-size: 100%;\n\t\tfont: inherit;\n\t\tvertical-align: baseline;\n\t\toverflow-wrap: anywhere;\n\t}\n\tpre {\n\t\tmargin: 10px auto;\n\t}\n\ttable {\n\t\tmargin: 10px auto;\n\t\tborder-collapse: collapse;\n\t\tborder-spacing: 0;\n\t}\n\ttr {\n\t\tborder-bottom: 1px solid #ccc;\n\t}\n\tth,\n\ttd {\n\t\ttext-align: left;\n\t\tpadding: 4px;\n\t\tborder: 1px solid;\n\t\tborder-collapse: collapse;\n\t}\n\tpre,\n\tcode {\n\t\tpadding: 0.6em 0.4em;\n\t\tbackground: " + (
|
|
801
|
-
// eslint-disable-next-line no-nested-ternary
|
|
802
|
-
props.isSender ? props.themePreset !== 'dark' ? props.theme.colors.primaryColor : props.theme.colors.borderColor : props.theme.colors.borderColor) + ";\n\t}\n\n\tcode {\n\t\tline-height: normal;\n\n\t\tcolor: " + (
|
|
803
|
-
// eslint-disable-next-line no-nested-ternary
|
|
804
|
-
props.isSender ? props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor : props.theme.colors.primaryTextColor) + ";\n\t\tborder-radius: 3px;\n\t\tfont-size: 85%;\n\t\tpadding: 0.2em 0.4em;\n\t\tmargin-top: 5px;\n\t\tdisplay: inline-block;\n\t\toverflow: auto;\n\t\twidth: fit-content;\n\t\tmax-width: 100%;\n\t}\n\tul,\n\tol {\n\t\tlist-style-position: inside;\n\n\t}\n\n\tli{\n\t\tdisplay: unset;\n\t\tcursor: default;\n\t\tpadding: initial;\n\n\t\t&:hover{\n\t\t\tbackground-color: initial;\n\t\t}\n\t}\n";
|
|
805
|
-
};
|
|
806
|
-
var messageBGColor = function messageBGColor(props) {
|
|
807
|
-
var finalBGColor;
|
|
808
|
-
if (props.isSender) {
|
|
809
|
-
finalBGColor = props.themePreset !== 'dark' ? props.theme.colors.primaryColor : props.theme.colors.borderColor;
|
|
810
|
-
} else {
|
|
811
|
-
finalBGColor = props.themePreset !== 'dark' ? lighten(0.53, props.theme.colors.borderColor) : props.theme.colors.backgroundColor;
|
|
812
|
-
}
|
|
813
|
-
return finalBGColor;
|
|
814
|
-
};
|
|
815
|
-
var Message = styled('div')(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n\tbackground-color: ", ";\n\tcolor: ", ";\n\tborder: 1px solid\n\t\t", ";\n\tpadding: 10px;\n\tborder-radius: 7px;\n\tmargin-bottom: 10px;\n\tmax-width: 80%;\n\talign-self: ", ";\n\tdisplay: inline-block;\n\tposition: relative;\n\toverflow-wrap: anywhere;\n\t", "\n"])), function (props) {
|
|
816
|
-
return messageBGColor(props);
|
|
817
|
-
}, function (props) {
|
|
818
|
-
var finalColor;
|
|
819
|
-
if (props.isSender) {
|
|
820
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor;
|
|
821
|
-
} else {
|
|
822
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.borderColor : props.theme.colors.textColor;
|
|
823
|
-
}
|
|
824
|
-
return finalColor;
|
|
825
|
-
}, function (props) {
|
|
826
|
-
return props.themePreset === 'dark' ? 'currentColor' : messageBGColor(props);
|
|
827
|
-
}, function (props) {
|
|
828
|
-
return props.isSender ? 'flex-end' : 'flex-start';
|
|
829
|
-
}, function (props) {
|
|
830
|
-
return resetCSS(props);
|
|
831
|
-
});
|
|
832
|
-
var MessageInputContainer = styled('form')(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tpadding-top: 12px;\n\talign-items: stretch;\n\tmargin-top: 10px;\n\t.ai-enter-button-wrapper {\n\t\talign-self: baseline;\n\t\theight: 41px;\n\t}\n"])));
|
|
833
|
-
var MessageInput = styled(TextArea)(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n\twidth: 100%;\n\tborder-radius: 5px;\n\tborder: 1px solid #ccc;\n\tbackground-color: ", ";\n\tcolor: ", ";\n\n\t::placeholder {\n\t\tcolor: ", ";\n\t}\n\n\t:-ms-input-placeholder {\n\t\tcolor: ", ";\n\t}\n\n\t::-ms-input-placeholder {\n\t\tcolor: ", ";\n\t}\n\t", "\n"])), function (props) {
|
|
834
|
-
return props.themePreset === 'dark' ? props.theme.colors.borderColor : '#fff';
|
|
835
|
-
}, function (props) {
|
|
836
|
-
return props.themePreset === 'dark' ? props.theme.colors.titleColor : props.theme.colors.textColor;
|
|
837
|
-
}, function (props) {
|
|
838
|
-
return props.theme.colors.textColor;
|
|
839
|
-
}, function (props) {
|
|
840
|
-
return props.theme.colors.textColor;
|
|
841
|
-
}, function (props) {
|
|
842
|
-
return props.theme.colors.textColor;
|
|
843
|
-
}, function (_ref) {
|
|
844
|
-
var enterButton = _ref.enterButton;
|
|
845
|
-
return enterButton && "\n\t\t border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\t";
|
|
846
|
-
});
|
|
847
|
-
var SendButton = styled(Button)(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n\tborder: none;\n\tcolor: #ffffff;\n\tcursor: pointer;\n\tfont-size: 16px;\n\tmargin-left: 8px;\n\toutline: none;\n\tpadding: 10px;\n\ttext-align: center;\n"])));
|
|
848
|
-
var AIFeedbackContainer = styled('div')(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n\t.--feedback-svgs-wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: flex-end;\n\t\tgap: 5px;\n\n\t\tsvg {\n\t\t\tcursor: pointer;\n\t\t\ttransition: all ease-in 0.1s;\n\t\t\t&.selected {\n\t\t\t\ttransform: scale(1.1);\n\t\t\t\tcursor: default;\n\t\t\t}\n\n\t\t\t&:hover {\n\t\t\t\ttransform: scale(1.1);\n\t\t\t}\n\t\t}\n\t}\n\n\t.--feedback-input-wrapper {\n\t\tdisplay: flex;\n\t\tgap: 7px;\n\t}\n"])));
|
|
849
|
-
|
|
850
|
-
var _templateObject$a, _templateObject2$3, _templateObject3$2, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1;
|
|
851
|
-
var fadeInFromBottom = keyframes(_templateObject$a || (_templateObject$a = _taggedTemplateLiteralLoose(["\n 0% {\n opacity: 0;\n transform: translateY(20px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"])));
|
|
852
|
-
var fadeInFromTop = keyframes(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n 0% {\n opacity: 0;\n transform: translateY(-20px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"])));
|
|
853
|
-
var SearchBoxAISection = styled('div')(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n\tpadding: 10px;\n\tborder-radius: 4px;\n\tmin-height: 200px;\n\tpadding-top: 20px;\n\tposition: relative;\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n\tbackground-color: ", ";\n\tcolor: ", ";\n\t.--ai-answer-error-container {\n\t\tposition: absolute;\n\t\ttop: 50%;\n\t\tleft: 50%;\n\t\ttransform: translate(-50%, -50%);\n\t\t.--default-error-element {\n\t\t\tdisplay: flex;\n\t\t\tflex-direction: column;\n\t\t\talign-items: center;\n\t\t\tgap: 10px;\n\t\t}\n\t}\n"])), function (_ref) {
|
|
854
|
-
var themePreset = _ref.themePreset,
|
|
855
|
-
theme = _ref.theme;
|
|
856
|
-
return themePreset === 'dark' ? '#424242' : theme.colors.backgroundColor;
|
|
857
|
-
}, function (_ref2) {
|
|
858
|
-
var theme = _ref2.theme;
|
|
859
|
-
return theme.colors.textColor;
|
|
860
|
-
});
|
|
861
|
-
var Question = styled('div')(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n\tfont-weight: bold;\n\tmargin-bottom: 5px;\n\tanimation: ", " 0.5s ease-out;\n"])), fadeInFromTop);
|
|
862
|
-
var Answer = styled('div')(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n\t", "\n\tposition: relative;\n\tmargin-bottom: 5px;\n\tmin-height: 100px;\n\toverflow: auto;\n\twhite-space: pre-wrap;\n\tpre {\n\t\twhite-space: pre-wrap;\n\t}\n\tcode,\n\tpre {\n\t\tdisplay: revert;\n\t}\n"])), function (props) {
|
|
863
|
-
return resetCSS(props);
|
|
864
|
-
});
|
|
865
|
-
var Footer = styled('div')(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n\tcolor: #777;\n\tdisplay: inline-flex;\n\talign-items: center;\n\tgap: 1rem;\n\tflex-wrap: wrap;\n\tanimation: ", " 0.5s ease-out;\n\tpadding: 10px 0;\n\tbackground: white;\n\tbackground-color: ", ";\n\tcolor: ", ";\n"])), fadeInFromBottom, function (_ref3) {
|
|
866
|
-
var themePreset = _ref3.themePreset,
|
|
867
|
-
theme = _ref3.theme;
|
|
868
|
-
return themePreset === 'dark' ? '#424242' : theme.colors.backgroundColor;
|
|
869
|
-
}, function (_ref4) {
|
|
870
|
-
var theme = _ref4.theme;
|
|
871
|
-
return theme.colors.textColor;
|
|
872
|
-
});
|
|
873
|
-
var SourceTags = styled('div')(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tgap: 8px;\n\tflex-wrap: wrap;\n\t.--ai-source-tag {\n\t\tdisplay: inline-block;\n\t\tmax-width: 200px;\n\t\twhite-space: nowrap;\n\t\toverflow: hidden;\n\t\ttext-overflow: ellipsis;\n\t}\n"])));
|
|
874
|
-
|
|
875
|
-
var ThumbsUpSvg = {
|
|
876
|
-
name: 'ThumbsUpSvg',
|
|
877
|
-
props: ['clickHandler', 'className'],
|
|
878
|
-
render: function render() {
|
|
879
|
-
return createVNode("svg", {
|
|
880
|
-
"stroke": "currentColor",
|
|
881
|
-
"fill": "none",
|
|
882
|
-
"strokeWidth": "2",
|
|
883
|
-
"viewBox": "0 0 24 24",
|
|
884
|
-
"strokeLinecap": "round",
|
|
885
|
-
"strokeLinejoin": "round",
|
|
886
|
-
"class": this.$props.className,
|
|
887
|
-
"height": "1em",
|
|
888
|
-
"width": "1em",
|
|
889
|
-
"xmlns": "http://www.w3.org/2000/svg",
|
|
890
|
-
"onClick": this.$props.clickHandler
|
|
891
|
-
}, [createVNode("path", {
|
|
892
|
-
"d": "M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3"
|
|
893
|
-
}, null)]);
|
|
894
|
-
}
|
|
895
|
-
};
|
|
896
|
-
|
|
897
|
-
var ThumbsDownSvg = {
|
|
898
|
-
name: 'ThumbsDownSvg',
|
|
899
|
-
props: ['clickHandler', 'className'],
|
|
900
|
-
render: function render() {
|
|
901
|
-
return createVNode("svg", {
|
|
902
|
-
"stroke": "currentColor",
|
|
903
|
-
"fill": "none",
|
|
904
|
-
"strokeWidth": "2",
|
|
905
|
-
"viewBox": "0 0 24 24",
|
|
906
|
-
"strokeLinecap": "round",
|
|
907
|
-
"strokeLinejoin": "round",
|
|
908
|
-
"class": this.$props.className,
|
|
909
|
-
"height": "1em",
|
|
910
|
-
"width": "1em",
|
|
911
|
-
"xmlns": "http://www.w3.org/2000/svg",
|
|
912
|
-
"onClick": this.$props.clickHandler
|
|
913
|
-
}, [createVNode("path", {
|
|
914
|
-
"d": "M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17"
|
|
915
|
-
}, null), ' ']);
|
|
916
|
-
}
|
|
917
|
-
};
|
|
918
|
-
|
|
919
|
-
var AIFeedback = defineComponent({
|
|
920
|
-
name: 'FeedbackComponent',
|
|
921
|
-
props: {
|
|
922
|
-
onFeedbackSubmit: {
|
|
923
|
-
type: Function,
|
|
924
|
-
"default": function _default() {}
|
|
925
|
-
},
|
|
926
|
-
hideUI: {
|
|
927
|
-
type: Boolean,
|
|
928
|
-
"default": false
|
|
929
|
-
},
|
|
930
|
-
overrideState: {
|
|
931
|
-
type: Object,
|
|
932
|
-
"default": function _default() {
|
|
933
|
-
return {};
|
|
934
|
-
}
|
|
935
|
-
}
|
|
936
|
-
},
|
|
937
|
-
setup: function setup(props, _ref) {
|
|
938
|
-
var emit = _ref.emit;
|
|
939
|
-
var showInput = ref(false);
|
|
940
|
-
var feedbackType = ref(null);
|
|
941
|
-
var feedbackText = ref('');
|
|
942
|
-
var feedbackRecorded = ref(false);
|
|
943
|
-
var handleButtonClick = function handleButtonClick(type) {
|
|
944
|
-
if (feedbackType.value === type) {
|
|
945
|
-
feedbackType.value = null;
|
|
946
|
-
showInput.value = false;
|
|
947
|
-
} else {
|
|
948
|
-
feedbackType.value = type;
|
|
949
|
-
showInput.value = true;
|
|
950
|
-
}
|
|
951
|
-
};
|
|
952
|
-
var handleInputChange = function handleInputChange(e) {
|
|
953
|
-
feedbackText.value = e.target.value;
|
|
954
|
-
};
|
|
955
|
-
var handleSubmit = function handleSubmit() {
|
|
956
|
-
emit('feedback-submit', feedbackType.value === 'positive', feedbackText.value);
|
|
957
|
-
feedbackText.value = '';
|
|
958
|
-
showInput.value = false;
|
|
959
|
-
feedbackRecorded.value = true;
|
|
960
|
-
};
|
|
961
|
-
var handleCancel = function handleCancel() {
|
|
962
|
-
feedbackType.value = null;
|
|
963
|
-
feedbackText.value = '';
|
|
964
|
-
showInput.value = false;
|
|
965
|
-
};
|
|
966
|
-
watch(function () {
|
|
967
|
-
return props.overrideState;
|
|
968
|
-
}, function (newValue) {
|
|
969
|
-
if (newValue && newValue.isRecorded) {
|
|
970
|
-
feedbackRecorded.value = true;
|
|
971
|
-
feedbackType.value = newValue.feedbackType || 'positive';
|
|
972
|
-
}
|
|
973
|
-
});
|
|
974
|
-
if (props.overrideState && props.overrideState.isRecorded) {
|
|
975
|
-
feedbackRecorded.value = true;
|
|
976
|
-
feedbackType.value = props.overrideState.feedbackType || 'positive';
|
|
977
|
-
}
|
|
978
|
-
return {
|
|
979
|
-
showInput: showInput,
|
|
980
|
-
feedbackType: feedbackType,
|
|
981
|
-
feedbackText: feedbackText,
|
|
982
|
-
feedbackRecorded: feedbackRecorded,
|
|
983
|
-
handleButtonClick: handleButtonClick,
|
|
984
|
-
handleInputChange: handleInputChange,
|
|
985
|
-
handleSubmit: handleSubmit,
|
|
986
|
-
handleCancel: handleCancel
|
|
987
|
-
};
|
|
988
|
-
},
|
|
989
|
-
render: function render() {
|
|
990
|
-
var _this = this;
|
|
991
|
-
if (this.$props.hideUI) {
|
|
992
|
-
return null;
|
|
993
|
-
}
|
|
994
|
-
if (this.feedbackRecorded) {
|
|
995
|
-
return createVNode(AIFeedbackContainer, null, {
|
|
996
|
-
"default": function _default() {
|
|
997
|
-
return [createVNode("div", {
|
|
998
|
-
"class": "--feedback-svgs-wrapper"
|
|
999
|
-
}, [_this.feedbackType === 'positive' ? createVNode(ThumbsUpSvg, {
|
|
1000
|
-
"class": "selected"
|
|
1001
|
-
}, null) : createVNode(ThumbsDownSvg, {
|
|
1002
|
-
"class": "selected"
|
|
1003
|
-
}, null)])];
|
|
1004
|
-
}
|
|
1005
|
-
});
|
|
1006
|
-
}
|
|
1007
|
-
return createVNode(AIFeedbackContainer, null, {
|
|
1008
|
-
"default": function _default() {
|
|
1009
|
-
return [!_this.showInput && createVNode("div", {
|
|
1010
|
-
"class": "--feedback-svgs-wrapper"
|
|
1011
|
-
}, [createVNode(ThumbsUpSvg, {
|
|
1012
|
-
"class": _this.feedbackType === 'positive' ? 'selected' : '',
|
|
1013
|
-
"onClick": function onClick() {
|
|
1014
|
-
return _this.handleButtonClick('positive');
|
|
1015
|
-
}
|
|
1016
|
-
}, null), createVNode(ThumbsDownSvg, {
|
|
1017
|
-
"class": _this.feedbackType === 'negative' ? 'selected' : '',
|
|
1018
|
-
"onClick": function onClick() {
|
|
1019
|
-
return _this.handleButtonClick('negative');
|
|
1020
|
-
}
|
|
1021
|
-
}, null)]), _this.showInput && createVNode("div", {
|
|
1022
|
-
"class": "--feedback-input-wrapper"
|
|
1023
|
-
}, [createVNode(Input, {
|
|
1024
|
-
"show": _this.showInput,
|
|
1025
|
-
"placeholder": _this.feedbackType === 'positive' ? 'What do you like about the response?' : 'What was the issue with the response? How can it be improved?',
|
|
1026
|
-
"value": _this.feedbackText,
|
|
1027
|
-
"onInput": _this.handleInputChange
|
|
1028
|
-
}, null), createVNode(Button, {
|
|
1029
|
-
"primary": true,
|
|
1030
|
-
"onClick": _this.handleSubmit
|
|
1031
|
-
}, {
|
|
1032
|
-
"default": function _default() {
|
|
1033
|
-
return [createTextVNode("Submit")];
|
|
1034
|
-
}
|
|
1035
|
-
}), createVNode(Button, {
|
|
1036
|
-
"onClick": _this.handleCancel
|
|
1037
|
-
}, {
|
|
1038
|
-
"default": function _default() {
|
|
1039
|
-
return [createTextVNode("Cancel")];
|
|
1040
|
-
}
|
|
1041
|
-
})])];
|
|
1042
|
-
}
|
|
1043
|
-
});
|
|
1044
|
-
}
|
|
1045
|
-
});
|
|
1046
|
-
|
|
1047
|
-
var _excluded = ["_source"];
|
|
1048
755
|
function _isSlot(s) {
|
|
1049
756
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
|
|
1050
757
|
}
|
|
1051
|
-
var md = new Remarkable();
|
|
1052
|
-
md.set({
|
|
1053
|
-
html: true,
|
|
1054
|
-
breaks: true,
|
|
1055
|
-
xhtmlOut: true
|
|
1056
|
-
});
|
|
1057
|
-
var _dropdownULRef = 'dropdownULRef';
|
|
1058
758
|
var updateQuery = Actions.updateQuery,
|
|
1059
759
|
setCustomQuery = Actions.setCustomQuery,
|
|
1060
760
|
setDefaultQuery = Actions.setDefaultQuery,
|
|
@@ -1075,11 +775,7 @@ var SearchBox = defineComponent({
|
|
|
1075
775
|
currentValue: '',
|
|
1076
776
|
selectedTags: [],
|
|
1077
777
|
isOpen: false,
|
|
1078
|
-
normalizedSuggestions: []
|
|
1079
|
-
showAIScreen: false,
|
|
1080
|
-
showAIScreenFooter: false,
|
|
1081
|
-
showFeedbackComponent: false,
|
|
1082
|
-
feedbackState: null
|
|
778
|
+
normalizedSuggestions: []
|
|
1083
779
|
};
|
|
1084
780
|
this.internalComponent = props.componentId + "__internal";
|
|
1085
781
|
return this.__state;
|
|
@@ -1201,10 +897,7 @@ var SearchBox = defineComponent({
|
|
|
1201
897
|
mode: VueTypes.oneOf(['select', 'tag']).def('select'),
|
|
1202
898
|
renderSelectedTags: VueTypes.any,
|
|
1203
899
|
searchboxId: VueTypes.string,
|
|
1204
|
-
endpoint: types.endpointConfig
|
|
1205
|
-
enableAI: types.bool,
|
|
1206
|
-
AIConfig: types.AIConfig,
|
|
1207
|
-
AIUIConfig: types.AIUIConfig
|
|
900
|
+
endpoint: types.endpointConfig
|
|
1208
901
|
},
|
|
1209
902
|
mounted: function mounted() {
|
|
1210
903
|
this.listenForFocusShortcuts();
|
|
@@ -1311,47 +1004,6 @@ var SearchBox = defineComponent({
|
|
|
1311
1004
|
if (!isEqual(newVal, oldVal)) {
|
|
1312
1005
|
this.handleTextChange = _debounce(this.handleText, newVal);
|
|
1313
1006
|
}
|
|
1314
|
-
},
|
|
1315
|
-
isAITyping: function isAITyping(newVal, oldVal) {
|
|
1316
|
-
var _this = this;
|
|
1317
|
-
var scrollAIContainer = function scrollAIContainer() {
|
|
1318
|
-
var dropdownEle = _this.$refs[_dropdownULRef];
|
|
1319
|
-
if (dropdownEle) {
|
|
1320
|
-
dropdownEle.scrollTo({
|
|
1321
|
-
top: dropdownEle.scrollHeight,
|
|
1322
|
-
behavior: 'smooth'
|
|
1323
|
-
});
|
|
1324
|
-
}
|
|
1325
|
-
};
|
|
1326
|
-
if (!newVal && oldVal) {
|
|
1327
|
-
this.showAIScreenFooter = true;
|
|
1328
|
-
if (this.$props.AIUIConfig && typeof this.$props.AIUIConfig.showFeedback === 'boolean' ? this.$props.AIUIConfig.showFeedback : true) {
|
|
1329
|
-
this.showFeedbackComponent = true;
|
|
1330
|
-
}
|
|
1331
|
-
setTimeout(function () {
|
|
1332
|
-
scrollAIContainer();
|
|
1333
|
-
}, 500);
|
|
1334
|
-
} else if (newVal) {
|
|
1335
|
-
this.scrollTimerRef = setTimeout(function () {
|
|
1336
|
-
scrollAIContainer();
|
|
1337
|
-
}, 2000);
|
|
1338
|
-
}
|
|
1339
|
-
},
|
|
1340
|
-
showAIScreen: function showAIScreen(newVal) {
|
|
1341
|
-
if (newVal) {
|
|
1342
|
-
var _this$$refs;
|
|
1343
|
-
if ((_this$$refs = this.$refs) != null && _this$$refs[this.$props.innerRef] && this.$refs[this.$props.innerRef].$el) {
|
|
1344
|
-
this.$refs[this.$props.innerRef].$el.blur();
|
|
1345
|
-
}
|
|
1346
|
-
} else {
|
|
1347
|
-
this.feedbackState = null;
|
|
1348
|
-
this.showFeedbackComponent = false;
|
|
1349
|
-
}
|
|
1350
|
-
},
|
|
1351
|
-
currentValue: function currentValue() {
|
|
1352
|
-
if (this.$props.autosuggest && this.$props.enableAI) {
|
|
1353
|
-
this.handleTextAreaHeightChange();
|
|
1354
|
-
}
|
|
1355
1007
|
}
|
|
1356
1008
|
},
|
|
1357
1009
|
methods: {
|
|
@@ -1377,14 +1029,7 @@ var SearchBox = defineComponent({
|
|
|
1377
1029
|
data: this.normalizedSuggestions,
|
|
1378
1030
|
rawData: this.rawData,
|
|
1379
1031
|
value: currentValue,
|
|
1380
|
-
resultStats: this.stats
|
|
1381
|
-
AIData: {
|
|
1382
|
-
question: this.AIResponse && this.AIResponse.response && this.AIResponse.response.question,
|
|
1383
|
-
answer: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.text,
|
|
1384
|
-
documentIds: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds || [],
|
|
1385
|
-
showAIScreen: this.showAIScreen,
|
|
1386
|
-
sources: this.getAISourceObjects()
|
|
1387
|
-
}
|
|
1032
|
+
resultStats: this.stats
|
|
1388
1033
|
};
|
|
1389
1034
|
return getComponent(data, this);
|
|
1390
1035
|
},
|
|
@@ -1408,7 +1053,7 @@ var SearchBox = defineComponent({
|
|
|
1408
1053
|
}
|
|
1409
1054
|
},
|
|
1410
1055
|
setValue: function setValue(value, isDefaultValue, props, cause, toggleIsOpen, categoryValue) {
|
|
1411
|
-
var
|
|
1056
|
+
var _this = this;
|
|
1412
1057
|
if (isDefaultValue === void 0) {
|
|
1413
1058
|
isDefaultValue = false;
|
|
1414
1059
|
}
|
|
@@ -1422,65 +1067,60 @@ var SearchBox = defineComponent({
|
|
|
1422
1067
|
categoryValue = undefined;
|
|
1423
1068
|
}
|
|
1424
1069
|
var performUpdate = function performUpdate() {
|
|
1425
|
-
if (
|
|
1070
|
+
if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
|
|
1426
1071
|
return;
|
|
1427
1072
|
}
|
|
1428
|
-
if (
|
|
1429
|
-
if (Array.isArray(
|
|
1073
|
+
if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
|
|
1074
|
+
if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
|
|
1430
1075
|
// check if value already present in selectedTags
|
|
1431
|
-
if (typeof value === 'string' &&
|
|
1432
|
-
|
|
1076
|
+
if (typeof value === 'string' && _this.selectedTags.includes(value)) {
|
|
1077
|
+
_this.isOpen = false;
|
|
1433
1078
|
return;
|
|
1434
1079
|
}
|
|
1435
|
-
|
|
1080
|
+
_this.selectedTags = [].concat(_this.selectedTags);
|
|
1436
1081
|
if (typeof value === 'string' && !!value) {
|
|
1437
|
-
|
|
1438
|
-
} else if (Array.isArray(value) && !isEqual(
|
|
1439
|
-
|
|
1082
|
+
_this.selectedTags.push(value);
|
|
1083
|
+
} else if (Array.isArray(value) && !isEqual(_this.selectedTags, value)) {
|
|
1084
|
+
_this.selectedTags = value;
|
|
1440
1085
|
}
|
|
1441
1086
|
} else if (value) {
|
|
1442
|
-
|
|
1087
|
+
_this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
|
|
1443
1088
|
}
|
|
1444
|
-
|
|
1089
|
+
_this.currentValue = '';
|
|
1445
1090
|
} else {
|
|
1446
|
-
|
|
1091
|
+
_this.currentValue = decodeHtml(value);
|
|
1447
1092
|
}
|
|
1448
1093
|
var queryHandlerValue = value;
|
|
1449
|
-
if (
|
|
1450
|
-
queryHandlerValue = Array.isArray(
|
|
1094
|
+
if (_this.$options.isTagsMode && cause === causes.SUGGESTION_SELECT) {
|
|
1095
|
+
queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
|
|
1451
1096
|
}
|
|
1452
1097
|
if (isDefaultValue) {
|
|
1453
|
-
if (
|
|
1098
|
+
if (_this.$props.autosuggest) {
|
|
1454
1099
|
if (toggleIsOpen) {
|
|
1455
|
-
|
|
1100
|
+
_this.isOpen = false;
|
|
1456
1101
|
}
|
|
1457
|
-
if (typeof
|
|
1458
|
-
enableAI: true
|
|
1459
|
-
} : {});
|
|
1102
|
+
if (typeof _this.currentValue === 'string') _this.triggerDefaultQuery(_this.currentValue);
|
|
1460
1103
|
} // in case of strict selection only SUGGESTION_SELECT should be able
|
|
1461
1104
|
// to set the query otherwise the value should reset
|
|
1462
1105
|
if (props.strictSelection) {
|
|
1463
|
-
if (cause === causes.SUGGESTION_SELECT || (
|
|
1464
|
-
|
|
1106
|
+
if (cause === causes.SUGGESTION_SELECT || (_this.$options.isTagsMode ? _this.selectedTags.length === 0 : value === '')) {
|
|
1107
|
+
_this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
|
|
1465
1108
|
} else {
|
|
1466
|
-
|
|
1109
|
+
_this.setValue('', true);
|
|
1467
1110
|
}
|
|
1468
1111
|
} else if (props.value === undefined || cause === causes.SUGGESTION_SELECT || cause === causes.CLEAR_VALUE) {
|
|
1469
|
-
|
|
1112
|
+
_this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
|
|
1470
1113
|
}
|
|
1471
1114
|
} else {
|
|
1472
1115
|
// debounce for handling text while typing
|
|
1473
|
-
|
|
1116
|
+
_this.handleTextChange(value, cause);
|
|
1474
1117
|
}
|
|
1475
|
-
|
|
1476
|
-
|
|
1118
|
+
_this.$emit('valueChange', value);
|
|
1119
|
+
_this.$emit('value-change', value);
|
|
1477
1120
|
};
|
|
1478
1121
|
checkValueChange(props.componentId, value, props.beforeValueChange, performUpdate);
|
|
1479
1122
|
},
|
|
1480
|
-
triggerDefaultQuery: function triggerDefaultQuery(paramValue
|
|
1481
|
-
if (meta === void 0) {
|
|
1482
|
-
meta = {};
|
|
1483
|
-
}
|
|
1123
|
+
triggerDefaultQuery: function triggerDefaultQuery(paramValue) {
|
|
1484
1124
|
if (!this.$props.autosuggest) {
|
|
1485
1125
|
return;
|
|
1486
1126
|
}
|
|
@@ -1499,8 +1139,7 @@ var SearchBox = defineComponent({
|
|
|
1499
1139
|
componentId: this.internalComponent,
|
|
1500
1140
|
query: query,
|
|
1501
1141
|
value: value,
|
|
1502
|
-
componentType: componentTypes.searchBox
|
|
1503
|
-
meta: meta
|
|
1142
|
+
componentType: componentTypes.searchBox
|
|
1504
1143
|
});
|
|
1505
1144
|
},
|
|
1506
1145
|
triggerCustomQuery: function triggerCustomQuery(paramValue, categoryValue) {
|
|
@@ -1584,8 +1223,8 @@ var SearchBox = defineComponent({
|
|
|
1584
1223
|
this.recordSuggestionClick(searchPosition, docId);
|
|
1585
1224
|
},
|
|
1586
1225
|
clearValue: function clearValue() {
|
|
1587
|
-
this.setValue('', false, this.$props,
|
|
1588
|
-
this.onValueSelectedHandler('',
|
|
1226
|
+
this.setValue('', false, this.$props, causes.CLEAR_VALUE, false);
|
|
1227
|
+
this.onValueSelectedHandler('', causes.CLEAR_VALUE);
|
|
1589
1228
|
},
|
|
1590
1229
|
handleKeyDown: function handleKeyDown(event, highlightedIndex) {
|
|
1591
1230
|
if (highlightedIndex === void 0) {
|
|
@@ -1596,12 +1235,9 @@ var SearchBox = defineComponent({
|
|
|
1596
1235
|
if (this.$props.autosuggest === false) {
|
|
1597
1236
|
this.enterButtonOnClick();
|
|
1598
1237
|
} else if (highlightedIndex === null) {
|
|
1599
|
-
this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
if (this.$props.enableAI && !this.showAIScreen) {
|
|
1603
|
-
this.showAIScreen = true;
|
|
1604
|
-
}
|
|
1238
|
+
this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? causes.SUGGESTION_SELECT : undefined // to handle tags
|
|
1239
|
+
);
|
|
1240
|
+
|
|
1605
1241
|
this.onValueSelectedHandler(event.target.value, causes.ENTER_PRESS);
|
|
1606
1242
|
}
|
|
1607
1243
|
}
|
|
@@ -1611,21 +1247,18 @@ var SearchBox = defineComponent({
|
|
|
1611
1247
|
this.$emit('key-down', event, this.triggerQuery);
|
|
1612
1248
|
},
|
|
1613
1249
|
onInputChange: function onInputChange(e) {
|
|
1614
|
-
var
|
|
1250
|
+
var _this2 = this;
|
|
1615
1251
|
var inputValue = e.target.value;
|
|
1616
1252
|
if (!this.$data.isOpen && this.$props.autosuggest) {
|
|
1617
1253
|
this.isOpen = true;
|
|
1618
1254
|
}
|
|
1619
|
-
if (this.showAIScreen) {
|
|
1620
|
-
this.showAIScreen = false;
|
|
1621
|
-
}
|
|
1622
1255
|
var value = this.$props.value;
|
|
1623
1256
|
if (value === undefined) {
|
|
1624
|
-
this.setValue(inputValue, false, this.$props, undefined);
|
|
1257
|
+
this.setValue(inputValue, false, this.$props, inputValue === '' ? causes.CLEAR_VALUE : undefined);
|
|
1625
1258
|
} else {
|
|
1626
1259
|
this.$emit('change', inputValue, function (_ref3) {
|
|
1627
1260
|
var isOpen = _ref3.isOpen;
|
|
1628
|
-
return
|
|
1261
|
+
return _this2.triggerQuery({
|
|
1629
1262
|
defaultQuery: true,
|
|
1630
1263
|
customQuery: true,
|
|
1631
1264
|
value: inputValue,
|
|
@@ -1635,10 +1268,8 @@ var SearchBox = defineComponent({
|
|
|
1635
1268
|
}
|
|
1636
1269
|
},
|
|
1637
1270
|
onSuggestionSelected: function onSuggestionSelected(suggestion) {
|
|
1638
|
-
var
|
|
1639
|
-
|
|
1640
|
-
this.showAIScreen = true;
|
|
1641
|
-
}
|
|
1271
|
+
var _this3 = this;
|
|
1272
|
+
this.isOpen = false;
|
|
1642
1273
|
var value = this.$props.value;
|
|
1643
1274
|
// Record analytics for selected suggestions
|
|
1644
1275
|
this.triggerClickAnalytics(suggestion._click_id);
|
|
@@ -1658,10 +1289,10 @@ var SearchBox = defineComponent({
|
|
|
1658
1289
|
this.setValue(emitValue, true, this.$props, causes.SUGGESTION_SELECT, false, suggestion._category);
|
|
1659
1290
|
this.$emit('change', emitValue, function (_ref4) {
|
|
1660
1291
|
var isOpen = _ref4.isOpen;
|
|
1661
|
-
return
|
|
1292
|
+
return _this3.triggerQuery(_extends({
|
|
1662
1293
|
isOpen: isOpen,
|
|
1663
1294
|
value: emitValue
|
|
1664
|
-
}, !
|
|
1295
|
+
}, !_this3.$options.isTagsMode && {
|
|
1665
1296
|
categoryValue: suggestion._category
|
|
1666
1297
|
}));
|
|
1667
1298
|
});
|
|
@@ -1695,26 +1326,9 @@ var SearchBox = defineComponent({
|
|
|
1695
1326
|
}
|
|
1696
1327
|
return null;
|
|
1697
1328
|
},
|
|
1698
|
-
renderErrorComponent: function renderErrorComponent(
|
|
1699
|
-
var
|
|
1700
|
-
if (isAIError === void 0) {
|
|
1701
|
-
isAIError = false;
|
|
1702
|
-
}
|
|
1329
|
+
renderErrorComponent: function renderErrorComponent() {
|
|
1330
|
+
var _this4 = this;
|
|
1703
1331
|
var renderError = this.$slots.renderError || this.$props.renderError;
|
|
1704
|
-
if (isAIError) {
|
|
1705
|
-
if (this.showAIScreen && this.AIResponseError && !this.isAIResponseLoading) {
|
|
1706
|
-
if (renderError) {
|
|
1707
|
-
return createVNode("div", {
|
|
1708
|
-
"class": "--ai-answer-error-container " + (getClassName$1(this.$props.innerClass, 'ai-error') || '')
|
|
1709
|
-
}, [renderError(this.AIResponseError)]);
|
|
1710
|
-
}
|
|
1711
|
-
return createVNode("div", {
|
|
1712
|
-
"class": "--ai-answer-error-container " + (getClassName$1(this.$props.innerClass, 'ai-error') || '')
|
|
1713
|
-
}, [createVNode("div", {
|
|
1714
|
-
"class": "--default-error-element"
|
|
1715
|
-
}, [createVNode("span", null, [typeof this.AIResponseError === 'string' ? this.AIResponseError : this.AIResponseError.message ? this.AIResponseError.message : 'There was an error in generating the response.', this.AIResponseError.code ? "Code:\n\t\t\t\t\t\t\t" + this.AIResponseError.code : ''])])]);
|
|
1716
|
-
}
|
|
1717
|
-
}
|
|
1718
1332
|
if (this.error && renderError && this.$data.currentValue && !this.isLoading) {
|
|
1719
1333
|
return createVNode(SuggestionWrapper, {
|
|
1720
1334
|
"innerClass": this.$props.innerClass,
|
|
@@ -1723,7 +1337,7 @@ var SearchBox = defineComponent({
|
|
|
1723
1337
|
"themePreset": this.themePreset
|
|
1724
1338
|
}, {
|
|
1725
1339
|
"default": function _default() {
|
|
1726
|
-
return [isFunction(renderError) ? renderError(
|
|
1340
|
+
return [isFunction(renderError) ? renderError(_this4.error) : renderError];
|
|
1727
1341
|
}
|
|
1728
1342
|
});
|
|
1729
1343
|
}
|
|
@@ -1788,7 +1402,6 @@ var SearchBox = defineComponent({
|
|
|
1788
1402
|
return null;
|
|
1789
1403
|
},
|
|
1790
1404
|
enterButtonOnClick: function enterButtonOnClick() {
|
|
1791
|
-
this.showAIScreen = false;
|
|
1792
1405
|
this.triggerQuery({
|
|
1793
1406
|
isOpen: false,
|
|
1794
1407
|
value: this.currentValue,
|
|
@@ -1796,7 +1409,7 @@ var SearchBox = defineComponent({
|
|
|
1796
1409
|
});
|
|
1797
1410
|
},
|
|
1798
1411
|
renderEnterButtonElement: function renderEnterButtonElement() {
|
|
1799
|
-
var
|
|
1412
|
+
var _this5 = this;
|
|
1800
1413
|
var _this$$props2 = this.$props,
|
|
1801
1414
|
enterButton = _this$$props2.enterButton,
|
|
1802
1415
|
innerClass = _this$$props2.innerClass;
|
|
@@ -1804,12 +1417,12 @@ var SearchBox = defineComponent({
|
|
|
1804
1417
|
if (enterButton) {
|
|
1805
1418
|
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
1806
1419
|
if (renderEnterButton) {
|
|
1807
|
-
return renderEnterButton(
|
|
1420
|
+
return renderEnterButton(_this5.enterButtonOnClick);
|
|
1808
1421
|
}
|
|
1809
1422
|
return createVNode(Button, {
|
|
1810
1423
|
"class": "enter-btn " + getClassName$1(innerClass, 'enter-button'),
|
|
1811
1424
|
"primary": true,
|
|
1812
|
-
"onClick":
|
|
1425
|
+
"onClick": _this5.enterButtonOnClick
|
|
1813
1426
|
}, {
|
|
1814
1427
|
"default": function _default() {
|
|
1815
1428
|
return [createTextVNode("Search")];
|
|
@@ -1823,7 +1436,7 @@ var SearchBox = defineComponent({
|
|
|
1823
1436
|
return null;
|
|
1824
1437
|
},
|
|
1825
1438
|
renderIcons: function renderIcons() {
|
|
1826
|
-
var
|
|
1439
|
+
var _this6 = this;
|
|
1827
1440
|
var _slot3, _slot4, _slot5;
|
|
1828
1441
|
var _this$$props3 = this.$props,
|
|
1829
1442
|
iconPosition = _this$$props3.iconPosition,
|
|
@@ -1840,21 +1453,21 @@ var SearchBox = defineComponent({
|
|
|
1840
1453
|
}, {
|
|
1841
1454
|
"default": function _default() {
|
|
1842
1455
|
return [currentValue && showClear && createVNode(IconWrapper, {
|
|
1843
|
-
"onClick":
|
|
1456
|
+
"onClick": _this6.clearValue,
|
|
1844
1457
|
"showIcon": showIcon,
|
|
1845
1458
|
"isClearIcon": true
|
|
1846
|
-
}, _isSlot(_slot3 =
|
|
1459
|
+
}, _isSlot(_slot3 = _this6.renderCancelIcon()) ? _slot3 : {
|
|
1847
1460
|
"default": function _default() {
|
|
1848
1461
|
return [_slot3];
|
|
1849
1462
|
}
|
|
1850
1463
|
}), showVoiceSearch && createVNode(Mic, {
|
|
1851
1464
|
"getInstance": getMicInstance,
|
|
1852
1465
|
"render": renderMic,
|
|
1853
|
-
"handleResult":
|
|
1466
|
+
"handleResult": _this6.handleVoiceResults,
|
|
1854
1467
|
"className": getClassName$1(innerClass, 'mic') || null
|
|
1855
1468
|
}, null), iconPosition === 'right' && showIcon && createVNode(IconWrapper, {
|
|
1856
|
-
"onClick":
|
|
1857
|
-
}, _isSlot(_slot4 =
|
|
1469
|
+
"onClick": _this6.handleSearchIconClick
|
|
1470
|
+
}, _isSlot(_slot4 = _this6.renderIcon()) ? _slot4 : {
|
|
1858
1471
|
"default": function _default() {
|
|
1859
1472
|
return [_slot4];
|
|
1860
1473
|
}
|
|
@@ -1866,8 +1479,8 @@ var SearchBox = defineComponent({
|
|
|
1866
1479
|
}, {
|
|
1867
1480
|
"default": function _default() {
|
|
1868
1481
|
return [iconPosition === 'left' && showIcon && createVNode(IconWrapper, {
|
|
1869
|
-
"onClick":
|
|
1870
|
-
}, _isSlot(_slot5 =
|
|
1482
|
+
"onClick": _this6.handleSearchIconClick
|
|
1483
|
+
}, _isSlot(_slot5 = _this6.renderIcon()) ? _slot5 : {
|
|
1871
1484
|
"default": function _default() {
|
|
1872
1485
|
return [_slot5];
|
|
1873
1486
|
}
|
|
@@ -1876,17 +1489,17 @@ var SearchBox = defineComponent({
|
|
|
1876
1489
|
})]);
|
|
1877
1490
|
},
|
|
1878
1491
|
focusSearchBox: function focusSearchBox(event) {
|
|
1879
|
-
var _this$$
|
|
1492
|
+
var _this$$refs, _this$$refs$this$$pro;
|
|
1880
1493
|
var elt = event.target || event.srcElement;
|
|
1881
1494
|
var tagName = elt.tagName;
|
|
1882
1495
|
if (elt.isContentEditable || tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA') {
|
|
1883
1496
|
// already in an input
|
|
1884
1497
|
return;
|
|
1885
1498
|
}
|
|
1886
|
-
(_this$$
|
|
1499
|
+
(_this$$refs = this.$refs) == null ? void 0 : (_this$$refs$this$$pro = _this$$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs$this$$pro.focus(); // eslint-disable-line
|
|
1887
1500
|
},
|
|
1888
1501
|
listenForFocusShortcuts: function listenForFocusShortcuts() {
|
|
1889
|
-
var
|
|
1502
|
+
var _this7 = this;
|
|
1890
1503
|
var _this$$props$focusSho = this.$props.focusShortcuts,
|
|
1891
1504
|
focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
|
|
1892
1505
|
if (isEmpty(focusShortcuts)) {
|
|
@@ -1901,7 +1514,7 @@ var SearchBox = defineComponent({
|
|
|
1901
1514
|
function (event, handler) {
|
|
1902
1515
|
// Prevent the default refresh event under WINDOWS system
|
|
1903
1516
|
event.preventDefault();
|
|
1904
|
-
|
|
1517
|
+
_this7.focusSearchBox(event);
|
|
1905
1518
|
});
|
|
1906
1519
|
|
|
1907
1520
|
// if one of modifier keys are used, they are handled below
|
|
@@ -1911,7 +1524,7 @@ var SearchBox = defineComponent({
|
|
|
1911
1524
|
for (var index = 0; index < modifierKeys.length; index += 1) {
|
|
1912
1525
|
var element = modifierKeys[index];
|
|
1913
1526
|
if (hotkeys[element]) {
|
|
1914
|
-
|
|
1527
|
+
_this7.focusSearchBox(event);
|
|
1915
1528
|
break;
|
|
1916
1529
|
}
|
|
1917
1530
|
}
|
|
@@ -1924,10 +1537,10 @@ var SearchBox = defineComponent({
|
|
|
1924
1537
|
this.triggerDefaultQuery(value);
|
|
1925
1538
|
},
|
|
1926
1539
|
renderAutoFill: function renderAutoFill(suggestion) {
|
|
1927
|
-
var
|
|
1540
|
+
var _this8 = this;
|
|
1928
1541
|
var handleAutoFillClick = function handleAutoFillClick(e) {
|
|
1929
1542
|
e.stopPropagation();
|
|
1930
|
-
|
|
1543
|
+
_this8.onAutofillClick(suggestion);
|
|
1931
1544
|
};
|
|
1932
1545
|
/* 👇 avoid showing autofill for category suggestions👇 */
|
|
1933
1546
|
return suggestion._category ? null : createVNode(AutoFillSvg, {
|
|
@@ -1935,7 +1548,7 @@ var SearchBox = defineComponent({
|
|
|
1935
1548
|
}, null);
|
|
1936
1549
|
},
|
|
1937
1550
|
renderTag: function renderTag(item) {
|
|
1938
|
-
var
|
|
1551
|
+
var _this9 = this;
|
|
1939
1552
|
var innerClass = this.$props.innerClass;
|
|
1940
1553
|
return createVNode(TagItem, {
|
|
1941
1554
|
"class": getClassName$1(innerClass, 'selected-tag') || ''
|
|
@@ -1946,7 +1559,7 @@ var SearchBox = defineComponent({
|
|
|
1946
1559
|
"aria-label": "delete-tag",
|
|
1947
1560
|
"class": "close-icon",
|
|
1948
1561
|
"onClick": function onClick() {
|
|
1949
|
-
return
|
|
1562
|
+
return _this9.clearTag(item);
|
|
1950
1563
|
}
|
|
1951
1564
|
}, [createVNode(CancelSvg, null, null)])];
|
|
1952
1565
|
}
|
|
@@ -1969,7 +1582,7 @@ var SearchBox = defineComponent({
|
|
|
1969
1582
|
}
|
|
1970
1583
|
},
|
|
1971
1584
|
renderTags: function renderTags() {
|
|
1972
|
-
var
|
|
1585
|
+
var _this10 = this;
|
|
1973
1586
|
if (!Array.isArray(this.selectedTags)) {
|
|
1974
1587
|
return null;
|
|
1975
1588
|
}
|
|
@@ -1983,189 +1596,25 @@ var SearchBox = defineComponent({
|
|
|
1983
1596
|
}) : createVNode(TagsContainer, null, {
|
|
1984
1597
|
"default": function _default() {
|
|
1985
1598
|
return [tagsList.map(function (item) {
|
|
1986
|
-
return
|
|
1599
|
+
return _this10.renderTag(item);
|
|
1987
1600
|
}), shouldRenderClearAllTag && createVNode(TagItem, {
|
|
1988
|
-
"class": getClassName$1(
|
|
1601
|
+
"class": getClassName$1(_this10.$props.innerClass, 'selected-tag') || ''
|
|
1989
1602
|
}, {
|
|
1990
1603
|
"default": function _default() {
|
|
1991
1604
|
return [createVNode("span", null, [createTextVNode("Clear All")]), createVNode("span", {
|
|
1992
1605
|
"role": "img",
|
|
1993
1606
|
"aria-label": "delete-tag",
|
|
1994
1607
|
"class": "close-icon",
|
|
1995
|
-
"onClick":
|
|
1608
|
+
"onClick": _this10.clearAllTags
|
|
1996
1609
|
}, [createVNode(CancelSvg, null, null)])];
|
|
1997
1610
|
}
|
|
1998
1611
|
})];
|
|
1999
1612
|
}
|
|
2000
1613
|
});
|
|
2001
|
-
},
|
|
2002
|
-
getAISourceObjects: function getAISourceObjects() {
|
|
2003
|
-
var localCache = getObjectFromLocalStorage(AI_LOCAL_CACHE_KEY) && getObjectFromLocalStorage(AI_LOCAL_CACHE_KEY)[this.componentId];
|
|
2004
|
-
var sourceObjects = [];
|
|
2005
|
-
if (!this.AIResponse) return sourceObjects;
|
|
2006
|
-
var docIds = this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds || [];
|
|
2007
|
-
if (localCache && localCache.meta && localCache.meta.hits && localCache.meta.hits.hits) {
|
|
2008
|
-
docIds.forEach(function (id) {
|
|
2009
|
-
var foundSourceObj = localCache.meta.hits.hits.find(function (hit) {
|
|
2010
|
-
return hit._id === id;
|
|
2011
|
-
}) || {};
|
|
2012
|
-
if (foundSourceObj) {
|
|
2013
|
-
var _foundSourceObj$_sour = foundSourceObj._source,
|
|
2014
|
-
_source = _foundSourceObj$_sour === void 0 ? {} : _foundSourceObj$_sour,
|
|
2015
|
-
rest = _objectWithoutPropertiesLoose(foundSourceObj, _excluded);
|
|
2016
|
-
sourceObjects.push(_extends({}, rest, _source));
|
|
2017
|
-
}
|
|
2018
|
-
});
|
|
2019
|
-
} else {
|
|
2020
|
-
sourceObjects.push.apply(sourceObjects, docIds.map(function (id) {
|
|
2021
|
-
return {
|
|
2022
|
-
_id: id
|
|
2023
|
-
};
|
|
2024
|
-
}));
|
|
2025
|
-
}
|
|
2026
|
-
return sourceObjects;
|
|
2027
|
-
},
|
|
2028
|
-
renderAIScreenLoader: function renderAIScreenLoader() {
|
|
2029
|
-
var _this$$props$AIUIConf = this.$props.AIUIConfig,
|
|
2030
|
-
AIUIConfig = _this$$props$AIUIConf === void 0 ? {} : _this$$props$AIUIConf;
|
|
2031
|
-
var _ref5 = AIUIConfig || {},
|
|
2032
|
-
loaderMessage = _ref5.loaderMessage;
|
|
2033
|
-
if (loaderMessage) {
|
|
2034
|
-
return loaderMessage;
|
|
2035
|
-
}
|
|
2036
|
-
if (this.$slots.AILoaderMessage) {
|
|
2037
|
-
return this.$slots.AILoaderMessage();
|
|
2038
|
-
}
|
|
2039
|
-
return createVNode(HorizontalSkeletonLoader, null, null);
|
|
2040
|
-
},
|
|
2041
|
-
renderAIScreenFooter: function renderAIScreenFooter() {
|
|
2042
|
-
var _slot6;
|
|
2043
|
-
var _this12 = this;
|
|
2044
|
-
var _this$$props$AIUIConf2 = this.$props.AIUIConfig,
|
|
2045
|
-
AIUIConfig = _this$$props$AIUIConf2 === void 0 ? {} : _this$$props$AIUIConf2;
|
|
2046
|
-
var _ref6 = AIUIConfig || {},
|
|
2047
|
-
_ref6$showSourceDocum = _ref6.showSourceDocuments,
|
|
2048
|
-
showSourceDocuments = _ref6$showSourceDocum === void 0 ? true : _ref6$showSourceDocum,
|
|
2049
|
-
_ref6$sourceDocumentL = _ref6.sourceDocumentLabel,
|
|
2050
|
-
sourceDocumentLabel = _ref6$sourceDocumentL === void 0 ? '_id' : _ref6$sourceDocumentL,
|
|
2051
|
-
_ref6$onSourceClick = _ref6.onSourceClick,
|
|
2052
|
-
onSourceClick = _ref6$onSourceClick === void 0 ? function () {} : _ref6$onSourceClick;
|
|
2053
|
-
return showSourceDocuments && this.showAIScreenFooter && this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds ? createVNode(Footer, {
|
|
2054
|
-
"themePreset": this.$props.themePreset
|
|
2055
|
-
}, {
|
|
2056
|
-
"default": function _default() {
|
|
2057
|
-
return [createTextVNode("Summary generated using the following sources:"), ' ', createVNode(SourceTags, null, _isSlot(_slot6 = _this12.getAISourceObjects().map(function (el) {
|
|
2058
|
-
return createVNode(Button, {
|
|
2059
|
-
"class": "--ai-source-tag " + (getClassName$1(_this12.$props.innerClass, 'ai-source-tag') || ''),
|
|
2060
|
-
"title": el[sourceDocumentLabel],
|
|
2061
|
-
"info": true,
|
|
2062
|
-
"onClick": function onClick() {
|
|
2063
|
-
return onSourceClick && onSourceClick(el);
|
|
2064
|
-
}
|
|
2065
|
-
}, {
|
|
2066
|
-
"default": function _default() {
|
|
2067
|
-
return [el[sourceDocumentLabel]];
|
|
2068
|
-
}
|
|
2069
|
-
});
|
|
2070
|
-
})) ? _slot6 : {
|
|
2071
|
-
"default": function _default() {
|
|
2072
|
-
return [_slot6];
|
|
2073
|
-
}
|
|
2074
|
-
})];
|
|
2075
|
-
}
|
|
2076
|
-
}) : null;
|
|
2077
|
-
},
|
|
2078
|
-
renderAIScreen: function renderAIScreen() {
|
|
2079
|
-
var _this13 = this;
|
|
2080
|
-
var customAIRenderer = this.$props.renderAIAnswer || this.$slots.renderAIAnswer;
|
|
2081
|
-
if (customAIRenderer) {
|
|
2082
|
-
return customAIRenderer({
|
|
2083
|
-
question: this.AIResponse && this.AIResponse.response && this.AIResponse.response.question,
|
|
2084
|
-
answer: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.text,
|
|
2085
|
-
documentIds: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds || [],
|
|
2086
|
-
loading: this.isAIResponseLoading || this.isLoading,
|
|
2087
|
-
sources: this.getAISourceObjects(),
|
|
2088
|
-
error: this.AIResponseError
|
|
2089
|
-
});
|
|
2090
|
-
}
|
|
2091
|
-
if (this.isAIResponseLoading || this.isLoading) {
|
|
2092
|
-
return this.renderAIScreenLoader();
|
|
2093
|
-
}
|
|
2094
|
-
return createVNode("div", null, [createVNode(Answer, {
|
|
2095
|
-
"innerHTML": md.render(this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.text)
|
|
2096
|
-
}, null), this.renderAIScreenFooter(), this.showFeedbackComponent && createVNode("div", {
|
|
2097
|
-
"class": "" + (getClassName$1(this.$props.innerClass, 'ai-feedback') || '')
|
|
2098
|
-
}, [createVNode(AIFeedback, {
|
|
2099
|
-
"overrideState": this.feedbackState,
|
|
2100
|
-
"hideUI": this.isAIResponseLoading || this.isLoading || !this.sessionIdFromStore,
|
|
2101
|
-
"key": this.sessionIdFromStore,
|
|
2102
|
-
"onFeedbackSubmit": function onFeedbackSubmit(useful, reason) {
|
|
2103
|
-
_this13.feedbackState = {
|
|
2104
|
-
isRecorded: true,
|
|
2105
|
-
feedbackType: useful ? 'positive' : 'negative'
|
|
2106
|
-
};
|
|
2107
|
-
_this13.recordAISessionUsefulness(_this13.sessionIdFromStore, {
|
|
2108
|
-
useful: useful,
|
|
2109
|
-
reason: reason
|
|
2110
|
-
});
|
|
2111
|
-
}
|
|
2112
|
-
}, null)])]);
|
|
2113
|
-
},
|
|
2114
|
-
handleTextAreaHeightChange: function handleTextAreaHeightChange() {
|
|
2115
|
-
var _this$$refs$this$$pro;
|
|
2116
|
-
var textArea = (_this$$refs$this$$pro = this.$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs$this$$pro.$el;
|
|
2117
|
-
if (textArea) {
|
|
2118
|
-
textArea.style.height = '42px';
|
|
2119
|
-
var lineHeight = parseInt(getComputedStyle(textArea).lineHeight, 10);
|
|
2120
|
-
var maxHeight = lineHeight * 4; // max height for 3 lines
|
|
2121
|
-
var height = Math.min(textArea.scrollHeight, maxHeight);
|
|
2122
|
-
textArea.style.height = height + "px";
|
|
2123
|
-
textArea.style.overflowY = height === maxHeight ? 'auto' : 'hidden';
|
|
2124
|
-
var dropdownEle = this.$refs[_dropdownULRef];
|
|
2125
|
-
if (dropdownEle) {
|
|
2126
|
-
dropdownEle.style.top = height + "px";
|
|
2127
|
-
}
|
|
2128
|
-
}
|
|
2129
|
-
},
|
|
2130
|
-
askButtonOnClick: function askButtonOnClick() {
|
|
2131
|
-
this.showAIScreen = true;
|
|
2132
|
-
this.isOpen = true;
|
|
2133
|
-
this.triggerDefaultQuery(this.currentValue, {
|
|
2134
|
-
enableAI: true
|
|
2135
|
-
});
|
|
2136
|
-
},
|
|
2137
|
-
renderAskButtonElement: function renderAskButtonElement() {
|
|
2138
|
-
var _this14 = this;
|
|
2139
|
-
var _this$$props4 = this.$props,
|
|
2140
|
-
AIUIConfig = _this$$props4.AIUIConfig,
|
|
2141
|
-
innerClass = _this$$props4.innerClass;
|
|
2142
|
-
var _ref7 = AIUIConfig || {},
|
|
2143
|
-
askButton = _ref7.askButton;
|
|
2144
|
-
var renderAskButton = this.$slots.renderAskButton;
|
|
2145
|
-
if (askButton) {
|
|
2146
|
-
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
2147
|
-
if (renderAskButton) {
|
|
2148
|
-
return renderAskButton(_this14.askButtonOnClick);
|
|
2149
|
-
}
|
|
2150
|
-
return createVNode(Button, {
|
|
2151
|
-
"class": "enter-btn " + getClassName$1(innerClass, 'ask-button'),
|
|
2152
|
-
"info": true,
|
|
2153
|
-
"onClick": _this14.askButtonOnClick
|
|
2154
|
-
}, {
|
|
2155
|
-
"default": function _default() {
|
|
2156
|
-
return [createTextVNode("Ask")];
|
|
2157
|
-
}
|
|
2158
|
-
});
|
|
2159
|
-
};
|
|
2160
|
-
return createVNode("div", {
|
|
2161
|
-
"class": "enter-button-wrapper"
|
|
2162
|
-
}, [getEnterButtonMarkup()]);
|
|
2163
|
-
}
|
|
2164
|
-
return null;
|
|
2165
1614
|
}
|
|
2166
1615
|
},
|
|
2167
1616
|
render: function render() {
|
|
2168
|
-
var
|
|
1617
|
+
var _this11 = this;
|
|
2169
1618
|
var expandSuggestionsContainer = this.$props.expandSuggestionsContainer;
|
|
2170
1619
|
var _this$$slots = this.$slots,
|
|
2171
1620
|
recentSearchesIcon = _this$$slots.recentSearchesIcon,
|
|
@@ -2176,26 +1625,26 @@ var SearchBox = defineComponent({
|
|
|
2176
1625
|
"class": this.$props.className
|
|
2177
1626
|
}, {
|
|
2178
1627
|
"default": function _default() {
|
|
2179
|
-
return [
|
|
2180
|
-
"class": getClassName$1(
|
|
1628
|
+
return [_this11.$props.title && createVNode(Title, {
|
|
1629
|
+
"class": getClassName$1(_this11.$props.innerClass, 'title') || ''
|
|
2181
1630
|
}, {
|
|
2182
1631
|
"default": function _default() {
|
|
2183
|
-
return [
|
|
1632
|
+
return [_this11.$props.title];
|
|
2184
1633
|
}
|
|
2185
|
-
}),
|
|
2186
|
-
"id":
|
|
2187
|
-
"handleChange":
|
|
2188
|
-
"handleMouseup":
|
|
2189
|
-
"isOpen":
|
|
1634
|
+
}), _this11.$props.autosuggest ? createVNode(Downshift, {
|
|
1635
|
+
"id": _this11.$props.componentId + "-downshift",
|
|
1636
|
+
"handleChange": _this11.onSuggestionSelected,
|
|
1637
|
+
"handleMouseup": _this11.handleStateChange,
|
|
1638
|
+
"isOpen": _this11.$data.isOpen
|
|
2190
1639
|
}, {
|
|
2191
|
-
"default": function _default(
|
|
2192
|
-
var getInputEvents =
|
|
2193
|
-
getInputProps =
|
|
2194
|
-
getItemProps =
|
|
2195
|
-
getItemEvents =
|
|
2196
|
-
isOpen =
|
|
2197
|
-
highlightedIndex =
|
|
2198
|
-
setHighlightedIndex =
|
|
1640
|
+
"default": function _default(_ref5) {
|
|
1641
|
+
var getInputEvents = _ref5.getInputEvents,
|
|
1642
|
+
getInputProps = _ref5.getInputProps,
|
|
1643
|
+
getItemProps = _ref5.getItemProps,
|
|
1644
|
+
getItemEvents = _ref5.getItemEvents,
|
|
1645
|
+
isOpen = _ref5.isOpen,
|
|
1646
|
+
highlightedIndex = _ref5.highlightedIndex,
|
|
1647
|
+
setHighlightedIndex = _ref5.setHighlightedIndex;
|
|
2199
1648
|
var renderSuggestionsDropdown = function renderSuggestionsDropdown() {
|
|
2200
1649
|
var getIcon = function getIcon(iconType) {
|
|
2201
1650
|
switch (iconType) {
|
|
@@ -2207,21 +1656,14 @@ var SearchBox = defineComponent({
|
|
|
2207
1656
|
return null;
|
|
2208
1657
|
}
|
|
2209
1658
|
};
|
|
2210
|
-
return createVNode("div", null, [
|
|
1659
|
+
return createVNode("div", null, [_this11.hasCustomRenderer && _this11.getComponent({
|
|
2211
1660
|
isOpen: isOpen,
|
|
2212
1661
|
getItemProps: getItemProps,
|
|
2213
1662
|
getItemEvents: getItemEvents,
|
|
2214
1663
|
highlightedIndex: highlightedIndex
|
|
2215
|
-
}),
|
|
2216
|
-
"class": suggestions(
|
|
2217
|
-
|
|
2218
|
-
}, [_this15.showAIScreen && createVNode(SearchBoxAISection, {
|
|
2219
|
-
"themePreset": _this15.$props.themePreset
|
|
2220
|
-
}, {
|
|
2221
|
-
"default": function _default() {
|
|
2222
|
-
return [_this15.renderAIScreen(), ' ', _this15.renderErrorComponent(true)];
|
|
2223
|
-
}
|
|
2224
|
-
}), !_this15.showAIScreen && _this15.normalizedSuggestions.map(function (item, index) {
|
|
1664
|
+
}), _this11.renderErrorComponent(), !_this11.hasCustomRenderer && isOpen && hasSuggestions ? createVNode("ul", {
|
|
1665
|
+
"class": suggestions(_this11.themePreset, _this11.theme) + " " + getClassName$1(_this11.$props.innerClass, 'list')
|
|
1666
|
+
}, [_this11.normalizedSuggestions.map(function (item, index) {
|
|
2225
1667
|
return renderItem ? createVNode("li", mergeProps(getItemProps({
|
|
2226
1668
|
item: item
|
|
2227
1669
|
}), getItemEvents({
|
|
@@ -2229,7 +1671,7 @@ var SearchBox = defineComponent({
|
|
|
2229
1671
|
}), {
|
|
2230
1672
|
"key": index + 1 + "-" + item.value,
|
|
2231
1673
|
"style": {
|
|
2232
|
-
backgroundColor:
|
|
1674
|
+
backgroundColor: _this11.getBackgroundColor(highlightedIndex, index),
|
|
2233
1675
|
justifyContent: 'flex-start',
|
|
2234
1676
|
alignItems: 'center'
|
|
2235
1677
|
}
|
|
@@ -2240,7 +1682,7 @@ var SearchBox = defineComponent({
|
|
|
2240
1682
|
})), {
|
|
2241
1683
|
"key": index + 1 + "-" + item.value,
|
|
2242
1684
|
"style": {
|
|
2243
|
-
backgroundColor:
|
|
1685
|
+
backgroundColor: _this11.getBackgroundColor(highlightedIndex, index),
|
|
2244
1686
|
justifyContent: 'flex-start',
|
|
2245
1687
|
alignItems: 'center'
|
|
2246
1688
|
}
|
|
@@ -2250,133 +1692,97 @@ var SearchBox = defineComponent({
|
|
|
2250
1692
|
display: 'flex'
|
|
2251
1693
|
}
|
|
2252
1694
|
}, [createVNode(CustomSvg, {
|
|
2253
|
-
"className": getClassName$1(
|
|
1695
|
+
"className": getClassName$1(_this11.$props.innerClass, item._suggestion_type + "-search-icon") || null,
|
|
2254
1696
|
"icon": getIcon(item._suggestion_type),
|
|
2255
1697
|
"type": item._suggestion_type + "-search-icon"
|
|
2256
1698
|
}, null)]), createVNode(SuggestionItem, {
|
|
2257
|
-
"currentValue":
|
|
1699
|
+
"currentValue": _this11.currentValue,
|
|
2258
1700
|
"suggestion": item
|
|
2259
|
-
}, null),
|
|
2260
|
-
})]) :
|
|
1701
|
+
}, null), _this11.renderAutoFill(item)]);
|
|
1702
|
+
})]) : _this11.renderNoSuggestions(_this11.normalizedSuggestions)]);
|
|
2261
1703
|
};
|
|
2262
1704
|
return createVNode("div", {
|
|
2263
1705
|
"class": suggestionsContainer
|
|
2264
1706
|
}, [createVNode(InputGroup, null, {
|
|
2265
1707
|
"default": function _default() {
|
|
2266
|
-
return [
|
|
1708
|
+
return [_this11.renderInputAddonBefore(), createVNode(InputWrapper, null, {
|
|
2267
1709
|
"default": function _default() {
|
|
2268
|
-
return [
|
|
2269
|
-
onInput:
|
|
1710
|
+
return [createVNode(Input, mergeProps(_transformOn(getInputEvents({
|
|
1711
|
+
onInput: _this11.onInputChange,
|
|
2270
1712
|
onBlur: function onBlur(e) {
|
|
2271
|
-
|
|
1713
|
+
_this11.$emit('blur', e, _this11.triggerQuery);
|
|
2272
1714
|
},
|
|
2273
|
-
onFocus:
|
|
1715
|
+
onFocus: _this11.handleFocus,
|
|
2274
1716
|
onKeyPress: function onKeyPress(e) {
|
|
2275
|
-
|
|
2276
|
-
|
|
1717
|
+
_this11.$emit('keyPress', e, _this11.triggerQuery);
|
|
1718
|
+
_this11.$emit('key-press', e, _this11.triggerQuery);
|
|
2277
1719
|
},
|
|
2278
1720
|
onKeyDown: function onKeyDown(e) {
|
|
2279
|
-
return
|
|
1721
|
+
return _this11.handleKeyDown(e, highlightedIndex);
|
|
2280
1722
|
},
|
|
2281
1723
|
onKeyUp: function onKeyUp(e) {
|
|
2282
|
-
|
|
2283
|
-
|
|
1724
|
+
_this11.$emit('keyUp', e, _this11.triggerQuery);
|
|
1725
|
+
_this11.$emit('key-up', e, _this11.triggerQuery);
|
|
2284
1726
|
},
|
|
2285
1727
|
onClick: function onClick() {
|
|
2286
1728
|
setHighlightedIndex(null);
|
|
2287
1729
|
}
|
|
2288
1730
|
})), {
|
|
2289
|
-
"id":
|
|
2290
|
-
"showIcon":
|
|
2291
|
-
"showClear":
|
|
2292
|
-
"iconPosition":
|
|
2293
|
-
"ref":
|
|
2294
|
-
"class": getClassName$1(
|
|
2295
|
-
"placeholder":
|
|
2296
|
-
"autoFocus":
|
|
2297
|
-
"showFocusShortcutsIcon": _this15.$props.showFocusShortcutsIcon,
|
|
2298
|
-
"showVoiceSearch": _this15.$props.showVoiceSearch
|
|
1731
|
+
"id": _this11.$props.componentId + "-input",
|
|
1732
|
+
"showIcon": _this11.$props.showIcon,
|
|
1733
|
+
"showClear": _this11.$props.showClear,
|
|
1734
|
+
"iconPosition": _this11.$props.iconPosition,
|
|
1735
|
+
"ref": _this11.$props.innerRef,
|
|
1736
|
+
"class": getClassName$1(_this11.$props.innerClass, 'input'),
|
|
1737
|
+
"placeholder": _this11.$props.placeholder,
|
|
1738
|
+
"autoFocus": _this11.$props.autoFocus
|
|
2299
1739
|
}, getInputProps({
|
|
2300
|
-
value:
|
|
1740
|
+
value: _this11.$data.currentValue === null ? '' : _this11.$data.currentValue
|
|
2301
1741
|
}), {
|
|
2302
|
-
"themePreset":
|
|
1742
|
+
"themePreset": _this11.themePreset,
|
|
2303
1743
|
"autocomplete": "off"
|
|
2304
|
-
}), null)
|
|
2305
|
-
onInput: _this15.onInputChange,
|
|
2306
|
-
onBlur: function onBlur(e) {
|
|
2307
|
-
_this15.$emit('blur', e, _this15.triggerQuery);
|
|
2308
|
-
},
|
|
2309
|
-
onFocus: _this15.handleFocus,
|
|
2310
|
-
onKeyPress: function onKeyPress(e) {
|
|
2311
|
-
_this15.$emit('keyPress', e, _this15.triggerQuery);
|
|
2312
|
-
_this15.$emit('key-press', e, _this15.triggerQuery);
|
|
2313
|
-
},
|
|
2314
|
-
onKeyDown: function onKeyDown(e) {
|
|
2315
|
-
return _this15.handleKeyDown(e, highlightedIndex);
|
|
2316
|
-
},
|
|
2317
|
-
onKeyUp: function onKeyUp(e) {
|
|
2318
|
-
_this15.$emit('keyUp', e, _this15.triggerQuery);
|
|
2319
|
-
_this15.$emit('key-up', e, _this15.triggerQuery);
|
|
2320
|
-
},
|
|
2321
|
-
onClick: function onClick() {
|
|
2322
|
-
setHighlightedIndex(null);
|
|
2323
|
-
}
|
|
2324
|
-
})), {
|
|
2325
|
-
"id": _this15.$props.componentId + "-input",
|
|
2326
|
-
"showIcon": _this15.$props.showIcon,
|
|
2327
|
-
"showClear": _this15.$props.showClear,
|
|
2328
|
-
"iconPosition": _this15.$props.iconPosition,
|
|
2329
|
-
"ref": _this15.$props.innerRef,
|
|
2330
|
-
"class": getClassName$1(_this15.$props.innerClass, 'input'),
|
|
2331
|
-
"placeholder": _this15.$props.placeholder,
|
|
2332
|
-
"autoFocus": _this15.$props.autoFocus
|
|
2333
|
-
}, getInputProps({
|
|
2334
|
-
value: _this15.$data.currentValue === null ? '' : _this15.$data.currentValue
|
|
2335
|
-
}), {
|
|
2336
|
-
"themePreset": _this15.themePreset,
|
|
2337
|
-
"autocomplete": "off"
|
|
2338
|
-
}), null), _this15.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()];
|
|
1744
|
+
}), null), _this11.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()];
|
|
2339
1745
|
}
|
|
2340
|
-
}),
|
|
1746
|
+
}), _this11.renderInputAddonAfter(), _this11.renderEnterButtonElement()];
|
|
2341
1747
|
}
|
|
2342
|
-
}), expandSuggestionsContainer && renderSuggestionsDropdown(),
|
|
1748
|
+
}), expandSuggestionsContainer && renderSuggestionsDropdown(), _this11.renderTags()]);
|
|
2343
1749
|
}
|
|
2344
1750
|
}) : createVNode("div", {
|
|
2345
1751
|
"class": suggestionsContainer
|
|
2346
1752
|
}, [createVNode(InputGroup, null, {
|
|
2347
1753
|
"default": function _default() {
|
|
2348
|
-
return [
|
|
1754
|
+
return [_this11.renderInputAddonBefore(), createVNode(InputWrapper, null, {
|
|
2349
1755
|
"default": function _default() {
|
|
2350
1756
|
return [createVNode(Input, mergeProps(_transformOn({
|
|
2351
1757
|
blur: function blur(e) {
|
|
2352
|
-
|
|
1758
|
+
_this11.$emit('blur', e, _this11.triggerQuery);
|
|
2353
1759
|
},
|
|
2354
1760
|
keypress: function keypress(e) {
|
|
2355
|
-
|
|
2356
|
-
|
|
1761
|
+
_this11.$emit('keyPress', e, _this11.triggerQuery);
|
|
1762
|
+
_this11.$emit('key-press', e, _this11.triggerQuery);
|
|
2357
1763
|
},
|
|
2358
|
-
input:
|
|
1764
|
+
input: _this11.onInputChange,
|
|
2359
1765
|
focus: function focus(e) {
|
|
2360
|
-
|
|
1766
|
+
_this11.$emit('focus', e, _this11.triggerQuery);
|
|
2361
1767
|
},
|
|
2362
|
-
keydown:
|
|
1768
|
+
keydown: _this11.handleKeyDown,
|
|
2363
1769
|
keyup: function keyup(e) {
|
|
2364
|
-
|
|
2365
|
-
|
|
1770
|
+
_this11.$emit('keyUp', e, _this11.triggerQuery);
|
|
1771
|
+
_this11.$emit('key-up', e, _this11.triggerQuery);
|
|
2366
1772
|
}
|
|
2367
1773
|
}), {
|
|
2368
|
-
"class": getClassName$1(
|
|
2369
|
-
"placeholder":
|
|
2370
|
-
"autofocus":
|
|
2371
|
-
"value":
|
|
2372
|
-
"iconPosition":
|
|
2373
|
-
"showIcon":
|
|
2374
|
-
"showClear":
|
|
2375
|
-
"ref":
|
|
2376
|
-
"themePreset":
|
|
2377
|
-
}), null),
|
|
1774
|
+
"class": getClassName$1(_this11.$props.innerClass, 'input') || '',
|
|
1775
|
+
"placeholder": _this11.$props.placeholder,
|
|
1776
|
+
"autofocus": _this11.$props.autoFocus,
|
|
1777
|
+
"value": _this11.$data.currentValue ? _this11.$data.currentValue : '',
|
|
1778
|
+
"iconPosition": _this11.$props.iconPosition,
|
|
1779
|
+
"showIcon": _this11.$props.showIcon,
|
|
1780
|
+
"showClear": _this11.$props.showClear,
|
|
1781
|
+
"ref": _this11.$props.innerRef,
|
|
1782
|
+
"themePreset": _this11.themePreset
|
|
1783
|
+
}), null), _this11.renderIcons()];
|
|
2378
1784
|
}
|
|
2379
|
-
}),
|
|
1785
|
+
}), _this11.renderInputAddonAfter(), _this11.renderEnterButtonElement()];
|
|
2380
1786
|
}
|
|
2381
1787
|
})])];
|
|
2382
1788
|
}
|
|
@@ -2429,24 +1835,18 @@ var mapStateToProps = function mapStateToProps(state, props) {
|
|
|
2429
1835
|
rawData: state.rawData[props.componentId],
|
|
2430
1836
|
aggregationData: state.compositeAggregations[props.componentId] || [],
|
|
2431
1837
|
themePreset: state.config.themePreset,
|
|
2432
|
-
isLoading: !!state.isLoading[
|
|
1838
|
+
isLoading: !!state.isLoading[props.componentId + "_active"],
|
|
2433
1839
|
error: state.error[props.componentId],
|
|
2434
1840
|
time: state.hits[props.componentId] && state.hits[props.componentId].time || 0,
|
|
2435
1841
|
total: state.hits[props.componentId] && state.hits[props.componentId].total,
|
|
2436
|
-
hidden: state.hits[props.componentId] && state.hits[props.componentId].hidden
|
|
2437
|
-
AIResponse: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response || null,
|
|
2438
|
-
isAIResponseLoading: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].isLoading,
|
|
2439
|
-
AIResponseError: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].error,
|
|
2440
|
-
sessionIdFromStore: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.sessionId || '',
|
|
2441
|
-
isAITyping: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.isTyping || false
|
|
1842
|
+
hidden: state.hits[props.componentId] && state.hits[props.componentId].hidden
|
|
2442
1843
|
};
|
|
2443
1844
|
};
|
|
2444
1845
|
var mapDispatchToProps = {
|
|
2445
1846
|
updateQuery: updateQuery,
|
|
2446
1847
|
setCustomQuery: setCustomQuery,
|
|
2447
1848
|
setDefaultQuery: setDefaultQuery,
|
|
2448
|
-
recordSuggestionClick: recordSuggestionClick
|
|
2449
|
-
recordAISessionUsefulness: recordAISessionUsefulness
|
|
1849
|
+
recordSuggestionClick: recordSuggestionClick
|
|
2450
1850
|
};
|
|
2451
1851
|
var SBConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps, mapDispatchToProps)(SearchBox), {
|
|
2452
1852
|
componentType: componentTypes.searchBox,
|
|
@@ -2462,551 +1862,9 @@ SBConnected.install = function (Vue) {
|
|
|
2462
1862
|
// Add componentType for SSR
|
|
2463
1863
|
SBConnected.componentType = componentTypes.searchBox;
|
|
2464
1864
|
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
}
|
|
2468
|
-
var md$1 = new Remarkable();
|
|
2469
|
-
md$1.set({
|
|
2470
|
-
html: true,
|
|
2471
|
-
breaks: true,
|
|
2472
|
-
xhtmlOut: true
|
|
2473
|
-
});
|
|
2474
|
-
var _inputWrapperRef = 'inputWrapperRef';
|
|
2475
|
-
var _inputRef = 'inputRef';
|
|
2476
|
-
var _errorContainerRef = 'errorContainerRef';
|
|
2477
|
-
var AIAnswer = defineComponent({
|
|
2478
|
-
name: 'AIAnswer',
|
|
2479
|
-
data: function data() {
|
|
2480
|
-
var props = this.$props;
|
|
2481
|
-
this.__state = {
|
|
2482
|
-
messages: [],
|
|
2483
|
-
inputMessage: '',
|
|
2484
|
-
AISessionId: '',
|
|
2485
|
-
error: null
|
|
2486
|
-
};
|
|
2487
|
-
this.internalComponent = props.componentId + "__internal";
|
|
2488
|
-
return this.__state;
|
|
2489
|
-
},
|
|
2490
|
-
inject: {
|
|
2491
|
-
theme: {
|
|
2492
|
-
from: 'theme_reactivesearch'
|
|
2493
|
-
}
|
|
2494
|
-
},
|
|
2495
|
-
created: function created() {},
|
|
2496
|
-
computed: {
|
|
2497
|
-
hasCustomRenderer: function hasCustomRenderer$1() {
|
|
2498
|
-
return hasCustomRenderer(this);
|
|
2499
|
-
},
|
|
2500
|
-
isLoadingState: function isLoadingState() {
|
|
2501
|
-
return this.isAIResponseLoading || this.isLoading;
|
|
2502
|
-
},
|
|
2503
|
-
shouldShowComponent: function shouldShowComponent() {
|
|
2504
|
-
return this.showComponent;
|
|
2505
|
-
}
|
|
2506
|
-
},
|
|
2507
|
-
props: {
|
|
2508
|
-
componentId: types.string.isRequired,
|
|
2509
|
-
showVoiceInput: VueTypes.bool.def(false),
|
|
2510
|
-
showFeedback: VueTypes.bool.def(true),
|
|
2511
|
-
showIcon: VueTypes.bool.def(true),
|
|
2512
|
-
onData: types.func,
|
|
2513
|
-
innerRef: VueTypes.string.def('AISearchInputField'),
|
|
2514
|
-
react: types.react,
|
|
2515
|
-
enableAI: VueTypes.bool.def(true),
|
|
2516
|
-
AIConfig: types.AIConfig,
|
|
2517
|
-
iconPosition: types.iconPosition.def('left'),
|
|
2518
|
-
themePreset: types.themePreset,
|
|
2519
|
-
theme: types.style,
|
|
2520
|
-
icon: types.children,
|
|
2521
|
-
iconURL: VueTypes.string.def(''),
|
|
2522
|
-
renderMic: types.func,
|
|
2523
|
-
getMicInstance: types.func,
|
|
2524
|
-
innerClass: types.style,
|
|
2525
|
-
placeholder: VueTypes.string.def('Ask a question'),
|
|
2526
|
-
title: types.title,
|
|
2527
|
-
AIResponse: types.componentObject,
|
|
2528
|
-
isAIResponseLoading: VueTypes.bool.def(false),
|
|
2529
|
-
AIResponseError: types.componentObject,
|
|
2530
|
-
getAIResponse: types.func.isRequired,
|
|
2531
|
-
enterButton: types.bool,
|
|
2532
|
-
renderEnterButton: types.title,
|
|
2533
|
-
showInput: VueTypes.bool.def(true),
|
|
2534
|
-
clearSessionOnDestroy: VueTypes.bool.def(true),
|
|
2535
|
-
rawData: types.rawData,
|
|
2536
|
-
render: types.func,
|
|
2537
|
-
onError: types.func,
|
|
2538
|
-
renderError: types.title,
|
|
2539
|
-
isLoading: types.boolRequired,
|
|
2540
|
-
sessionIdFromStore: VueTypes.string,
|
|
2541
|
-
showComponent: types.boolRequired
|
|
2542
|
-
},
|
|
2543
|
-
mounted: function mounted() {},
|
|
2544
|
-
watch: {
|
|
2545
|
-
AIResponse: function AIResponse(newVal) {
|
|
2546
|
-
if (newVal) {
|
|
2547
|
-
this.AISessionId = ((getObjectFromLocalStorage(AI_LOCAL_CACHE_KEY) || {})[this.$props.componentId] || {}).sessionId || null;
|
|
2548
|
-
var messagesHistory = newVal.messages,
|
|
2549
|
-
response = newVal.response;
|
|
2550
|
-
var finalMessages = [];
|
|
2551
|
-
if (response && response.error) {
|
|
2552
|
-
this.error = {
|
|
2553
|
-
message: response.error
|
|
2554
|
-
};
|
|
2555
|
-
}
|
|
2556
|
-
|
|
2557
|
-
// pushing message history so far
|
|
2558
|
-
if (messagesHistory && messagesHistory && Array.isArray(messagesHistory)) {
|
|
2559
|
-
finalMessages.push.apply(finalMessages, messagesHistory.filter(function (msg) {
|
|
2560
|
-
return msg.role !== AI_ROLES.SYSTEM;
|
|
2561
|
-
}));
|
|
2562
|
-
}
|
|
2563
|
-
// fresh response
|
|
2564
|
-
if (response && response.answer) ;
|
|
2565
|
-
this.messages = finalMessages;
|
|
2566
|
-
} else if (!newVal && !this.error) {
|
|
2567
|
-
this.messages = [];
|
|
2568
|
-
}
|
|
2569
|
-
},
|
|
2570
|
-
rawData: function rawData(newVal) {
|
|
2571
|
-
this.$emit('on-data', {
|
|
2572
|
-
data: this.messages,
|
|
2573
|
-
rawData: newVal,
|
|
2574
|
-
loading: this.$props.isAIResponseLoading || this.$props.isLoading,
|
|
2575
|
-
error: this.$props.AIResponseError
|
|
2576
|
-
});
|
|
2577
|
-
},
|
|
2578
|
-
isAIResponseLoading: function isAIResponseLoading(newVal) {
|
|
2579
|
-
this.isLoadingState = newVal;
|
|
2580
|
-
this.$emit('on-data', {
|
|
2581
|
-
data: this.messages,
|
|
2582
|
-
rawData: this.$props.rawData,
|
|
2583
|
-
loading: newVal || this.$props.isLoading,
|
|
2584
|
-
error: this.$props.AIResponseError
|
|
2585
|
-
});
|
|
2586
|
-
},
|
|
2587
|
-
isLoading: function isLoading(newVal) {
|
|
2588
|
-
this.isLoadingState = newVal;
|
|
2589
|
-
this.$emit('on-data', {
|
|
2590
|
-
data: this.messages,
|
|
2591
|
-
rawData: this.$props.rawData,
|
|
2592
|
-
loading: newVal || this.$props.isLoading,
|
|
2593
|
-
error: this.$props.AIResponseError
|
|
2594
|
-
});
|
|
2595
|
-
},
|
|
2596
|
-
sessionIdFromStore: function sessionIdFromStore(newVal) {
|
|
2597
|
-
if (newVal) {
|
|
2598
|
-
this.sessionId = newVal;
|
|
2599
|
-
}
|
|
2600
|
-
},
|
|
2601
|
-
AIResponseError: function AIResponseError(newVal) {
|
|
2602
|
-
this.error = newVal;
|
|
2603
|
-
this.AISessionId = ((getObjectFromLocalStorage(AI_LOCAL_CACHE_KEY) || {})[this.$props.componentId] || {}).sessionId || null;
|
|
2604
|
-
this.$emit('on-data', {
|
|
2605
|
-
data: this.messages,
|
|
2606
|
-
rawData: this.$props.rawData,
|
|
2607
|
-
loading: this.$props.isAIResponseLoading || this.$props.isLoading,
|
|
2608
|
-
error: newVal
|
|
2609
|
-
});
|
|
2610
|
-
},
|
|
2611
|
-
messages: function messages() {
|
|
2612
|
-
this.scrollToBottom();
|
|
2613
|
-
}
|
|
2614
|
-
},
|
|
2615
|
-
methods: {
|
|
2616
|
-
scrollToBottom: function scrollToBottom() {
|
|
2617
|
-
var _this = this;
|
|
2618
|
-
this.$nextTick(function () {
|
|
2619
|
-
var _this$$refs;
|
|
2620
|
-
var messageContainer = (_this$$refs = _this.$refs) == null ? void 0 : _this$$refs[_this.$props.innerRef];
|
|
2621
|
-
if (messageContainer && messageContainer.$el) {
|
|
2622
|
-
messageContainer.$el.scrollTo({
|
|
2623
|
-
top: messageContainer.$el.scrollHeight,
|
|
2624
|
-
behavior: 'smooth'
|
|
2625
|
-
});
|
|
2626
|
-
}
|
|
2627
|
-
});
|
|
2628
|
-
},
|
|
2629
|
-
handleMessageInputChange: function handleMessageInputChange(e) {
|
|
2630
|
-
this.inputMessage = e.target.value;
|
|
2631
|
-
this.handleTextAreaHeightChange();
|
|
2632
|
-
},
|
|
2633
|
-
handleSendMessage: function handleSendMessage(e, isRetry, text) {
|
|
2634
|
-
if (isRetry === void 0) {
|
|
2635
|
-
isRetry = false;
|
|
2636
|
-
}
|
|
2637
|
-
if (text === void 0) {
|
|
2638
|
-
text = this.inputMessage;
|
|
2639
|
-
}
|
|
2640
|
-
if (typeof e === 'object') e.preventDefault();
|
|
2641
|
-
if (text.trim()) {
|
|
2642
|
-
if (this.isLoadingState) {
|
|
2643
|
-
return;
|
|
2644
|
-
}
|
|
2645
|
-
if (this.AISessionId) {
|
|
2646
|
-
if (!isRetry) this.messages = [].concat(this.messages, [{
|
|
2647
|
-
content: text,
|
|
2648
|
-
role: AI_ROLES.USER
|
|
2649
|
-
}]);
|
|
2650
|
-
this.getAIResponse(this.AISessionId, this.componentId, text);
|
|
2651
|
-
} else {
|
|
2652
|
-
console.error("AISessionId for " + this.$props.componentId + " is missing! AIAnswer component requires an AISession to function. Try reloading the App.");
|
|
2653
|
-
this.error = {
|
|
2654
|
-
message: "AISessionId for " + this.$props.componentId + " is missing! AIAnswer component requires an AISession to function. Trying reloading the App."
|
|
2655
|
-
};
|
|
2656
|
-
}
|
|
2657
|
-
this.inputMessage = '';
|
|
2658
|
-
}
|
|
2659
|
-
},
|
|
2660
|
-
handleRetryRequest: function handleRetryRequest() {
|
|
2661
|
-
if (this.messages && !this.isLoadingState) {
|
|
2662
|
-
var _this$messages;
|
|
2663
|
-
var lastUserRequestMessage = (_this$messages = this.messages[this.messages.length - 1]) == null ? void 0 : _this$messages.content;
|
|
2664
|
-
if (this.AISessionId) {
|
|
2665
|
-
this.getAIResponse(this.AISessionId, this.componentId, lastUserRequestMessage);
|
|
2666
|
-
this.inputMessage = '';
|
|
2667
|
-
} else {
|
|
2668
|
-
console.error("AISessionId for " + this.componentId + " is missing! AIAnswer component requires an AISession to function. Try reloading the App.");
|
|
2669
|
-
}
|
|
2670
|
-
}
|
|
2671
|
-
},
|
|
2672
|
-
renderErrorComponent: function renderErrorComponent() {
|
|
2673
|
-
var renderError = this.$slots.renderError || this.$props.renderError;
|
|
2674
|
-
if (this.error && !this.isLoadingState) {
|
|
2675
|
-
var _this$error, _this$error2;
|
|
2676
|
-
if (renderError) {
|
|
2677
|
-
return createVNode("div", {
|
|
2678
|
-
"ref": _errorContainerRef,
|
|
2679
|
-
"class": "--ai-answer-error-container " + (getClassName$2(this.$props.innerClass, 'ai-error') || '')
|
|
2680
|
-
}, [isFunction(renderError) ? renderError(this.error, this.handleRetryRequest) : renderError]);
|
|
2681
|
-
}
|
|
2682
|
-
return createVNode("div", {
|
|
2683
|
-
"ref": _errorContainerRef,
|
|
2684
|
-
"class": "--ai-answer-error-container " + (getClassName$2(this.$props.innerClass, 'ai-error') || '')
|
|
2685
|
-
}, [createVNode("div", {
|
|
2686
|
-
"class": "--default-error-element"
|
|
2687
|
-
}, [createVNode("span", null, [(_this$error = this.error) != null && _this$error.message ? this.error.message : 'There was an error in generating the response.', ' ', (_this$error2 = this.error) != null && _this$error2.code ? "Code:\n\t\t\t\t\t\t\t" + this.error.code : '']), this.AISessionId && createVNode(Button, {
|
|
2688
|
-
"primary": true,
|
|
2689
|
-
"onClick": this.handleRetryRequest
|
|
2690
|
-
}, {
|
|
2691
|
-
"default": function _default() {
|
|
2692
|
-
return [createTextVNode("Try again")];
|
|
2693
|
-
}
|
|
2694
|
-
})])]);
|
|
2695
|
-
}
|
|
2696
|
-
return null;
|
|
2697
|
-
},
|
|
2698
|
-
handleKeyPress: function handleKeyPress(e) {
|
|
2699
|
-
if (e.key === 'Enter') {
|
|
2700
|
-
this.handleSendMessage(e);
|
|
2701
|
-
this.inputMessage = '';
|
|
2702
|
-
}
|
|
2703
|
-
},
|
|
2704
|
-
renderIcon: function renderIcon() {
|
|
2705
|
-
if (this.$props.showIcon) {
|
|
2706
|
-
if (this.$props.icon) {
|
|
2707
|
-
return this.$props.icon;
|
|
2708
|
-
}
|
|
2709
|
-
if (this.$slots.icon) {
|
|
2710
|
-
return this.$slots.icon();
|
|
2711
|
-
}
|
|
2712
|
-
if (this.$props.iconURL) {
|
|
2713
|
-
return createVNode("img", {
|
|
2714
|
-
"style": {
|
|
2715
|
-
maxHeight: '25px'
|
|
2716
|
-
},
|
|
2717
|
-
"src": this.$props.iconURL,
|
|
2718
|
-
"alt": "search-icon"
|
|
2719
|
-
}, null);
|
|
2720
|
-
}
|
|
2721
|
-
return createVNode(SearchSvg, null, null);
|
|
2722
|
-
}
|
|
2723
|
-
return null;
|
|
2724
|
-
},
|
|
2725
|
-
shouldMicRender: function shouldMicRender(showVoiceSearch) {
|
|
2726
|
-
// checks for SSR
|
|
2727
|
-
if (typeof window === 'undefined') return false;
|
|
2728
|
-
return showVoiceSearch && (window.webkitSpeechRecognition || window.SpeechRecognition);
|
|
2729
|
-
},
|
|
2730
|
-
handleVoiceResults: function handleVoiceResults(_ref) {
|
|
2731
|
-
var results = _ref.results;
|
|
2732
|
-
if (results && results[0] && results[0].isFinal && results[0][0] && results[0][0].transcript && results[0][0].transcript.trim()) {
|
|
2733
|
-
this.handleSendMessage(null, false, results[0][0].transcript.trim());
|
|
2734
|
-
}
|
|
2735
|
-
},
|
|
2736
|
-
renderIcons: function renderIcons() {
|
|
2737
|
-
var _this2 = this;
|
|
2738
|
-
var _slot, _slot2;
|
|
2739
|
-
var _this$$props = this.$props,
|
|
2740
|
-
getMicInstance = _this$$props.getMicInstance,
|
|
2741
|
-
showVoiceInput = _this$$props.showVoiceInput,
|
|
2742
|
-
iconPosition = _this$$props.iconPosition,
|
|
2743
|
-
innerClass = _this$$props.innerClass;
|
|
2744
|
-
var renderMic = this.$slots.renderMic || this.$props.renderMic;
|
|
2745
|
-
return createVNode("div", null, [createVNode(IconGroup, {
|
|
2746
|
-
"enableAI": true,
|
|
2747
|
-
"groupPosition": "right",
|
|
2748
|
-
"positionType": "absolute"
|
|
2749
|
-
}, {
|
|
2750
|
-
"default": function _default() {
|
|
2751
|
-
return [_this2.shouldMicRender(showVoiceInput) && createVNode(Mic, {
|
|
2752
|
-
"getInstance": getMicInstance,
|
|
2753
|
-
"render": renderMic,
|
|
2754
|
-
"onResult": _this2.handleVoiceResults,
|
|
2755
|
-
"class": getClassName$2(innerClass, 'ai-search-mic') || null
|
|
2756
|
-
}, null), iconPosition === 'right' && createVNode(IconWrapper, null, _isSlot$1(_slot = _this2.renderIcon()) ? _slot : {
|
|
2757
|
-
"default": function _default() {
|
|
2758
|
-
return [_slot];
|
|
2759
|
-
}
|
|
2760
|
-
})];
|
|
2761
|
-
}
|
|
2762
|
-
}), createVNode(IconGroup, {
|
|
2763
|
-
"enableAI": true,
|
|
2764
|
-
"groupPosition": "left",
|
|
2765
|
-
"positionType": "absolute"
|
|
2766
|
-
}, {
|
|
2767
|
-
"default": function _default() {
|
|
2768
|
-
return [iconPosition === 'left' && createVNode(IconWrapper, null, _isSlot$1(_slot2 = _this2.renderIcon()) ? _slot2 : {
|
|
2769
|
-
"default": function _default() {
|
|
2770
|
-
return [_slot2];
|
|
2771
|
-
}
|
|
2772
|
-
})];
|
|
2773
|
-
}
|
|
2774
|
-
})]);
|
|
2775
|
-
},
|
|
2776
|
-
enterButtonOnClick: function enterButtonOnClick(e) {
|
|
2777
|
-
this.handleSendMessage(e);
|
|
2778
|
-
},
|
|
2779
|
-
renderEnterButtonElement: function renderEnterButtonElement() {
|
|
2780
|
-
var _this3 = this;
|
|
2781
|
-
var _this$$props2 = this.$props,
|
|
2782
|
-
enterButton = _this$$props2.enterButton,
|
|
2783
|
-
innerClass = _this$$props2.innerClass;
|
|
2784
|
-
var renderEnterButton = this.$slots.renderEnterButton;
|
|
2785
|
-
if (enterButton) {
|
|
2786
|
-
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
2787
|
-
if (renderEnterButton) {
|
|
2788
|
-
return renderEnterButton(_this3.enterButtonOnClick);
|
|
2789
|
-
}
|
|
2790
|
-
return createVNode(SendButton, {
|
|
2791
|
-
"primary": true,
|
|
2792
|
-
"type": "submit",
|
|
2793
|
-
"tabIndex": 0,
|
|
2794
|
-
"onClick": _this3.handleSendMessage,
|
|
2795
|
-
"onKeyPress": _this3.handleKeyPress,
|
|
2796
|
-
"class": "enter-btn " + getClassName$2(innerClass, 'ai-enter-button')
|
|
2797
|
-
}, {
|
|
2798
|
-
"default": function _default() {
|
|
2799
|
-
return [createTextVNode("Send")];
|
|
2800
|
-
}
|
|
2801
|
-
});
|
|
2802
|
-
};
|
|
2803
|
-
return createVNode("div", {
|
|
2804
|
-
"class": "ai-enter-button-wrapper"
|
|
2805
|
-
}, [getEnterButtonMarkup()]);
|
|
2806
|
-
}
|
|
2807
|
-
return null;
|
|
2808
|
-
},
|
|
2809
|
-
getComponent: function getComponent$1() {
|
|
2810
|
-
var data = {
|
|
2811
|
-
error: this.AIResponseError,
|
|
2812
|
-
loading: this.isAIResponseLoading,
|
|
2813
|
-
data: this.messages,
|
|
2814
|
-
rawData: this.rawData
|
|
2815
|
-
};
|
|
2816
|
-
return getComponent(data, this);
|
|
2817
|
-
},
|
|
2818
|
-
handleTextAreaHeightChange: function handleTextAreaHeightChange() {
|
|
2819
|
-
var _this$$refs2, _this$$refs2$_inputRe, _this$$refs3, _this$$refs3$_inputWr, _this$$refs4;
|
|
2820
|
-
var textArea = (_this$$refs2 = this.$refs) == null ? void 0 : (_this$$refs2$_inputRe = _this$$refs2[_inputRef]) == null ? void 0 : _this$$refs2$_inputRe.$el;
|
|
2821
|
-
var inputWrapper = (_this$$refs3 = this.$refs) == null ? void 0 : (_this$$refs3$_inputWr = _this$$refs3[_inputWrapperRef]) == null ? void 0 : _this$$refs3$_inputWr.$el;
|
|
2822
|
-
var errorContainer = (_this$$refs4 = this.$refs) == null ? void 0 : _this$$refs4[_errorContainerRef];
|
|
2823
|
-
if (textArea) {
|
|
2824
|
-
textArea.style.height = '42px';
|
|
2825
|
-
var lineHeight = parseInt(getComputedStyle(textArea).lineHeight, 10);
|
|
2826
|
-
var maxHeight = lineHeight * 11; // max height for 10 lines
|
|
2827
|
-
var height = Math.min(textArea.scrollHeight, maxHeight);
|
|
2828
|
-
textArea.style.height = height + "px";
|
|
2829
|
-
textArea.style.overflowY = height === maxHeight ? 'auto' : 'hidden';
|
|
2830
|
-
// wrapper around input/ textarea
|
|
2831
|
-
inputWrapper.style.height = height + "px";
|
|
2832
|
-
// adjust error-container
|
|
2833
|
-
|
|
2834
|
-
if (errorContainer) {
|
|
2835
|
-
errorContainer.style.bottom = height + "px";
|
|
2836
|
-
}
|
|
2837
|
-
this.$forceUpdate();
|
|
2838
|
-
}
|
|
2839
|
-
}
|
|
2840
|
-
},
|
|
2841
|
-
beforeUnmount: function beforeUnmount() {
|
|
2842
|
-
if (this.$props.clearSessionOnDestroy) {
|
|
2843
|
-
// cleanup logic
|
|
2844
|
-
// final Object to store in local storage cache
|
|
2845
|
-
var finalCacheObj = getObjectFromLocalStorage(AI_LOCAL_CACHE_KEY) || {};
|
|
2846
|
-
// delete current component's cache
|
|
2847
|
-
delete finalCacheObj[this.$props.componentId];
|
|
2848
|
-
// update local cache
|
|
2849
|
-
setObjectInLocalStorage(AI_LOCAL_CACHE_KEY, finalCacheObj);
|
|
2850
|
-
}
|
|
2851
|
-
},
|
|
2852
|
-
render: function render() {
|
|
2853
|
-
var _slot3;
|
|
2854
|
-
var _this4 = this;
|
|
2855
|
-
var props = this.$props;
|
|
2856
|
-
if (!this.shouldShowComponent) {
|
|
2857
|
-
return null;
|
|
2858
|
-
}
|
|
2859
|
-
return createVNode(Chatbox, null, {
|
|
2860
|
-
"default": function _default() {
|
|
2861
|
-
return [_this4.$props.title && createVNode(Title, {
|
|
2862
|
-
"class": getClassName$2(_this4.$props.innerClass, 'title') || ''
|
|
2863
|
-
}, {
|
|
2864
|
-
"default": function _default() {
|
|
2865
|
-
return [_this4.$props.title];
|
|
2866
|
-
}
|
|
2867
|
-
}), createVNode(ChatContainer, {
|
|
2868
|
-
"theme": props.theme,
|
|
2869
|
-
"showInput": props.showInput
|
|
2870
|
-
}, {
|
|
2871
|
-
"default": function _default() {
|
|
2872
|
-
return [_this4.hasCustomRenderer && createVNode(MessagesContainer, {
|
|
2873
|
-
"themePreset": _this4.themePreset,
|
|
2874
|
-
"theme": props.theme,
|
|
2875
|
-
"ref": _this4.$props.innerRef,
|
|
2876
|
-
"class": "--ai-message-container " + (getClassName$2(props.innerClass, 'ai-message-container') || '')
|
|
2877
|
-
}, _isSlot$1(_slot3 = _this4.getComponent()) ? _slot3 : {
|
|
2878
|
-
"default": function _default() {
|
|
2879
|
-
return [_slot3];
|
|
2880
|
-
}
|
|
2881
|
-
}), !_this4.hasCustomRenderer && createVNode(MessagesContainer, {
|
|
2882
|
-
"themePreset": _this4.themePreset,
|
|
2883
|
-
"theme": props.theme,
|
|
2884
|
-
"ref": _this4.$props.innerRef,
|
|
2885
|
-
"class": "--ai-message-container " + (getClassName$2(props.innerClass, 'ai-message-container') || '')
|
|
2886
|
-
}, {
|
|
2887
|
-
"default": function _default() {
|
|
2888
|
-
return [_this4.messages.map(function (message, index) {
|
|
2889
|
-
return createVNode(Message, {
|
|
2890
|
-
"key": index,
|
|
2891
|
-
"isSender": message.role === AI_ROLES.USER,
|
|
2892
|
-
"innerHTML": md$1.render(message.content),
|
|
2893
|
-
"themePreset": _this4.themePreset,
|
|
2894
|
-
"theme": props.theme,
|
|
2895
|
-
"class": "--ai-answer-message " + (getClassName$2(props.innerClass, 'ai-message') || '')
|
|
2896
|
-
}, null);
|
|
2897
|
-
}), _this4.isLoadingState && createVNode(Message, {
|
|
2898
|
-
"themePreset": _this4.themePreset,
|
|
2899
|
-
"theme": props.theme,
|
|
2900
|
-
"isSender": false,
|
|
2901
|
-
"class": "--ai-answer-message " + (getClassName$2(props.innerClass, 'ai-message') || null)
|
|
2902
|
-
}, {
|
|
2903
|
-
"default": function _default() {
|
|
2904
|
-
return [createVNode(TypingIndicator, null, {
|
|
2905
|
-
"default": function _default() {
|
|
2906
|
-
return [createVNode(TypingDot, {
|
|
2907
|
-
"themePreset": _this4.themePreset
|
|
2908
|
-
}, null), createVNode(TypingDot, {
|
|
2909
|
-
"themePreset": _this4.themePreset
|
|
2910
|
-
}, null), createVNode(TypingDot, {
|
|
2911
|
-
"themePreset": _this4.themePreset
|
|
2912
|
-
}, null)];
|
|
2913
|
-
}
|
|
2914
|
-
})];
|
|
2915
|
-
}
|
|
2916
|
-
})];
|
|
2917
|
-
}
|
|
2918
|
-
}), _this4.renderErrorComponent(), ' ', props.showFeedback && createVNode("div", {
|
|
2919
|
-
"class": "--ai-answer-feedback-container " + (getClassName$2(props.innerClass, 'ai-feedback') || '')
|
|
2920
|
-
}, [createVNode(AIFeedback, {
|
|
2921
|
-
"hideUI": _this4.isLoadingState || !_this4.sessionId,
|
|
2922
|
-
"key": _this4.sessionId,
|
|
2923
|
-
"onFeedbackSubmit": function onFeedbackSubmit(useful, reason) {
|
|
2924
|
-
_this4.trackUsefullness(_this4.sessionId, {
|
|
2925
|
-
useful: useful,
|
|
2926
|
-
reason: reason
|
|
2927
|
-
});
|
|
2928
|
-
}
|
|
2929
|
-
}, null)]), props.showInput && createVNode(MessageInputContainer, {
|
|
2930
|
-
"class": "--ai-input-container",
|
|
2931
|
-
"onSubmit": _this4.handleSendMessage
|
|
2932
|
-
}, {
|
|
2933
|
-
"default": function _default() {
|
|
2934
|
-
return [createVNode(InputGroup, {
|
|
2935
|
-
"enableAI": true,
|
|
2936
|
-
"isOpen": false
|
|
2937
|
-
}, {
|
|
2938
|
-
"default": function _default() {
|
|
2939
|
-
return [createVNode(InputWrapper, {
|
|
2940
|
-
"ref": _inputWrapperRef
|
|
2941
|
-
}, {
|
|
2942
|
-
"default": function _default() {
|
|
2943
|
-
return [createVNode(MessageInput, {
|
|
2944
|
-
"ref": _inputRef,
|
|
2945
|
-
"type": "text",
|
|
2946
|
-
"placeholder": props.placeholder,
|
|
2947
|
-
"enterButton": props.enterButton,
|
|
2948
|
-
"value": _this4.inputMessage,
|
|
2949
|
-
"onInput": _this4.handleMessageInputChange,
|
|
2950
|
-
"onKeyPress": _this4.handleKeyPress,
|
|
2951
|
-
"id": props.componentId + "-ai-input",
|
|
2952
|
-
"showIcon": props.showIcon,
|
|
2953
|
-
"iconPosition": props.iconPosition,
|
|
2954
|
-
"themePreset": _this4.themePreset,
|
|
2955
|
-
"disabled": _this4.isLoadingState,
|
|
2956
|
-
"class": getClassName$2(props.innerClass, 'ai-input') || null
|
|
2957
|
-
}, null), ' ', _this4.renderIcons()];
|
|
2958
|
-
}
|
|
2959
|
-
})];
|
|
2960
|
-
}
|
|
2961
|
-
}), _this4.renderEnterButtonElement()];
|
|
2962
|
-
}
|
|
2963
|
-
}), ' '];
|
|
2964
|
-
}
|
|
2965
|
-
})];
|
|
2966
|
-
}
|
|
2967
|
-
});
|
|
2968
|
-
}
|
|
2969
|
-
});
|
|
2970
|
-
AIAnswer.hasInternalComponent = function () {
|
|
2971
|
-
return true;
|
|
2972
|
-
};
|
|
2973
|
-
var mapStateToProps$1 = function mapStateToProps(state, props) {
|
|
2974
|
-
var dependencyComponent = Object.values(props.react)[0];
|
|
2975
|
-
if (Array.isArray(dependencyComponent)) {
|
|
2976
|
-
// eslint-disable-next-line prefer-destructuring
|
|
2977
|
-
dependencyComponent = dependencyComponent[0];
|
|
2978
|
-
}
|
|
2979
|
-
var showComponent = state.selectedValues[dependencyComponent] && state.selectedValues[dependencyComponent].value;
|
|
2980
|
-
return {
|
|
2981
|
-
showComponent: showComponent,
|
|
2982
|
-
AIResponse: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response,
|
|
2983
|
-
isAIResponseLoading: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].isLoading,
|
|
2984
|
-
AIResponseError: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].error,
|
|
2985
|
-
rawData: state.rawData[props.componentId],
|
|
2986
|
-
themePreset: state.config.themePreset,
|
|
2987
|
-
isLoading: state.isLoading[props.componentId] || false,
|
|
2988
|
-
sessionIdFromStore: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.sessionId || ''
|
|
2989
|
-
};
|
|
2990
|
-
};
|
|
2991
|
-
var mapDispatchToProps$1 = {
|
|
2992
|
-
getAIResponse: fetchAIResponse,
|
|
2993
|
-
trackUsefullness: recordAISessionUsefulness
|
|
2994
|
-
};
|
|
2995
|
-
var AIConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps$1, mapDispatchToProps$1)(AIAnswer), {
|
|
2996
|
-
componentType: componentTypes.AIAnswer,
|
|
2997
|
-
internalComponent: true
|
|
2998
|
-
}));
|
|
2999
|
-
AIConnected.name = AIAnswer.name;
|
|
3000
|
-
AIConnected.hasInternalComponent = AIAnswer.hasInternalComponent;
|
|
3001
|
-
AIConnected.install = function (Vue) {
|
|
3002
|
-
Vue.component(AIConnected.name, AIConnected);
|
|
3003
|
-
};
|
|
3004
|
-
// Add componentType for SSR
|
|
3005
|
-
AIConnected.componentType = componentTypes.AIAnswer;
|
|
3006
|
-
|
|
3007
|
-
var _templateObject$b, _templateObject2$4;
|
|
3008
|
-
var HierarchicalMenuList = styled('ul')(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n\tlist-style: none;\n\tpadding: 0;\n\tmargin: 0;\n\tmax-height: 0;\n\toverflow: hidden;\n\n\t&.--open {\n\t\tmax-height: 100%;\n\t}\n"])));
|
|
3009
|
-
var HierarchicalMenuListItem = styled('li')(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n\tfont-weight: 400;\n\tline-height: 1.5;\n\tbox-sizing: border-box;\n\n\ta {\n\t\tcolor: #424242;\n\t\ttext-decoration: none;\n\t\tgap: 5px;\n\t\t.--leaf-icon,\n\t\t.--folder-icon {\n\t\t\tline-height: 15px;\n\t\t\tsvg {\n\t\t\t\theight: 15px;\n\t\t\t}\n\t\t}\n\n\t\tinput {\n\t\t\tmargin: 0;\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n\n\t.--switcher-icon {\n\t\ttransition: all 0.2s ease-in;\n\t\tmargin-right: 2px;\n\t}\n\t.--list-child {\n\t\tpadding-left: 1rem;\n\t\tposition: relative;\n\t\t&:before {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\tborder-left: 1px solid #787878;\n\t\t\twidth: 0;\n\t\t\tleft: 19px;\n\t\t\t", ";\n\t\t}\n\n\t\t&.--show-switcher-icon {\n\t\t\tpadding-left: 36px;\n\t\t}\n\t}\n\t.--list-item-label {\n\t\tline-height: 100%;\n\t}\n\t.--list-item-count {\n\t\tmargin-left: 10px;\n\t\tpadding: 0.1rem 0.4rem;\n\t\tfont-size: 0.8rem;\n\t\tcolor: #424242;\n\t\tbackground-color: #dee1e6;\n\t\tborder-radius: 8px;\n\t}\n\t&.-selected-item {\n\t\tfont-weight: 700 !important;\n\t}\n\t&.-expanded-item {\n\t\t& > a {\n\t\t\t& div > .--switcher-icon {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\t\t}\n\t}\n\t.--list-item-label-count-wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t&:hover {\n\t\t\t.--list-item-count,\n\t\t\t.--list-item-label {\n\t\t\t\tfont-weight: 700;\n\t\t\t}\n\t\t}\n\t}\n"])), function (props) {
|
|
1865
|
+
var _templateObject$8, _templateObject2$1;
|
|
1866
|
+
var HierarchicalMenuList = styled('ul')(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n\tlist-style: none;\n\tpadding: 0;\n\tmargin: 0;\n\tmax-height: 0;\n\toverflow: hidden;\n\n\t&.--open {\n\t\tmax-height: 100%;\n\t}\n"])));
|
|
1867
|
+
var HierarchicalMenuListItem = styled('li')(_templateObject2$1 || (_templateObject2$1 = _taggedTemplateLiteralLoose(["\n\tfont-weight: 400;\n\tline-height: 1.5;\n\tbox-sizing: border-box;\n\n\ta {\n\t\tcolor: #424242;\n\t\ttext-decoration: none;\n\t\tgap: 5px;\n\t\t.--leaf-icon,\n\t\t.--folder-icon {\n\t\t\tline-height: 15px;\n\t\t\tsvg {\n\t\t\t\theight: 15px;\n\t\t\t}\n\t\t}\n\n\t\tinput {\n\t\t\tmargin: 0;\n\t\t\tcursor: pointer;\n\t\t}\n\t}\n\n\t.--switcher-icon {\n\t\ttransition: all 0.2s ease-in;\n\t\tmargin-right: 2px;\n\t}\n\t.--list-child {\n\t\tpadding-left: 1rem;\n\t\tposition: relative;\n\t\t&:before {\n\t\t\theight: 100%;\n\t\t\tcontent: '';\n\t\t\tposition: absolute;\n\t\t\tborder-left: 1px solid #787878;\n\t\t\twidth: 0;\n\t\t\tleft: 19px;\n\t\t\t", ";\n\t\t}\n\n\t\t&.--show-switcher-icon {\n\t\t\tpadding-left: 36px;\n\t\t}\n\t}\n\t.--list-item-label {\n\t\tline-height: 100%;\n\t}\n\t.--list-item-count {\n\t\tmargin-left: 10px;\n\t\tpadding: 0.1rem 0.4rem;\n\t\tfont-size: 0.8rem;\n\t\tcolor: #424242;\n\t\tbackground-color: #dee1e6;\n\t\tborder-radius: 8px;\n\t}\n\t&.-selected-item {\n\t\tfont-weight: 700 !important;\n\t}\n\t&.-expanded-item {\n\t\t& > a {\n\t\t\t& div > .--switcher-icon {\n\t\t\t\ttransform: rotate(90deg);\n\t\t\t}\n\t\t}\n\t}\n\t.--list-item-label-count-wrapper {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\t&:hover {\n\t\t\t.--list-item-count,\n\t\t\t.--list-item-label {\n\t\t\t\tfont-weight: 700;\n\t\t\t}\n\t\t}\n\t}\n"])), function (props) {
|
|
3010
1868
|
return !props.showLine && "\n\t\t\t\t\tdisplay: none;\n\t\t\t\t";
|
|
3011
1869
|
});
|
|
3012
1870
|
|
|
@@ -3219,7 +2077,7 @@ var HierarchicalMenuListItemComponent = {
|
|
|
3219
2077
|
}
|
|
3220
2078
|
};
|
|
3221
2079
|
|
|
3222
|
-
function _isSlot$
|
|
2080
|
+
function _isSlot$1(s) {
|
|
3223
2081
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
|
|
3224
2082
|
}
|
|
3225
2083
|
var HierarchicalMenuComponent = {
|
|
@@ -3244,7 +2102,7 @@ var HierarchicalMenuComponent = {
|
|
|
3244
2102
|
return createVNode(HierarchicalMenuList, {
|
|
3245
2103
|
"class": "" + (isExpanded ? '--open' : ''),
|
|
3246
2104
|
"isSelected": isExpanded
|
|
3247
|
-
}, _isSlot$
|
|
2105
|
+
}, _isSlot$1(_slot = listArray.map(function (listItem) {
|
|
3248
2106
|
return createVNode(HierarchicalMenuListItemComponent, mergeProps({
|
|
3249
2107
|
"key": parentPath + "__" + JSON.stringify(listItem),
|
|
3250
2108
|
"parentPath": parentPath,
|
|
@@ -3258,7 +2116,7 @@ var HierarchicalMenuComponent = {
|
|
|
3258
2116
|
}
|
|
3259
2117
|
};
|
|
3260
2118
|
|
|
3261
|
-
function _isSlot$
|
|
2119
|
+
function _isSlot$2(s) {
|
|
3262
2120
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
|
|
3263
2121
|
}
|
|
3264
2122
|
var updateQueryAction = Actions.updateQuery,
|
|
@@ -3708,7 +2566,7 @@ var TreeList = {
|
|
|
3708
2566
|
"default": function _default() {
|
|
3709
2567
|
return [props.title && createVNode(Title, {
|
|
3710
2568
|
"class": getClassName$2(innerClass, 'title') || null
|
|
3711
|
-
}, _isSlot$
|
|
2569
|
+
}, _isSlot$2(title) ? title : {
|
|
3712
2570
|
"default": function _default() {
|
|
3713
2571
|
return [title];
|
|
3714
2572
|
}
|
|
@@ -3737,7 +2595,7 @@ var TreeList = {
|
|
|
3737
2595
|
});
|
|
3738
2596
|
}
|
|
3739
2597
|
};
|
|
3740
|
-
var mapStateToProps$
|
|
2598
|
+
var mapStateToProps$1 = function mapStateToProps(state, props) {
|
|
3741
2599
|
return {
|
|
3742
2600
|
selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
|
|
3743
2601
|
rawData: state.rawData[props.componentId] || {},
|
|
@@ -3755,7 +2613,7 @@ var mapDispatchtoProps = {
|
|
|
3755
2613
|
TreeList.hasInternalComponent = function () {
|
|
3756
2614
|
return true;
|
|
3757
2615
|
};
|
|
3758
|
-
var TreeListConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps$
|
|
2616
|
+
var TreeListConnected = PreferencesConsumer(ComponentWrapper(connect(mapStateToProps$1, mapDispatchtoProps)(TreeList), {
|
|
3759
2617
|
componentType: componentTypes.treeList,
|
|
3760
2618
|
internalComponent: TreeList.hasInternalComponent()
|
|
3761
2619
|
}));
|
|
@@ -3823,7 +2681,7 @@ RcConnected.install = function (Vue) {
|
|
|
3823
2681
|
Vue.component(RcConnected.name, RcConnected);
|
|
3824
2682
|
};
|
|
3825
2683
|
|
|
3826
|
-
var components = [ReactiveList, ResultCard, ResultList, ReactiveBase, SBConnected, SingleList, MultiList, SingleRange, MultiRange, RangeSlider, DynamicRangeSlider, ReactiveComponent, RcConnected, SelectedFilters, ToggleButton, SingleDropdownList, MultiDropdownList, StateProvider, RangeInput, TreeListConnected
|
|
2684
|
+
var components = [ReactiveList, ResultCard, ResultList, ReactiveBase, SBConnected, SingleList, MultiList, SingleRange, MultiRange, RangeSlider, DynamicRangeSlider, ReactiveComponent, RcConnected, SelectedFilters, ToggleButton, SingleDropdownList, MultiDropdownList, StateProvider, RangeInput, TreeListConnected];
|
|
3827
2685
|
function install (Vue) {
|
|
3828
2686
|
components.map(function (component) {
|
|
3829
2687
|
Vue.use(component);
|
|
@@ -3831,4 +2689,4 @@ function install (Vue) {
|
|
|
3831
2689
|
});
|
|
3832
2690
|
}
|
|
3833
2691
|
|
|
3834
|
-
export {
|
|
2692
|
+
export { RcConnected as R, SBConnected as S, TreeListConnected as T, install as i };
|