@appbaseio/reactivesearch-vue 3.0.0-rc.8 → 3.1.0-rc.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 +23301 -41871
- package/dist/@appbaseio/reactivesearch-vue.umd.js.map +1 -1
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js +32 -32
- package/dist/@appbaseio/reactivesearch-vue.umd.min.js.map +1 -1
- package/dist/cjs/{Button-f96a0570.js → Button-d4da7470.js} +7 -14
- package/dist/cjs/{ComponentWrapper-0b9ffb1a.js → ComponentWrapper-b5c78446.js} +1 -4
- package/dist/cjs/{DropDown-82d92f8b.js → DropDown-ec31bd3f.js} +8 -19
- package/dist/cjs/DynamicRangeSlider.js +3 -3
- package/dist/cjs/Input-497be42a.js +74 -0
- package/dist/cjs/MultiDropdownList.js +7 -8
- package/dist/cjs/MultiList.js +5 -5
- package/dist/cjs/MultiRange.js +4 -4
- package/dist/cjs/{Pagination-bcf8af5f.js → Pagination-b953a80a.js} +2 -2
- package/dist/cjs/{PreferencesConsumer-85dee673.js → PreferencesConsumer-7bee3c57.js} +1 -1
- package/dist/cjs/RangeInput.js +5 -5
- package/dist/cjs/RangeSlider.js +4 -4
- package/dist/cjs/ReactiveBase.js +23 -21
- package/dist/cjs/ReactiveComponent.js +4 -4
- package/dist/cjs/ReactiveGoogleMap.js +6 -7
- package/dist/cjs/ReactiveList.js +6 -6
- package/dist/cjs/ResultCard.js +1 -1
- package/dist/cjs/ResultList.js +1 -1
- package/dist/cjs/SelectedFilters.js +3 -4
- package/dist/cjs/SingleDropdownList.js +7 -8
- package/dist/cjs/SingleList.js +5 -5
- package/dist/cjs/SingleRange.js +4 -4
- package/dist/cjs/StateProvider.js +1 -1
- package/dist/cjs/ToggleButton.js +5 -6
- package/dist/cjs/{index-779ed366.js → index-1f41363f.js} +7 -3
- package/dist/cjs/index.js +9 -13
- package/dist/cjs/{install-2a1c953d.js → install-fd2155c7.js} +221 -1599
- package/dist/cjs/install.js +9 -12
- package/dist/cjs/version.js +1 -1
- package/dist/cjs/{vueTypes-a5f1745e.js → vueTypes-1bf00978.js} +0 -18
- package/dist/es/{Button-5c2cf399.js → Button-fd869491.js} +7 -14
- package/dist/es/{ComponentWrapper-a2635cfc.js → ComponentWrapper-e91c9d43.js} +1 -4
- package/dist/es/{DropDown-8075451b.js → DropDown-74c20431.js} +9 -19
- package/dist/es/DynamicRangeSlider.js +3 -3
- package/dist/es/Input-f7499ef8.js +69 -0
- package/dist/es/MultiDropdownList.js +7 -8
- package/dist/es/MultiList.js +5 -5
- package/dist/es/MultiRange.js +4 -4
- package/dist/es/{Pagination-50fc3ef5.js → Pagination-c2745bec.js} +2 -2
- package/dist/es/{PreferencesConsumer-b058d14e.js → PreferencesConsumer-0856ed43.js} +1 -1
- package/dist/es/RangeInput.js +5 -5
- package/dist/es/RangeSlider.js +4 -4
- package/dist/es/ReactiveBase.js +23 -21
- package/dist/es/ReactiveComponent.js +4 -4
- package/dist/es/ReactiveGoogleMap.js +6 -7
- package/dist/es/ReactiveList.js +6 -6
- package/dist/es/ResultCard.js +1 -1
- package/dist/es/ResultList.js +1 -1
- package/dist/es/SelectedFilters.js +3 -4
- package/dist/es/SingleDropdownList.js +7 -8
- package/dist/es/SingleList.js +5 -5
- package/dist/es/SingleRange.js +4 -4
- package/dist/es/StateProvider.js +1 -1
- package/dist/es/ToggleButton.js +5 -6
- package/dist/es/{index-882489e1.js → index-104f1dfb.js} +7 -3
- package/dist/es/index.js +10 -13
- package/dist/es/{install-f4f2557b.js → install-db7d6387.js} +227 -1604
- package/dist/es/install.js +9 -12
- package/dist/es/version.js +1 -1
- package/dist/es/{vueTypes-09cab4d3.js → vueTypes-f1923c72.js} +0 -18
- package/package.json +5 -7
- package/dist/cjs/Input-fcd780de.js +0 -156
- package/dist/es/Input-4cd74b38.js +0 -148
|
@@ -11,27 +11,22 @@ var VueTypes = _interopDefault(require('vue-types'));
|
|
|
11
11
|
var helper = require('@appbaseio/reactivecore/lib/utils/helper');
|
|
12
12
|
var vueEmotion = require('@appbaseio/vue-emotion');
|
|
13
13
|
var css = require('@emotion/css');
|
|
14
|
-
var
|
|
15
|
-
var
|
|
16
|
-
var vueTypes = require('./vueTypes-a5f1745e.js');
|
|
14
|
+
var Button = require('./Button-d4da7470.js');
|
|
15
|
+
var vueTypes = require('./vueTypes-1bf00978.js');
|
|
17
16
|
var ReactiveList = require('./ReactiveList.js');
|
|
18
17
|
var transform = require('@appbaseio/reactivecore/lib/utils/transform');
|
|
19
|
-
var index = require('./index-
|
|
20
|
-
var ComponentWrapper = require('./ComponentWrapper-
|
|
21
|
-
var PreferencesConsumer = require('./PreferencesConsumer-
|
|
18
|
+
var index = require('./index-1f41363f.js');
|
|
19
|
+
var ComponentWrapper = require('./ComponentWrapper-b5c78446.js');
|
|
20
|
+
var PreferencesConsumer = require('./PreferencesConsumer-7bee3c57.js');
|
|
22
21
|
var Title = require('./Title-8802a218.js');
|
|
23
22
|
var ListItem = require('./ListItem-7a682970.js');
|
|
24
23
|
var Flex = require('./Flex-ddde6d26.js');
|
|
25
|
-
var analytics = require('@appbaseio/reactivecore/lib/actions/analytics');
|
|
26
24
|
var ReactiveBase = require('./ReactiveBase.js');
|
|
27
25
|
var hotkeys = _interopDefault(require('hotkeys-js'));
|
|
28
|
-
var
|
|
29
|
-
var
|
|
30
|
-
var DropDown = require('./DropDown-82d92f8b.js');
|
|
31
|
-
var Input = require('./Input-fcd780de.js');
|
|
26
|
+
var DropDown = require('./DropDown-ec31bd3f.js');
|
|
27
|
+
var Input = require('./Input-497be42a.js');
|
|
32
28
|
var Container = require('./Container-29f049b2.js');
|
|
33
29
|
var Highlight = _interopDefault(require('vue-highlight-words'));
|
|
34
|
-
var query = require('@appbaseio/reactivecore/lib/actions/query');
|
|
35
30
|
var suggestions = require('@appbaseio/reactivecore/lib/utils/suggestions');
|
|
36
31
|
var FormControlList = require('./FormControlList-fadd792f.js');
|
|
37
32
|
var utils = require('./utils-c9bd5628.js');
|
|
@@ -53,13 +48,7 @@ var ResultList = require('./ResultList.js');
|
|
|
53
48
|
var StateProvider = require('./StateProvider.js');
|
|
54
49
|
|
|
55
50
|
var _templateObject;
|
|
56
|
-
var InputGroup = vueEmotion.styled('div')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n
|
|
57
|
-
var theme = _ref.theme,
|
|
58
|
-
searchBox = _ref.searchBox;
|
|
59
|
-
return searchBox && "background-color: " + (theme.colors.backgroundColor || '#fafafa') + ";\n\t\tcolor: " + (theme.colors.textColor || '#fff') + ";\n\n\t\t&:focus-within {\n\t\t\tbackground-color: " + (theme.colors.backgroundColor || '#fff') + ";\n\t\t}";
|
|
60
|
-
}, function (props) {
|
|
61
|
-
return props.isOpen && 'box-shadow: rgb(0 0 0 / 20%) 0px 0px 15px;';
|
|
62
|
-
});
|
|
51
|
+
var InputGroup = vueEmotion.styled('div')(_templateObject || (_templateObject = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n display: flex;\n align-items: stretch;\n width: 100%;\n"])));
|
|
63
52
|
InputGroup.defaultProps = {
|
|
64
53
|
className: 'input-group'
|
|
65
54
|
};
|
|
@@ -789,309 +778,9 @@ var _templateObject$4, _templateObject2;
|
|
|
789
778
|
var TagsContainer = vueEmotion.styled('div')(_templateObject$4 || (_templateObject$4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tmargin-top: 10px;\n\twidth: 100%;\n"])));
|
|
790
779
|
var TagItem = vueEmotion.styled('span')(_templateObject2 || (_templateObject2 = _rollupPluginBabelHelpers._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"])));
|
|
791
780
|
|
|
792
|
-
var _templateObject$5;
|
|
793
|
-
var AutosuggestFooterContainer = vueEmotion.styled('div')(_templateObject$5 || (_templateObject$5 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tcolor: #8792a2;\n\tbackground: #f7fafc;\n\tpadding: 10px;\n\theight: 40px;\n"])));
|
|
794
|
-
|
|
795
|
-
var _templateObject$6, _templateObject2$1, _templateObject3;
|
|
796
|
-
var skeletonAnimation = css.keyframes(_templateObject$6 || (_templateObject$6 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n 0% {\n background-position: 100% 0;\n }\n 100% {\n background-position: -200% 0;\n }\n"])));
|
|
797
|
-
var SkeletonLoader = vueEmotion.styled('div')(_templateObject2$1 || (_templateObject2$1 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 10px;\n"])));
|
|
798
|
-
var SkeletonLine = vueEmotion.styled('div')(_templateObject3 || (_templateObject3 = _rollupPluginBabelHelpers._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);
|
|
799
|
-
var HorizontalSkeletonLoader = vue.defineComponent({
|
|
800
|
-
name: 'HorizontalSkeletonLoader',
|
|
801
|
-
render: function render() {
|
|
802
|
-
return vue.createVNode(SkeletonLoader, null, {
|
|
803
|
-
"default": function _default() {
|
|
804
|
-
return [vue.createVNode(SkeletonLine, null, null), vue.createVNode(SkeletonLine, null, null), vue.createVNode(SkeletonLine, null, null), vue.createVNode(SkeletonLine, null, null)];
|
|
805
|
-
}
|
|
806
|
-
});
|
|
807
|
-
}
|
|
808
|
-
});
|
|
809
|
-
|
|
810
|
-
var _templateObject$7, _templateObject2$2, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
811
|
-
var Chatbox = vueEmotion.styled('div')(_templateObject$7 || (_templateObject$7 = _rollupPluginBabelHelpers._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) {
|
|
812
|
-
return props.theme && props.theme.colors ? props.theme.colors.backgroundColor : '#fff';
|
|
813
|
-
});
|
|
814
|
-
var ChatContainer = vueEmotion.styled('div')(_templateObject2$2 || (_templateObject2$2 = _rollupPluginBabelHelpers._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) {
|
|
815
|
-
return props.showInput ? 'bottom: 48px;' : '';
|
|
816
|
-
}, function (props) {
|
|
817
|
-
return props.theme && props.theme.colors && props.theme.colors.backgroundColor ? props.theme.colors.backgroundColor : '#fff';
|
|
818
|
-
}, function (props) {
|
|
819
|
-
return props.theme && props.theme.colors && props.theme.colors.backgroundColor ? props.theme.colors.backgroundColor : '#fff';
|
|
820
|
-
}, function (props) {
|
|
821
|
-
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}";
|
|
822
|
-
});
|
|
823
|
-
var MessagesContainer = vueEmotion.styled('div')(_templateObject3$1 || (_templateObject3$1 = _rollupPluginBabelHelpers._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"])));
|
|
824
|
-
var typingDots = css.keyframes(_templateObject4 || (_templateObject4 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n 0% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(-70%);\n }\n 100% {\n transform: translateY(0);\n }\n"])));
|
|
825
|
-
var TypingIndicator = vueEmotion.styled('div')(_templateObject5 || (_templateObject5 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tmargin: 5px !important;\n"])));
|
|
826
|
-
var TypingDot = vueEmotion.styled('div')(_templateObject6 || (_templateObject6 = _rollupPluginBabelHelpers._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) {
|
|
827
|
-
var finalColor;
|
|
828
|
-
if (props.isSender) {
|
|
829
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor;
|
|
830
|
-
} else {
|
|
831
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.borderColor : props.theme.colors.textColor;
|
|
832
|
-
}
|
|
833
|
-
return finalColor;
|
|
834
|
-
}, typingDots);
|
|
835
|
-
var resetCSS = function resetCSS(props) {
|
|
836
|
-
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: " + (
|
|
837
|
-
// eslint-disable-next-line no-nested-ternary
|
|
838
|
-
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: " + (
|
|
839
|
-
// eslint-disable-next-line no-nested-ternary
|
|
840
|
-
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\t\tpadding-left: 10px;\n\n\t}\n\n\tli{\n\t\tdisplay: list-item;\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\tp {\n\t\tmargin: inherit;\n\t}\n";
|
|
841
|
-
};
|
|
842
|
-
var messageBGColor = function messageBGColor(props) {
|
|
843
|
-
var finalBGColor;
|
|
844
|
-
if (props.isSender) {
|
|
845
|
-
finalBGColor = props.themePreset !== 'dark' ? props.theme.colors.primaryColor : props.theme.colors.borderColor;
|
|
846
|
-
} else {
|
|
847
|
-
finalBGColor = props.themePreset !== 'dark' ? polished.lighten(0.53, props.theme.colors.borderColor) : props.theme.colors.backgroundColor;
|
|
848
|
-
}
|
|
849
|
-
return finalBGColor;
|
|
850
|
-
};
|
|
851
|
-
var Message = vueEmotion.styled('div')(_templateObject7 || (_templateObject7 = _rollupPluginBabelHelpers._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) {
|
|
852
|
-
return messageBGColor(props);
|
|
853
|
-
}, function (props) {
|
|
854
|
-
var finalColor;
|
|
855
|
-
if (props.isSender) {
|
|
856
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.primaryTextColor : props.theme.colors.textColor;
|
|
857
|
-
} else {
|
|
858
|
-
finalColor = props.themePreset !== 'dark' ? props.theme.colors.borderColor : props.theme.colors.textColor;
|
|
859
|
-
}
|
|
860
|
-
return finalColor;
|
|
861
|
-
}, function (props) {
|
|
862
|
-
return props.themePreset === 'dark' ? 'currentColor' : messageBGColor(props);
|
|
863
|
-
}, function (props) {
|
|
864
|
-
return props.isSender ? 'flex-end' : 'flex-start';
|
|
865
|
-
}, function (props) {
|
|
866
|
-
return resetCSS(props);
|
|
867
|
-
});
|
|
868
|
-
var MessageInputContainer = vueEmotion.styled('form')(_templateObject8 || (_templateObject8 = _rollupPluginBabelHelpers._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"])));
|
|
869
|
-
var MessageInput = vueEmotion.styled(Input.TextArea)(_templateObject9 || (_templateObject9 = _rollupPluginBabelHelpers._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) {
|
|
870
|
-
return props.themePreset === 'dark' ? props.theme.colors.borderColor : '#fff';
|
|
871
|
-
}, function (props) {
|
|
872
|
-
return props.themePreset === 'dark' ? props.theme.colors.titleColor : props.theme.colors.textColor;
|
|
873
|
-
}, function (props) {
|
|
874
|
-
return props.theme.colors.textColor;
|
|
875
|
-
}, function (props) {
|
|
876
|
-
return props.theme.colors.textColor;
|
|
877
|
-
}, function (props) {
|
|
878
|
-
return props.theme.colors.textColor;
|
|
879
|
-
}, function (_ref) {
|
|
880
|
-
var enterButton = _ref.enterButton;
|
|
881
|
-
return enterButton && "\n\t\t border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\t";
|
|
882
|
-
});
|
|
883
|
-
var SendButton = vueEmotion.styled(Button.Button)(_templateObject10 || (_templateObject10 = _rollupPluginBabelHelpers._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\n\t&:disabled {\n\t\tcursor: not-allowed;\n\t}\n"])));
|
|
884
|
-
var AIFeedbackContainer = vueEmotion.styled('div')(_templateObject11 || (_templateObject11 = _rollupPluginBabelHelpers._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"])));
|
|
885
|
-
|
|
886
|
-
var _templateObject$8, _templateObject2$3, _templateObject3$2, _templateObject4$1, _templateObject5$1, _templateObject6$1, _templateObject7$1;
|
|
887
|
-
var fadeInFromBottom = css.keyframes(_templateObject$8 || (_templateObject$8 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n 0% {\n opacity: 0;\n transform: translateY(20px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"])));
|
|
888
|
-
var fadeInFromTop = css.keyframes(_templateObject2$3 || (_templateObject2$3 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n 0% {\n opacity: 0;\n transform: translateY(-20px);\n }\n 100% {\n opacity: 1;\n transform: translateY(0);\n }\n"])));
|
|
889
|
-
var SearchBoxAISection = vueEmotion.styled('div')(_templateObject3$2 || (_templateObject3$2 = _rollupPluginBabelHelpers._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) {
|
|
890
|
-
var themePreset = _ref.themePreset,
|
|
891
|
-
theme = _ref.theme;
|
|
892
|
-
return themePreset === 'dark' ? '#424242' : theme.colors.backgroundColor;
|
|
893
|
-
}, function (_ref2) {
|
|
894
|
-
var theme = _ref2.theme;
|
|
895
|
-
return theme.colors.textColor;
|
|
896
|
-
});
|
|
897
|
-
var Question = vueEmotion.styled('div')(_templateObject4$1 || (_templateObject4$1 = _rollupPluginBabelHelpers._taggedTemplateLiteralLoose(["\n\tfont-weight: bold;\n\tmargin-bottom: 5px;\n\tanimation: ", " 0.5s ease-out;\n"])), fadeInFromTop);
|
|
898
|
-
var Answer = vueEmotion.styled('div')(_templateObject5$1 || (_templateObject5$1 = _rollupPluginBabelHelpers._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) {
|
|
899
|
-
return resetCSS(props);
|
|
900
|
-
});
|
|
901
|
-
var Footer = vueEmotion.styled('div')(_templateObject6$1 || (_templateObject6$1 = _rollupPluginBabelHelpers._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) {
|
|
902
|
-
var themePreset = _ref3.themePreset,
|
|
903
|
-
theme = _ref3.theme;
|
|
904
|
-
return themePreset === 'dark' ? '#424242' : theme.colors.backgroundColor;
|
|
905
|
-
}, function (_ref4) {
|
|
906
|
-
var theme = _ref4.theme;
|
|
907
|
-
return theme.colors.textColor;
|
|
908
|
-
});
|
|
909
|
-
var SourceTags = vueEmotion.styled('div')(_templateObject7$1 || (_templateObject7$1 = _rollupPluginBabelHelpers._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"])));
|
|
910
|
-
|
|
911
|
-
var ThumbsUpSvg = {
|
|
912
|
-
name: 'ThumbsUpSvg',
|
|
913
|
-
props: ['clickHandler', 'className'],
|
|
914
|
-
render: function render() {
|
|
915
|
-
return vue.createVNode("svg", {
|
|
916
|
-
"stroke": "currentColor",
|
|
917
|
-
"fill": "none",
|
|
918
|
-
"strokeWidth": "2",
|
|
919
|
-
"viewBox": "0 0 24 24",
|
|
920
|
-
"strokeLinecap": "round",
|
|
921
|
-
"strokeLinejoin": "round",
|
|
922
|
-
"class": this.$props.className,
|
|
923
|
-
"height": "1em",
|
|
924
|
-
"width": "1em",
|
|
925
|
-
"xmlns": "http://www.w3.org/2000/svg",
|
|
926
|
-
"onClick": this.$props.clickHandler
|
|
927
|
-
}, [vue.createVNode("path", {
|
|
928
|
-
"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"
|
|
929
|
-
}, null)]);
|
|
930
|
-
}
|
|
931
|
-
};
|
|
932
|
-
|
|
933
|
-
var ThumbsDownSvg = {
|
|
934
|
-
name: 'ThumbsDownSvg',
|
|
935
|
-
props: ['clickHandler', 'className'],
|
|
936
|
-
render: function render() {
|
|
937
|
-
return vue.createVNode("svg", {
|
|
938
|
-
"stroke": "currentColor",
|
|
939
|
-
"fill": "none",
|
|
940
|
-
"strokeWidth": "2",
|
|
941
|
-
"viewBox": "0 0 24 24",
|
|
942
|
-
"strokeLinecap": "round",
|
|
943
|
-
"strokeLinejoin": "round",
|
|
944
|
-
"class": this.$props.className,
|
|
945
|
-
"height": "1em",
|
|
946
|
-
"width": "1em",
|
|
947
|
-
"xmlns": "http://www.w3.org/2000/svg",
|
|
948
|
-
"onClick": this.$props.clickHandler
|
|
949
|
-
}, [vue.createVNode("path", {
|
|
950
|
-
"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"
|
|
951
|
-
}, null), ' ']);
|
|
952
|
-
}
|
|
953
|
-
};
|
|
954
|
-
|
|
955
|
-
var AIFeedback = vue.defineComponent({
|
|
956
|
-
name: 'FeedbackComponent',
|
|
957
|
-
props: {
|
|
958
|
-
onFeedbackSubmit: {
|
|
959
|
-
type: Function,
|
|
960
|
-
"default": function _default() {}
|
|
961
|
-
},
|
|
962
|
-
hideUI: {
|
|
963
|
-
type: Boolean,
|
|
964
|
-
"default": false
|
|
965
|
-
},
|
|
966
|
-
overrideState: {
|
|
967
|
-
type: Object,
|
|
968
|
-
"default": function _default() {
|
|
969
|
-
return {};
|
|
970
|
-
}
|
|
971
|
-
}
|
|
972
|
-
},
|
|
973
|
-
setup: function setup(props, _ref) {
|
|
974
|
-
var emit = _ref.emit;
|
|
975
|
-
var showInput = vue.ref(false);
|
|
976
|
-
var feedbackType = vue.ref(null);
|
|
977
|
-
var feedbackText = vue.ref('');
|
|
978
|
-
var feedbackRecorded = vue.ref(false);
|
|
979
|
-
var handleButtonClick = function handleButtonClick(type) {
|
|
980
|
-
if (feedbackType.value === type) {
|
|
981
|
-
feedbackType.value = null;
|
|
982
|
-
showInput.value = false;
|
|
983
|
-
} else {
|
|
984
|
-
feedbackType.value = type;
|
|
985
|
-
showInput.value = true;
|
|
986
|
-
}
|
|
987
|
-
};
|
|
988
|
-
var handleInputChange = function handleInputChange(e) {
|
|
989
|
-
feedbackText.value = e.target.value;
|
|
990
|
-
};
|
|
991
|
-
var handleSubmit = function handleSubmit() {
|
|
992
|
-
emit('feedback-submit', feedbackType.value === 'positive', feedbackText.value);
|
|
993
|
-
feedbackText.value = '';
|
|
994
|
-
showInput.value = false;
|
|
995
|
-
feedbackRecorded.value = true;
|
|
996
|
-
};
|
|
997
|
-
var handleCancel = function handleCancel() {
|
|
998
|
-
feedbackType.value = null;
|
|
999
|
-
feedbackText.value = '';
|
|
1000
|
-
showInput.value = false;
|
|
1001
|
-
};
|
|
1002
|
-
vue.watch(function () {
|
|
1003
|
-
return props.overrideState;
|
|
1004
|
-
}, function (newValue) {
|
|
1005
|
-
if (newValue && newValue.isRecorded) {
|
|
1006
|
-
feedbackRecorded.value = true;
|
|
1007
|
-
feedbackType.value = newValue.feedbackType || 'positive';
|
|
1008
|
-
}
|
|
1009
|
-
});
|
|
1010
|
-
if (props.overrideState && props.overrideState.isRecorded) {
|
|
1011
|
-
feedbackRecorded.value = true;
|
|
1012
|
-
feedbackType.value = props.overrideState.feedbackType || 'positive';
|
|
1013
|
-
}
|
|
1014
|
-
return {
|
|
1015
|
-
showInput: showInput,
|
|
1016
|
-
feedbackType: feedbackType,
|
|
1017
|
-
feedbackText: feedbackText,
|
|
1018
|
-
feedbackRecorded: feedbackRecorded,
|
|
1019
|
-
handleButtonClick: handleButtonClick,
|
|
1020
|
-
handleInputChange: handleInputChange,
|
|
1021
|
-
handleSubmit: handleSubmit,
|
|
1022
|
-
handleCancel: handleCancel
|
|
1023
|
-
};
|
|
1024
|
-
},
|
|
1025
|
-
render: function render() {
|
|
1026
|
-
var _this = this;
|
|
1027
|
-
if (this.$props.hideUI) {
|
|
1028
|
-
return null;
|
|
1029
|
-
}
|
|
1030
|
-
if (this.feedbackRecorded) {
|
|
1031
|
-
return vue.createVNode(AIFeedbackContainer, null, {
|
|
1032
|
-
"default": function _default() {
|
|
1033
|
-
return [vue.createVNode("div", {
|
|
1034
|
-
"class": "--feedback-svgs-wrapper"
|
|
1035
|
-
}, [_this.feedbackType === 'positive' ? vue.createVNode(ThumbsUpSvg, {
|
|
1036
|
-
"class": "selected"
|
|
1037
|
-
}, null) : vue.createVNode(ThumbsDownSvg, {
|
|
1038
|
-
"class": "selected"
|
|
1039
|
-
}, null)])];
|
|
1040
|
-
}
|
|
1041
|
-
});
|
|
1042
|
-
}
|
|
1043
|
-
return vue.createVNode(AIFeedbackContainer, null, {
|
|
1044
|
-
"default": function _default() {
|
|
1045
|
-
return [!_this.showInput && vue.createVNode("div", {
|
|
1046
|
-
"class": "--feedback-svgs-wrapper"
|
|
1047
|
-
}, [vue.createVNode(ThumbsUpSvg, {
|
|
1048
|
-
"class": _this.feedbackType === 'positive' ? 'selected' : '',
|
|
1049
|
-
"onClick": function onClick() {
|
|
1050
|
-
return _this.handleButtonClick('positive');
|
|
1051
|
-
}
|
|
1052
|
-
}, null), vue.createVNode(ThumbsDownSvg, {
|
|
1053
|
-
"class": _this.feedbackType === 'negative' ? 'selected' : '',
|
|
1054
|
-
"onClick": function onClick() {
|
|
1055
|
-
return _this.handleButtonClick('negative');
|
|
1056
|
-
}
|
|
1057
|
-
}, null)]), _this.showInput && vue.createVNode("div", {
|
|
1058
|
-
"class": "--feedback-input-wrapper"
|
|
1059
|
-
}, [vue.createVNode(Input.Input, {
|
|
1060
|
-
"show": _this.showInput,
|
|
1061
|
-
"placeholder": _this.feedbackType === 'positive' ? 'What do you like about the response?' : 'What was the issue with the response? How can it be improved?',
|
|
1062
|
-
"value": _this.feedbackText,
|
|
1063
|
-
"onInput": _this.handleInputChange
|
|
1064
|
-
}, null), vue.createVNode(Button.Button, {
|
|
1065
|
-
"primary": true,
|
|
1066
|
-
"onClick": _this.handleSubmit
|
|
1067
|
-
}, {
|
|
1068
|
-
"default": function _default() {
|
|
1069
|
-
return [vue.createTextVNode("Submit")];
|
|
1070
|
-
}
|
|
1071
|
-
}), vue.createVNode(Button.Button, {
|
|
1072
|
-
"onClick": _this.handleCancel
|
|
1073
|
-
}, {
|
|
1074
|
-
"default": function _default() {
|
|
1075
|
-
return [vue.createTextVNode("Cancel")];
|
|
1076
|
-
}
|
|
1077
|
-
})])];
|
|
1078
|
-
}
|
|
1079
|
-
});
|
|
1080
|
-
}
|
|
1081
|
-
});
|
|
1082
|
-
|
|
1083
|
-
var _excluded = ["_source"];
|
|
1084
781
|
function _isSlot(s) {
|
|
1085
782
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
1086
783
|
}
|
|
1087
|
-
var md = new remarkable.Remarkable();
|
|
1088
|
-
md.set({
|
|
1089
|
-
html: true,
|
|
1090
|
-
breaks: true,
|
|
1091
|
-
xhtmlOut: true
|
|
1092
|
-
});
|
|
1093
|
-
var _dropdownULRef = 'dropdownULRef';
|
|
1094
|
-
var _inputGroupRef = 'inputGroupRef';
|
|
1095
784
|
var updateQuery = reactivecore.Actions.updateQuery,
|
|
1096
785
|
setCustomQuery = reactivecore.Actions.setCustomQuery,
|
|
1097
786
|
setDefaultQuery = reactivecore.Actions.setDefaultQuery,
|
|
@@ -1112,11 +801,7 @@ var SearchBox = vue.defineComponent({
|
|
|
1112
801
|
currentValue: '',
|
|
1113
802
|
selectedTags: [],
|
|
1114
803
|
isOpen: false,
|
|
1115
|
-
normalizedSuggestions: []
|
|
1116
|
-
showAIScreen: false,
|
|
1117
|
-
showAIScreenFooter: false,
|
|
1118
|
-
showFeedbackComponent: false,
|
|
1119
|
-
feedbackState: null
|
|
804
|
+
normalizedSuggestions: []
|
|
1120
805
|
};
|
|
1121
806
|
this.internalComponent = props.componentId + "__internal";
|
|
1122
807
|
return this.__state;
|
|
@@ -1157,26 +842,6 @@ var SearchBox = vue.defineComponent({
|
|
|
1157
842
|
},
|
|
1158
843
|
stats: function stats() {
|
|
1159
844
|
return getResultStats(this);
|
|
1160
|
-
},
|
|
1161
|
-
parsedSuggestions: function parsedSuggestions() {
|
|
1162
|
-
var suggestionsArray = [];
|
|
1163
|
-
if (Array.isArray(this.suggestions) && this.suggestions.length) {
|
|
1164
|
-
suggestionsArray = [].concat(withClickIds(this.suggestions));
|
|
1165
|
-
}
|
|
1166
|
-
var sectionsAccumulated = [];
|
|
1167
|
-
var sectionisedSuggestions = suggestionsArray.reduce(function (acc, d, currentIndex) {
|
|
1168
|
-
if (sectionsAccumulated.includes(d.sectionId)) return acc;
|
|
1169
|
-
if (d.sectionId) {
|
|
1170
|
-
acc[currentIndex] = suggestionsArray.filter(function (g) {
|
|
1171
|
-
return g.sectionId === d.sectionId;
|
|
1172
|
-
});
|
|
1173
|
-
sectionsAccumulated.push(d.sectionId);
|
|
1174
|
-
} else {
|
|
1175
|
-
acc[currentIndex] = d;
|
|
1176
|
-
}
|
|
1177
|
-
return acc;
|
|
1178
|
-
}, {});
|
|
1179
|
-
return Object.values(sectionisedSuggestions);
|
|
1180
845
|
}
|
|
1181
846
|
},
|
|
1182
847
|
props: {
|
|
@@ -1243,20 +908,12 @@ var SearchBox = vue.defineComponent({
|
|
|
1243
908
|
distinctFieldConfig: vueTypes.types.props,
|
|
1244
909
|
//
|
|
1245
910
|
focusShortcuts: VueTypes.arrayOf(VueTypes.oneOfType([VueTypes.string, VueTypes.number])).def(['/']),
|
|
1246
|
-
showFocusShortcutsIcon: VueTypes.bool.def(true),
|
|
1247
911
|
addonBefore: VueTypes.any,
|
|
1248
912
|
addonAfter: VueTypes.any,
|
|
1249
|
-
showSuggestionsFooter: VueTypes.bool.def(true),
|
|
1250
913
|
expandSuggestionsContainer: VueTypes.bool.def(true),
|
|
1251
|
-
renderSuggestionsFooter: VueTypes.func,
|
|
1252
914
|
index: VueTypes.string,
|
|
1253
915
|
popularSuggestionsConfig: VueTypes.object,
|
|
1254
916
|
recentSuggestionsConfig: VueTypes.object,
|
|
1255
|
-
featuredSuggestionsConfig: VueTypes.shape({
|
|
1256
|
-
maxSuggestionsPerSection: VueTypes.number,
|
|
1257
|
-
sectionsOrder: VueTypes.arrayOf(VueTypes.string)
|
|
1258
|
-
}),
|
|
1259
|
-
customEvents: VueTypes.object,
|
|
1260
917
|
applyStopwords: VueTypes.bool,
|
|
1261
918
|
customStopwords: vueTypes.types.stringArray,
|
|
1262
919
|
onData: vueTypes.types.func,
|
|
@@ -1266,10 +923,7 @@ var SearchBox = vue.defineComponent({
|
|
|
1266
923
|
mode: VueTypes.oneOf(['select', 'tag']).def('select'),
|
|
1267
924
|
renderSelectedTags: VueTypes.any,
|
|
1268
925
|
searchboxId: VueTypes.string,
|
|
1269
|
-
endpoint: vueTypes.types.endpointConfig
|
|
1270
|
-
enableAI: VueTypes.bool.def(false),
|
|
1271
|
-
AIConfig: vueTypes.types.AIConfig,
|
|
1272
|
-
AIUIConfig: vueTypes.types.AIUIConfig
|
|
926
|
+
endpoint: vueTypes.types.endpointConfig
|
|
1273
927
|
},
|
|
1274
928
|
mounted: function mounted() {
|
|
1275
929
|
this.listenForFocusShortcuts();
|
|
@@ -1315,7 +969,6 @@ var SearchBox = vue.defineComponent({
|
|
|
1315
969
|
suggestionsList = [].concat(withClickIds(this.$props.defaultSuggestions));
|
|
1316
970
|
}
|
|
1317
971
|
this.normalizedSuggestions = suggestionsList;
|
|
1318
|
-
this.handleTextAreaHeightChange();
|
|
1319
972
|
},
|
|
1320
973
|
selectedValue: function selectedValue(newVal, oldVal) {
|
|
1321
974
|
if (!isEqual(newVal, oldVal) && (this.$options.isTagsMode ? !isEqual(this.$data.selectedTags, newVal) : this.$data.currentValue !== newVal)) {
|
|
@@ -1377,45 +1030,6 @@ var SearchBox = vue.defineComponent({
|
|
|
1377
1030
|
if (!isEqual(newVal, oldVal)) {
|
|
1378
1031
|
this.handleTextChange = _debounce(this.handleText, newVal);
|
|
1379
1032
|
}
|
|
1380
|
-
},
|
|
1381
|
-
isAITyping: function isAITyping(newVal, oldVal) {
|
|
1382
|
-
var _this = this;
|
|
1383
|
-
var scrollAIContainer = function scrollAIContainer() {
|
|
1384
|
-
var dropdownEle = _this.$refs[_dropdownULRef];
|
|
1385
|
-
if (dropdownEle) {
|
|
1386
|
-
dropdownEle.scrollTo({
|
|
1387
|
-
top: dropdownEle.scrollHeight,
|
|
1388
|
-
behavior: 'smooth'
|
|
1389
|
-
});
|
|
1390
|
-
}
|
|
1391
|
-
};
|
|
1392
|
-
if (!newVal && oldVal) {
|
|
1393
|
-
this.showAIScreenFooter = true;
|
|
1394
|
-
if (this.$props.AIUIConfig && typeof this.$props.AIUIConfig.showFeedback === 'boolean' ? this.$props.AIUIConfig.showFeedback : true) {
|
|
1395
|
-
this.showFeedbackComponent = true;
|
|
1396
|
-
}
|
|
1397
|
-
setTimeout(function () {
|
|
1398
|
-
scrollAIContainer();
|
|
1399
|
-
}, 500);
|
|
1400
|
-
} else if (newVal) {
|
|
1401
|
-
this.scrollTimerRef = setTimeout(function () {
|
|
1402
|
-
scrollAIContainer();
|
|
1403
|
-
}, 2000);
|
|
1404
|
-
}
|
|
1405
|
-
},
|
|
1406
|
-
showAIScreen: function showAIScreen(newVal) {
|
|
1407
|
-
if (newVal) {
|
|
1408
|
-
var _this$$refs;
|
|
1409
|
-
if ((_this$$refs = this.$refs) != null && _this$$refs[this.$props.innerRef] && this.$refs[this.$props.innerRef].$el) {
|
|
1410
|
-
this.$refs[this.$props.innerRef].$el.blur();
|
|
1411
|
-
}
|
|
1412
|
-
} else {
|
|
1413
|
-
this.feedbackState = null;
|
|
1414
|
-
this.showFeedbackComponent = false;
|
|
1415
|
-
}
|
|
1416
|
-
},
|
|
1417
|
-
currentValue: function currentValue() {
|
|
1418
|
-
this.handleTextAreaHeightChange();
|
|
1419
1033
|
}
|
|
1420
1034
|
},
|
|
1421
1035
|
methods: {
|
|
@@ -1441,20 +1055,9 @@ var SearchBox = vue.defineComponent({
|
|
|
1441
1055
|
data: this.normalizedSuggestions,
|
|
1442
1056
|
rawData: this.rawData,
|
|
1443
1057
|
value: currentValue,
|
|
1444
|
-
resultStats: this.stats
|
|
1445
|
-
AIData: {
|
|
1446
|
-
question: this.AIResponse && this.AIResponse.response && this.AIResponse.response.question,
|
|
1447
|
-
answer: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.text,
|
|
1448
|
-
documentIds: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds || [],
|
|
1449
|
-
showAIScreen: this.showAIScreen,
|
|
1450
|
-
sources: this.getAISourceObjects(),
|
|
1451
|
-
isAILoading: this.isAIResponseLoading,
|
|
1452
|
-
AIError: this.AIResponseError
|
|
1453
|
-
}
|
|
1058
|
+
resultStats: this.stats
|
|
1454
1059
|
};
|
|
1455
|
-
return
|
|
1456
|
-
"ref": _dropdownULRef
|
|
1457
|
-
}, [index.getComponent(data, this)]);
|
|
1060
|
+
return index.getComponent(data, this);
|
|
1458
1061
|
},
|
|
1459
1062
|
// returns size and aggs property
|
|
1460
1063
|
getBasicQueryOptions: function getBasicQueryOptions() {
|
|
@@ -1476,7 +1079,7 @@ var SearchBox = vue.defineComponent({
|
|
|
1476
1079
|
}
|
|
1477
1080
|
},
|
|
1478
1081
|
setValue: function setValue(value, isDefaultValue, props, cause, toggleIsOpen, categoryValue) {
|
|
1479
|
-
var
|
|
1082
|
+
var _this = this;
|
|
1480
1083
|
if (isDefaultValue === void 0) {
|
|
1481
1084
|
isDefaultValue = false;
|
|
1482
1085
|
}
|
|
@@ -1490,65 +1093,60 @@ var SearchBox = vue.defineComponent({
|
|
|
1490
1093
|
categoryValue = undefined;
|
|
1491
1094
|
}
|
|
1492
1095
|
var performUpdate = function performUpdate() {
|
|
1493
|
-
if (
|
|
1096
|
+
if (_this.$options.isTagsMode && isEqual(value, _this.selectedTags)) {
|
|
1494
1097
|
return;
|
|
1495
1098
|
}
|
|
1496
|
-
if (
|
|
1497
|
-
if (Array.isArray(
|
|
1099
|
+
if (_this.$options.isTagsMode && cause === reactivecore.causes.SUGGESTION_SELECT) {
|
|
1100
|
+
if (Array.isArray(_this.selectedTags) && _this.selectedTags.length) {
|
|
1498
1101
|
// check if value already present in selectedTags
|
|
1499
|
-
if (typeof value === 'string' &&
|
|
1500
|
-
|
|
1102
|
+
if (typeof value === 'string' && _this.selectedTags.includes(value)) {
|
|
1103
|
+
_this.isOpen = false;
|
|
1501
1104
|
return;
|
|
1502
1105
|
}
|
|
1503
|
-
|
|
1106
|
+
_this.selectedTags = [].concat(_this.selectedTags);
|
|
1504
1107
|
if (typeof value === 'string' && !!value) {
|
|
1505
|
-
|
|
1506
|
-
} else if (Array.isArray(value) && !isEqual(
|
|
1507
|
-
|
|
1108
|
+
_this.selectedTags.push(value);
|
|
1109
|
+
} else if (Array.isArray(value) && !isEqual(_this.selectedTags, value)) {
|
|
1110
|
+
_this.selectedTags = value;
|
|
1508
1111
|
}
|
|
1509
1112
|
} else if (value) {
|
|
1510
|
-
|
|
1113
|
+
_this.selectedTags = typeof value !== 'string' ? value : [].concat(value);
|
|
1511
1114
|
}
|
|
1512
|
-
|
|
1115
|
+
_this.currentValue = '';
|
|
1513
1116
|
} else {
|
|
1514
|
-
|
|
1117
|
+
_this.currentValue = index.decodeHtml(value);
|
|
1515
1118
|
}
|
|
1516
1119
|
var queryHandlerValue = value;
|
|
1517
|
-
if (
|
|
1518
|
-
queryHandlerValue = Array.isArray(
|
|
1120
|
+
if (_this.$options.isTagsMode && cause === reactivecore.causes.SUGGESTION_SELECT) {
|
|
1121
|
+
queryHandlerValue = Array.isArray(_this.selectedTags) && _this.selectedTags.length ? _this.selectedTags : undefined;
|
|
1519
1122
|
}
|
|
1520
1123
|
if (isDefaultValue) {
|
|
1521
|
-
if (
|
|
1124
|
+
if (_this.$props.autosuggest) {
|
|
1522
1125
|
if (toggleIsOpen) {
|
|
1523
|
-
|
|
1126
|
+
_this.isOpen = false;
|
|
1524
1127
|
}
|
|
1525
|
-
if (typeof
|
|
1526
|
-
enableAI: true
|
|
1527
|
-
} : {});
|
|
1128
|
+
if (typeof _this.currentValue === 'string') _this.triggerDefaultQuery(_this.currentValue);
|
|
1528
1129
|
} // in case of strict selection only SUGGESTION_SELECT should be able
|
|
1529
1130
|
// to set the query otherwise the value should reset
|
|
1530
1131
|
if (props.strictSelection) {
|
|
1531
|
-
if (cause === reactivecore.causes.SUGGESTION_SELECT || (
|
|
1532
|
-
|
|
1132
|
+
if (cause === reactivecore.causes.SUGGESTION_SELECT || (_this.$options.isTagsMode ? _this.selectedTags.length === 0 : value === '')) {
|
|
1133
|
+
_this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
|
|
1533
1134
|
} else {
|
|
1534
|
-
|
|
1135
|
+
_this.setValue('', true);
|
|
1535
1136
|
}
|
|
1536
1137
|
} else if (props.value === undefined || cause === reactivecore.causes.SUGGESTION_SELECT || cause === reactivecore.causes.CLEAR_VALUE) {
|
|
1537
|
-
|
|
1138
|
+
_this.triggerCustomQuery(queryHandlerValue, _this.$options.isTagsMode ? undefined : categoryValue);
|
|
1538
1139
|
}
|
|
1539
1140
|
} else {
|
|
1540
1141
|
// debounce for handling text while typing
|
|
1541
|
-
|
|
1142
|
+
_this.handleTextChange(value, cause);
|
|
1542
1143
|
}
|
|
1543
|
-
|
|
1544
|
-
|
|
1144
|
+
_this.$emit('valueChange', value);
|
|
1145
|
+
_this.$emit('value-change', value);
|
|
1545
1146
|
};
|
|
1546
1147
|
checkValueChange(props.componentId, value, props.beforeValueChange, performUpdate);
|
|
1547
1148
|
},
|
|
1548
|
-
triggerDefaultQuery: function triggerDefaultQuery(paramValue
|
|
1549
|
-
if (meta === void 0) {
|
|
1550
|
-
meta = {};
|
|
1551
|
-
}
|
|
1149
|
+
triggerDefaultQuery: function triggerDefaultQuery(paramValue) {
|
|
1552
1150
|
if (!this.$props.autosuggest) {
|
|
1553
1151
|
return;
|
|
1554
1152
|
}
|
|
@@ -1567,8 +1165,7 @@ var SearchBox = vue.defineComponent({
|
|
|
1567
1165
|
componentId: this.internalComponent,
|
|
1568
1166
|
query: query,
|
|
1569
1167
|
value: value,
|
|
1570
|
-
componentType: constants.componentTypes.searchBox
|
|
1571
|
-
meta: meta
|
|
1168
|
+
componentType: constants.componentTypes.searchBox
|
|
1572
1169
|
});
|
|
1573
1170
|
},
|
|
1574
1171
|
triggerCustomQuery: function triggerCustomQuery(paramValue, categoryValue) {
|
|
@@ -1652,8 +1249,8 @@ var SearchBox = vue.defineComponent({
|
|
|
1652
1249
|
this.recordSuggestionClick(searchPosition, docId);
|
|
1653
1250
|
},
|
|
1654
1251
|
clearValue: function clearValue() {
|
|
1655
|
-
this.setValue('', false, this.$props,
|
|
1656
|
-
this.onValueSelectedHandler('',
|
|
1252
|
+
this.setValue('', false, this.$props, reactivecore.causes.CLEAR_VALUE, false);
|
|
1253
|
+
this.onValueSelectedHandler('', reactivecore.causes.CLEAR_VALUE);
|
|
1657
1254
|
},
|
|
1658
1255
|
handleKeyDown: function handleKeyDown(event, highlightedIndex) {
|
|
1659
1256
|
if (highlightedIndex === void 0) {
|
|
@@ -1664,12 +1261,9 @@ var SearchBox = vue.defineComponent({
|
|
|
1664
1261
|
if (this.$props.autosuggest === false) {
|
|
1665
1262
|
this.enterButtonOnClick();
|
|
1666
1263
|
} else if (highlightedIndex === null) {
|
|
1667
|
-
this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? reactivecore.causes.SUGGESTION_SELECT : undefined
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
if (this.$props.enableAI && !this.showAIScreen) {
|
|
1671
|
-
this.showAIScreen = true;
|
|
1672
|
-
}
|
|
1264
|
+
this.setValue(event.target.value, true, this.$props, this.$options.isTagsMode ? reactivecore.causes.SUGGESTION_SELECT : undefined // to handle tags
|
|
1265
|
+
);
|
|
1266
|
+
|
|
1673
1267
|
this.onValueSelectedHandler(event.target.value, reactivecore.causes.ENTER_PRESS);
|
|
1674
1268
|
}
|
|
1675
1269
|
}
|
|
@@ -1679,21 +1273,18 @@ var SearchBox = vue.defineComponent({
|
|
|
1679
1273
|
this.$emit('key-down', event, this.triggerQuery);
|
|
1680
1274
|
},
|
|
1681
1275
|
onInputChange: function onInputChange(e) {
|
|
1682
|
-
var
|
|
1276
|
+
var _this2 = this;
|
|
1683
1277
|
var inputValue = e.target.value;
|
|
1684
1278
|
if (!this.$data.isOpen && this.$props.autosuggest) {
|
|
1685
1279
|
this.isOpen = true;
|
|
1686
1280
|
}
|
|
1687
|
-
if (this.showAIScreen) {
|
|
1688
|
-
this.showAIScreen = false;
|
|
1689
|
-
}
|
|
1690
1281
|
var value = this.$props.value;
|
|
1691
1282
|
if (value === undefined) {
|
|
1692
|
-
this.setValue(inputValue, false, this.$props, undefined);
|
|
1283
|
+
this.setValue(inputValue, false, this.$props, inputValue === '' ? reactivecore.causes.CLEAR_VALUE : undefined);
|
|
1693
1284
|
} else {
|
|
1694
1285
|
this.$emit('change', inputValue, function (_ref3) {
|
|
1695
1286
|
var isOpen = _ref3.isOpen;
|
|
1696
|
-
return
|
|
1287
|
+
return _this2.triggerQuery({
|
|
1697
1288
|
defaultQuery: true,
|
|
1698
1289
|
customQuery: true,
|
|
1699
1290
|
value: inputValue,
|
|
@@ -1702,52 +1293,10 @@ var SearchBox = vue.defineComponent({
|
|
|
1702
1293
|
}, e);
|
|
1703
1294
|
}
|
|
1704
1295
|
},
|
|
1705
|
-
handleFeaturedSuggestionClicked: function handleFeaturedSuggestionClicked(suggestion) {
|
|
1706
|
-
try {
|
|
1707
|
-
var _this$$refs2, _this$$refs2$this$$pr;
|
|
1708
|
-
if (suggestion.action === helper.featuredSuggestionsActionTypes.NAVIGATE) {
|
|
1709
|
-
var _JSON$parse = JSON.parse(suggestion.subAction),
|
|
1710
|
-
_JSON$parse$target = _JSON$parse.target,
|
|
1711
|
-
target = _JSON$parse$target === void 0 ? '_self' : _JSON$parse$target,
|
|
1712
|
-
_JSON$parse$link = _JSON$parse.link,
|
|
1713
|
-
link = _JSON$parse$link === void 0 ? '/' : _JSON$parse$link;
|
|
1714
|
-
if (typeof window !== 'undefined') {
|
|
1715
|
-
window.open(link, target);
|
|
1716
|
-
}
|
|
1717
|
-
}
|
|
1718
|
-
if (suggestion.action === helper.featuredSuggestionsActionTypes.FUNCTION) {
|
|
1719
|
-
var matchedValues = suggestion.subAction.match(/function\s*\(.*\)(.|\n)*/);
|
|
1720
|
-
var functionStr = matchedValues && matchedValues[0];
|
|
1721
|
-
// eslint-disable-next-line no-new-func
|
|
1722
|
-
var func = new Function("return " + functionStr)();
|
|
1723
|
-
func(suggestion, this.$data.currentValue, this.$props.customEvents);
|
|
1724
|
-
}
|
|
1725
|
-
if (suggestion.action === helper.featuredSuggestionsActionTypes.SELECT) {
|
|
1726
|
-
this.setValue(suggestion.value, true, this.$props, this.$options.isTagsMode.current ? reactivecore.causes.SUGGESTION_SELECT : reactivecore.causes.ENTER_PRESS);
|
|
1727
|
-
this.onValueSelectedHandler(suggestion.value, reactivecore.causes.SUGGESTION_SELECT);
|
|
1728
|
-
}
|
|
1729
|
-
// blur is important to close the dropdown
|
|
1730
|
-
// on selecting one of featured suggestions
|
|
1731
|
-
// else Downshift probably is focusing the dropdown
|
|
1732
|
-
// and not letting it close
|
|
1733
|
-
// eslint-disable-next-line no-unused-expressions
|
|
1734
|
-
(_this$$refs2 = this.$refs) == null ? void 0 : (_this$$refs2$this$$pr = _this$$refs2[this.$props.innerRef]) == null ? void 0 : _this$$refs2$this$$pr.blur();
|
|
1735
|
-
} catch (e) {
|
|
1736
|
-
console.error("Error: There was an error parsing the subAction for the featured suggestion with label, \"" + suggestion.label + "\"", e);
|
|
1737
|
-
}
|
|
1738
|
-
},
|
|
1739
1296
|
onSuggestionSelected: function onSuggestionSelected(suggestion) {
|
|
1740
|
-
var
|
|
1741
|
-
|
|
1742
|
-
this.showAIScreen = true;
|
|
1743
|
-
}
|
|
1297
|
+
var _this3 = this;
|
|
1298
|
+
this.isOpen = false;
|
|
1744
1299
|
var value = this.$props.value;
|
|
1745
|
-
|
|
1746
|
-
// handle featured suggestions click event
|
|
1747
|
-
if (suggestion._suggestion_type === helper.suggestionTypes.Featured) {
|
|
1748
|
-
this.handleFeaturedSuggestionClicked(suggestion);
|
|
1749
|
-
return;
|
|
1750
|
-
}
|
|
1751
1300
|
// Record analytics for selected suggestions
|
|
1752
1301
|
this.triggerClickAnalytics(suggestion._click_id);
|
|
1753
1302
|
if (value === undefined) {
|
|
@@ -1766,10 +1315,10 @@ var SearchBox = vue.defineComponent({
|
|
|
1766
1315
|
this.setValue(emitValue, true, this.$props, reactivecore.causes.SUGGESTION_SELECT, false, suggestion._category);
|
|
1767
1316
|
this.$emit('change', emitValue, function (_ref4) {
|
|
1768
1317
|
var isOpen = _ref4.isOpen;
|
|
1769
|
-
return
|
|
1318
|
+
return _this3.triggerQuery(_rollupPluginBabelHelpers._extends({
|
|
1770
1319
|
isOpen: isOpen,
|
|
1771
1320
|
value: emitValue
|
|
1772
|
-
}, !
|
|
1321
|
+
}, !_this3.$options.isTagsMode && {
|
|
1773
1322
|
categoryValue: suggestion._category
|
|
1774
1323
|
}));
|
|
1775
1324
|
});
|
|
@@ -1803,26 +1352,9 @@ var SearchBox = vue.defineComponent({
|
|
|
1803
1352
|
}
|
|
1804
1353
|
return null;
|
|
1805
1354
|
},
|
|
1806
|
-
renderErrorComponent: function renderErrorComponent(
|
|
1807
|
-
var
|
|
1808
|
-
if (isAIError === void 0) {
|
|
1809
|
-
isAIError = false;
|
|
1810
|
-
}
|
|
1355
|
+
renderErrorComponent: function renderErrorComponent() {
|
|
1356
|
+
var _this4 = this;
|
|
1811
1357
|
var renderError = this.$slots.renderError || this.$props.renderError;
|
|
1812
|
-
if (isAIError) {
|
|
1813
|
-
if (this.showAIScreen && this.AIResponseError && !this.isAIResponseLoading) {
|
|
1814
|
-
if (renderError) {
|
|
1815
|
-
return vue.createVNode("div", {
|
|
1816
|
-
"class": "--ai-answer-error-container " + (getClassName$1(this.$props.innerClass, 'ai-error') || '')
|
|
1817
|
-
}, [renderError(this.AIResponseError)]);
|
|
1818
|
-
}
|
|
1819
|
-
return vue.createVNode("div", {
|
|
1820
|
-
"class": "--ai-answer-error-container " + (getClassName$1(this.$props.innerClass, 'ai-error') || '')
|
|
1821
|
-
}, [vue.createVNode("div", {
|
|
1822
|
-
"class": "--default-error-element"
|
|
1823
|
-
}, [vue.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 : ''])])]);
|
|
1824
|
-
}
|
|
1825
|
-
}
|
|
1826
1358
|
if (this.error && renderError && this.$data.currentValue && !this.isLoading) {
|
|
1827
1359
|
return vue.createVNode(SuggestionWrapper, {
|
|
1828
1360
|
"innerClass": this.$props.innerClass,
|
|
@@ -1831,7 +1363,7 @@ var SearchBox = vue.defineComponent({
|
|
|
1831
1363
|
"themePreset": this.themePreset
|
|
1832
1364
|
}, {
|
|
1833
1365
|
"default": function _default() {
|
|
1834
|
-
return [index.isFunction(renderError) ? renderError(
|
|
1366
|
+
return [index.isFunction(renderError) ? renderError(_this4.error) : renderError];
|
|
1835
1367
|
}
|
|
1836
1368
|
});
|
|
1837
1369
|
}
|
|
@@ -1896,22 +1428,14 @@ var SearchBox = vue.defineComponent({
|
|
|
1896
1428
|
return null;
|
|
1897
1429
|
},
|
|
1898
1430
|
enterButtonOnClick: function enterButtonOnClick() {
|
|
1899
|
-
this.showAIScreen = false;
|
|
1900
1431
|
this.triggerQuery({
|
|
1901
1432
|
isOpen: false,
|
|
1902
1433
|
value: this.currentValue,
|
|
1903
1434
|
customQuery: true
|
|
1904
1435
|
});
|
|
1905
1436
|
},
|
|
1906
|
-
suggestionsFooter: function suggestionsFooter() {
|
|
1907
|
-
return typeof renderSuggestionsFooter === 'function' ? this.$props.renderSuggestionsFooter() : vue.createVNode(AutosuggestFooterContainer, null, {
|
|
1908
|
-
"default": function _default() {
|
|
1909
|
-
return [vue.createVNode("div", null, [vue.createTextVNode("\u2191\u2193 Navigate")]), vue.createVNode("div", null, [vue.createTextVNode("\u21A9 Go")])];
|
|
1910
|
-
}
|
|
1911
|
-
});
|
|
1912
|
-
},
|
|
1913
1437
|
renderEnterButtonElement: function renderEnterButtonElement() {
|
|
1914
|
-
var
|
|
1438
|
+
var _this5 = this;
|
|
1915
1439
|
var _this$$props2 = this.$props,
|
|
1916
1440
|
enterButton = _this$$props2.enterButton,
|
|
1917
1441
|
innerClass = _this$$props2.innerClass;
|
|
@@ -1919,12 +1443,12 @@ var SearchBox = vue.defineComponent({
|
|
|
1919
1443
|
if (enterButton) {
|
|
1920
1444
|
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
1921
1445
|
if (renderEnterButton) {
|
|
1922
|
-
return renderEnterButton(
|
|
1446
|
+
return renderEnterButton(_this5.enterButtonOnClick);
|
|
1923
1447
|
}
|
|
1924
1448
|
return vue.createVNode(Button.Button, {
|
|
1925
1449
|
"class": "enter-btn " + getClassName$1(innerClass, 'enter-button'),
|
|
1926
1450
|
"primary": true,
|
|
1927
|
-
"onClick":
|
|
1451
|
+
"onClick": _this5.enterButtonOnClick
|
|
1928
1452
|
}, {
|
|
1929
1453
|
"default": function _default() {
|
|
1930
1454
|
return [vue.createTextVNode("Search")];
|
|
@@ -1937,98 +1461,71 @@ var SearchBox = vue.defineComponent({
|
|
|
1937
1461
|
}
|
|
1938
1462
|
return null;
|
|
1939
1463
|
},
|
|
1940
|
-
|
|
1941
|
-
|
|
1942
|
-
|
|
1943
|
-
shortcut = shortcut.toLowerCase();
|
|
1944
|
-
shortcut = shortcut.replace('shift', '⬆️');
|
|
1945
|
-
shortcut = shortcut.replace('command', 'cmd');
|
|
1946
|
-
shortcut = shortcut.replace('control', 'ctrl');
|
|
1947
|
-
shortcut = shortcut.replace('option', 'alt');
|
|
1948
|
-
return shortcut.toUpperCase();
|
|
1949
|
-
}
|
|
1950
|
-
return '/';
|
|
1951
|
-
},
|
|
1952
|
-
renderLeftIcons: function renderLeftIcons() {
|
|
1953
|
-
var _this7 = this;
|
|
1954
|
-
var _slot3;
|
|
1464
|
+
renderIcons: function renderIcons() {
|
|
1465
|
+
var _this6 = this;
|
|
1466
|
+
var _slot3, _slot4, _slot5;
|
|
1955
1467
|
var _this$$props3 = this.$props,
|
|
1956
1468
|
iconPosition = _this$$props3.iconPosition,
|
|
1469
|
+
showClear = _this$$props3.showClear,
|
|
1470
|
+
innerClass = _this$$props3.innerClass,
|
|
1471
|
+
getMicInstance = _this$$props3.getMicInstance,
|
|
1472
|
+
showVoiceSearch = _this$$props3.showVoiceSearch,
|
|
1957
1473
|
showIcon = _this$$props3.showIcon;
|
|
1958
|
-
return vue.createVNode("div", null, [vue.createVNode(DropDown.IconGroup, {
|
|
1959
|
-
"groupPosition": "left"
|
|
1960
|
-
}, {
|
|
1961
|
-
"default": function _default() {
|
|
1962
|
-
return [iconPosition === 'left' && showIcon && vue.createVNode(DropDown.IconWrapper, {
|
|
1963
|
-
"onClick": _this7.handleSearchIconClick
|
|
1964
|
-
}, _isSlot(_slot3 = _this7.renderIcon()) ? _slot3 : {
|
|
1965
|
-
"default": function _default() {
|
|
1966
|
-
return [_slot3];
|
|
1967
|
-
}
|
|
1968
|
-
})];
|
|
1969
|
-
}
|
|
1970
|
-
})]);
|
|
1971
|
-
},
|
|
1972
|
-
renderRightIcons: function renderRightIcons() {
|
|
1973
|
-
var _this8 = this;
|
|
1974
|
-
var _slot4, _slot5, _slot6;
|
|
1975
|
-
var _this$$props4 = this.$props,
|
|
1976
|
-
iconPosition = _this$$props4.iconPosition,
|
|
1977
|
-
showClear = _this$$props4.showClear,
|
|
1978
|
-
innerClass = _this$$props4.innerClass,
|
|
1979
|
-
getMicInstance = _this$$props4.getMicInstance,
|
|
1980
|
-
showVoiceSearch = _this$$props4.showVoiceSearch,
|
|
1981
|
-
showIcon = _this$$props4.showIcon,
|
|
1982
|
-
showFocusShortcutsIcon = _this$$props4.showFocusShortcutsIcon;
|
|
1983
1474
|
var renderMic = this.$slots.renderMic || this.$props.renderMic;
|
|
1984
1475
|
var currentValue = this.$data.currentValue;
|
|
1985
1476
|
return vue.createVNode("div", null, [vue.createVNode(DropDown.IconGroup, {
|
|
1986
|
-
"groupPosition": "right"
|
|
1477
|
+
"groupPosition": "right",
|
|
1478
|
+
"positionType": "absolute"
|
|
1987
1479
|
}, {
|
|
1988
1480
|
"default": function _default() {
|
|
1989
1481
|
return [currentValue && showClear && vue.createVNode(DropDown.IconWrapper, {
|
|
1990
|
-
"onClick":
|
|
1482
|
+
"onClick": _this6.clearValue,
|
|
1991
1483
|
"showIcon": showIcon,
|
|
1992
1484
|
"isClearIcon": true
|
|
1993
|
-
}, _isSlot(
|
|
1994
|
-
"default": function _default() {
|
|
1995
|
-
return [_slot4];
|
|
1996
|
-
}
|
|
1997
|
-
}), showFocusShortcutsIcon && vue.createVNode(DropDown.ButtonIconWrapper, {
|
|
1998
|
-
"onClick": function onClick(e) {
|
|
1999
|
-
return _this8.focusSearchBox(e);
|
|
2000
|
-
}
|
|
2001
|
-
}, _isSlot(_slot5 = _this8.renderShortcut()) ? _slot5 : {
|
|
1485
|
+
}, _isSlot(_slot3 = _this6.renderCancelIcon()) ? _slot3 : {
|
|
2002
1486
|
"default": function _default() {
|
|
2003
|
-
return [
|
|
1487
|
+
return [_slot3];
|
|
2004
1488
|
}
|
|
2005
1489
|
}), showVoiceSearch && vue.createVNode(Mic, {
|
|
2006
1490
|
"getInstance": getMicInstance,
|
|
2007
1491
|
"render": renderMic,
|
|
2008
|
-
"handleResult":
|
|
1492
|
+
"handleResult": _this6.handleVoiceResults,
|
|
2009
1493
|
"className": getClassName$1(innerClass, 'mic') || null
|
|
2010
1494
|
}, null), iconPosition === 'right' && showIcon && vue.createVNode(DropDown.IconWrapper, {
|
|
2011
|
-
"onClick":
|
|
2012
|
-
}, _isSlot(
|
|
1495
|
+
"onClick": _this6.handleSearchIconClick
|
|
1496
|
+
}, _isSlot(_slot4 = _this6.renderIcon()) ? _slot4 : {
|
|
1497
|
+
"default": function _default() {
|
|
1498
|
+
return [_slot4];
|
|
1499
|
+
}
|
|
1500
|
+
})];
|
|
1501
|
+
}
|
|
1502
|
+
}), vue.createVNode(DropDown.IconGroup, {
|
|
1503
|
+
"groupPosition": "left",
|
|
1504
|
+
"positionType": "absolute"
|
|
1505
|
+
}, {
|
|
1506
|
+
"default": function _default() {
|
|
1507
|
+
return [iconPosition === 'left' && showIcon && vue.createVNode(DropDown.IconWrapper, {
|
|
1508
|
+
"onClick": _this6.handleSearchIconClick
|
|
1509
|
+
}, _isSlot(_slot5 = _this6.renderIcon()) ? _slot5 : {
|
|
2013
1510
|
"default": function _default() {
|
|
2014
|
-
return [
|
|
1511
|
+
return [_slot5];
|
|
2015
1512
|
}
|
|
2016
1513
|
})];
|
|
2017
1514
|
}
|
|
2018
1515
|
})]);
|
|
2019
1516
|
},
|
|
2020
1517
|
focusSearchBox: function focusSearchBox(event) {
|
|
2021
|
-
var _this$$
|
|
1518
|
+
var _this$$refs, _this$$refs$this$$pro;
|
|
2022
1519
|
var elt = event.target || event.srcElement;
|
|
2023
1520
|
var tagName = elt.tagName;
|
|
2024
1521
|
if (elt.isContentEditable || tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA') {
|
|
2025
1522
|
// already in an input
|
|
2026
1523
|
return;
|
|
2027
1524
|
}
|
|
2028
|
-
(_this$$
|
|
1525
|
+
(_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
|
|
2029
1526
|
},
|
|
2030
1527
|
listenForFocusShortcuts: function listenForFocusShortcuts() {
|
|
2031
|
-
var
|
|
1528
|
+
var _this7 = this;
|
|
2032
1529
|
var _this$$props$focusSho = this.$props.focusShortcuts,
|
|
2033
1530
|
focusShortcuts = _this$$props$focusSho === void 0 ? ['/'] : _this$$props$focusSho;
|
|
2034
1531
|
if (index.isEmpty(focusShortcuts)) {
|
|
@@ -2043,7 +1540,7 @@ var SearchBox = vue.defineComponent({
|
|
|
2043
1540
|
function (event, handler) {
|
|
2044
1541
|
// Prevent the default refresh event under WINDOWS system
|
|
2045
1542
|
event.preventDefault();
|
|
2046
|
-
|
|
1543
|
+
_this7.focusSearchBox(event);
|
|
2047
1544
|
});
|
|
2048
1545
|
|
|
2049
1546
|
// if one of modifier keys are used, they are handled below
|
|
@@ -2053,7 +1550,7 @@ var SearchBox = vue.defineComponent({
|
|
|
2053
1550
|
for (var index$1 = 0; index$1 < modifierKeys.length; index$1 += 1) {
|
|
2054
1551
|
var element = modifierKeys[index$1];
|
|
2055
1552
|
if (hotkeys[element]) {
|
|
2056
|
-
|
|
1553
|
+
_this7.focusSearchBox(event);
|
|
2057
1554
|
break;
|
|
2058
1555
|
}
|
|
2059
1556
|
}
|
|
@@ -2065,34 +1562,19 @@ var SearchBox = vue.defineComponent({
|
|
|
2065
1562
|
this.currentValue = index.decodeHtml(value);
|
|
2066
1563
|
this.triggerDefaultQuery(value);
|
|
2067
1564
|
},
|
|
2068
|
-
|
|
2069
|
-
var
|
|
1565
|
+
renderAutoFill: function renderAutoFill(suggestion) {
|
|
1566
|
+
var _this8 = this;
|
|
2070
1567
|
var handleAutoFillClick = function handleAutoFillClick(e) {
|
|
2071
1568
|
e.stopPropagation();
|
|
2072
|
-
|
|
1569
|
+
_this8.onAutofillClick(suggestion);
|
|
2073
1570
|
};
|
|
2074
|
-
|
|
2075
|
-
|
|
2076
|
-
|
|
2077
|
-
|
|
2078
|
-
transform: 'rotate(135deg)',
|
|
2079
|
-
pointerEvents: 'none'
|
|
2080
|
-
}
|
|
2081
|
-
}, null);
|
|
2082
|
-
}
|
|
2083
|
-
return null;
|
|
2084
|
-
}
|
|
2085
|
-
if (!suggestion._category) {
|
|
2086
|
-
/* 👇 avoid showing autofill for category suggestions👇 */
|
|
2087
|
-
|
|
2088
|
-
return vue.createVNode(AutoFillSvg, {
|
|
2089
|
-
"onClick": handleAutoFillClick
|
|
2090
|
-
}, null);
|
|
2091
|
-
}
|
|
2092
|
-
return null;
|
|
1571
|
+
/* 👇 avoid showing autofill for category suggestions👇 */
|
|
1572
|
+
return suggestion._category ? null : vue.createVNode(AutoFillSvg, {
|
|
1573
|
+
"onClick": handleAutoFillClick
|
|
1574
|
+
}, null);
|
|
2093
1575
|
},
|
|
2094
1576
|
renderTag: function renderTag(item) {
|
|
2095
|
-
var
|
|
1577
|
+
var _this9 = this;
|
|
2096
1578
|
var innerClass = this.$props.innerClass;
|
|
2097
1579
|
return vue.createVNode(TagItem, {
|
|
2098
1580
|
"class": getClassName$1(innerClass, 'selected-tag') || ''
|
|
@@ -2103,7 +1585,7 @@ var SearchBox = vue.defineComponent({
|
|
|
2103
1585
|
"aria-label": "delete-tag",
|
|
2104
1586
|
"class": "close-icon",
|
|
2105
1587
|
"onClick": function onClick() {
|
|
2106
|
-
return
|
|
1588
|
+
return _this9.clearTag(item);
|
|
2107
1589
|
}
|
|
2108
1590
|
}, [vue.createVNode(DropDown.CancelSvg, null, null)])];
|
|
2109
1591
|
}
|
|
@@ -2126,7 +1608,7 @@ var SearchBox = vue.defineComponent({
|
|
|
2126
1608
|
}
|
|
2127
1609
|
},
|
|
2128
1610
|
renderTags: function renderTags() {
|
|
2129
|
-
var
|
|
1611
|
+
var _this10 = this;
|
|
2130
1612
|
if (!Array.isArray(this.selectedTags)) {
|
|
2131
1613
|
return null;
|
|
2132
1614
|
}
|
|
@@ -2140,193 +1622,25 @@ var SearchBox = vue.defineComponent({
|
|
|
2140
1622
|
}) : vue.createVNode(TagsContainer, null, {
|
|
2141
1623
|
"default": function _default() {
|
|
2142
1624
|
return [tagsList.map(function (item) {
|
|
2143
|
-
return
|
|
1625
|
+
return _this10.renderTag(item);
|
|
2144
1626
|
}), shouldRenderClearAllTag && vue.createVNode(TagItem, {
|
|
2145
|
-
"class": getClassName$1(
|
|
1627
|
+
"class": getClassName$1(_this10.$props.innerClass, 'selected-tag') || ''
|
|
2146
1628
|
}, {
|
|
2147
1629
|
"default": function _default() {
|
|
2148
1630
|
return [vue.createVNode("span", null, [vue.createTextVNode("Clear All")]), vue.createVNode("span", {
|
|
2149
1631
|
"role": "img",
|
|
2150
1632
|
"aria-label": "delete-tag",
|
|
2151
1633
|
"class": "close-icon",
|
|
2152
|
-
"onClick":
|
|
1634
|
+
"onClick": _this10.clearAllTags
|
|
2153
1635
|
}, [vue.createVNode(DropDown.CancelSvg, null, null)])];
|
|
2154
1636
|
}
|
|
2155
1637
|
})];
|
|
2156
1638
|
}
|
|
2157
1639
|
});
|
|
2158
|
-
},
|
|
2159
|
-
getAISourceObjects: function getAISourceObjects() {
|
|
2160
|
-
var localCache = helper.getObjectFromLocalStorage(constants.AI_LOCAL_CACHE_KEY) && helper.getObjectFromLocalStorage(constants.AI_LOCAL_CACHE_KEY)[this.componentId];
|
|
2161
|
-
var sourceObjects = [];
|
|
2162
|
-
if (!this.AIResponse) return sourceObjects;
|
|
2163
|
-
var docIds = this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds || [];
|
|
2164
|
-
if (localCache && localCache.meta && localCache.meta.hits && localCache.meta.hits.hits) {
|
|
2165
|
-
docIds.forEach(function (id) {
|
|
2166
|
-
var foundSourceObj = localCache.meta.hits.hits.find(function (hit) {
|
|
2167
|
-
return hit._id === id;
|
|
2168
|
-
}) || {};
|
|
2169
|
-
if (foundSourceObj) {
|
|
2170
|
-
var _foundSourceObj$_sour = foundSourceObj._source,
|
|
2171
|
-
_source = _foundSourceObj$_sour === void 0 ? {} : _foundSourceObj$_sour,
|
|
2172
|
-
rest = _rollupPluginBabelHelpers._objectWithoutPropertiesLoose(foundSourceObj, _excluded);
|
|
2173
|
-
sourceObjects.push(_rollupPluginBabelHelpers._extends({}, rest, _source));
|
|
2174
|
-
}
|
|
2175
|
-
});
|
|
2176
|
-
} else {
|
|
2177
|
-
sourceObjects.push.apply(sourceObjects, docIds.map(function (id) {
|
|
2178
|
-
return {
|
|
2179
|
-
_id: id
|
|
2180
|
-
};
|
|
2181
|
-
}));
|
|
2182
|
-
}
|
|
2183
|
-
return sourceObjects;
|
|
2184
|
-
},
|
|
2185
|
-
renderAIScreenLoader: function renderAIScreenLoader() {
|
|
2186
|
-
var _this$$props$AIUIConf = this.$props.AIUIConfig,
|
|
2187
|
-
AIUIConfig = _this$$props$AIUIConf === void 0 ? {} : _this$$props$AIUIConf;
|
|
2188
|
-
var _ref5 = AIUIConfig || {},
|
|
2189
|
-
loaderMessage = _ref5.loaderMessage;
|
|
2190
|
-
if (loaderMessage) {
|
|
2191
|
-
return loaderMessage;
|
|
2192
|
-
}
|
|
2193
|
-
if (this.$slots.AILoaderMessage) {
|
|
2194
|
-
return this.$slots.AILoaderMessage();
|
|
2195
|
-
}
|
|
2196
|
-
return vue.createVNode(HorizontalSkeletonLoader, null, null);
|
|
2197
|
-
},
|
|
2198
|
-
renderAIScreenFooter: function renderAIScreenFooter() {
|
|
2199
|
-
var _slot7;
|
|
2200
|
-
var _this13 = this;
|
|
2201
|
-
var _this$$props$AIUIConf2 = this.$props.AIUIConfig,
|
|
2202
|
-
AIUIConfig = _this$$props$AIUIConf2 === void 0 ? {} : _this$$props$AIUIConf2;
|
|
2203
|
-
var _ref6 = AIUIConfig || {},
|
|
2204
|
-
_ref6$showSourceDocum = _ref6.showSourceDocuments,
|
|
2205
|
-
showSourceDocuments = _ref6$showSourceDocum === void 0 ? true : _ref6$showSourceDocum,
|
|
2206
|
-
_ref6$sourceDocumentL = _ref6.sourceDocumentLabel,
|
|
2207
|
-
sourceDocumentLabel = _ref6$sourceDocumentL === void 0 ? '_id' : _ref6$sourceDocumentL,
|
|
2208
|
-
_ref6$onSourceClick = _ref6.onSourceClick,
|
|
2209
|
-
onSourceClick = _ref6$onSourceClick === void 0 ? function () {} : _ref6$onSourceClick;
|
|
2210
|
-
return showSourceDocuments && this.showAIScreenFooter && this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds ? vue.createVNode(Footer, {
|
|
2211
|
-
"themePreset": this.$props.themePreset
|
|
2212
|
-
}, {
|
|
2213
|
-
"default": function _default() {
|
|
2214
|
-
return [vue.createTextVNode("Summary generated using the following sources:"), ' ', vue.createVNode(SourceTags, null, _isSlot(_slot7 = _this13.getAISourceObjects().map(function (el) {
|
|
2215
|
-
return vue.createVNode(Button.Button, {
|
|
2216
|
-
"class": "--ai-source-tag " + (getClassName$1(_this13.$props.innerClass, 'ai-source-tag') || ''),
|
|
2217
|
-
"title": el[sourceDocumentLabel],
|
|
2218
|
-
"info": true,
|
|
2219
|
-
"onClick": function onClick() {
|
|
2220
|
-
return onSourceClick && onSourceClick(el);
|
|
2221
|
-
}
|
|
2222
|
-
}, {
|
|
2223
|
-
"default": function _default() {
|
|
2224
|
-
return [el[sourceDocumentLabel]];
|
|
2225
|
-
}
|
|
2226
|
-
});
|
|
2227
|
-
})) ? _slot7 : {
|
|
2228
|
-
"default": function _default() {
|
|
2229
|
-
return [_slot7];
|
|
2230
|
-
}
|
|
2231
|
-
})];
|
|
2232
|
-
}
|
|
2233
|
-
}) : null;
|
|
2234
|
-
},
|
|
2235
|
-
renderAIScreen: function renderAIScreen() {
|
|
2236
|
-
var _this14 = this;
|
|
2237
|
-
var customAIRenderer = this.$props.renderAIAnswer || this.$slots.renderAIAnswer;
|
|
2238
|
-
if (customAIRenderer) {
|
|
2239
|
-
return customAIRenderer({
|
|
2240
|
-
question: this.AIResponse && this.AIResponse.response && this.AIResponse.response.question,
|
|
2241
|
-
answer: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.text,
|
|
2242
|
-
documentIds: this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.documentIds || [],
|
|
2243
|
-
loading: this.isAIResponseLoading || this.isLoading,
|
|
2244
|
-
sources: this.getAISourceObjects(),
|
|
2245
|
-
error: this.AIResponseError
|
|
2246
|
-
});
|
|
2247
|
-
}
|
|
2248
|
-
if (this.isAIResponseLoading || this.isLoading) {
|
|
2249
|
-
return this.renderAIScreenLoader();
|
|
2250
|
-
}
|
|
2251
|
-
return vue.createVNode("div", null, [vue.createVNode(Answer, {
|
|
2252
|
-
"innerHTML": md.render(this.AIResponse && this.AIResponse.response && this.AIResponse.response.answer && this.AIResponse.response.answer.text)
|
|
2253
|
-
}, null), this.renderAIScreenFooter(), this.showFeedbackComponent && vue.createVNode("div", {
|
|
2254
|
-
"class": "" + (getClassName$1(this.$props.innerClass, 'ai-feedback') || '')
|
|
2255
|
-
}, [vue.createVNode(AIFeedback, {
|
|
2256
|
-
"overrideState": this.feedbackState,
|
|
2257
|
-
"hideUI": this.isAIResponseLoading || this.isLoading || !this.sessionIdFromStore,
|
|
2258
|
-
"key": this.sessionIdFromStore,
|
|
2259
|
-
"onFeedbackSubmit": function onFeedbackSubmit(useful, reason) {
|
|
2260
|
-
_this14.feedbackState = {
|
|
2261
|
-
isRecorded: true,
|
|
2262
|
-
feedbackType: useful ? 'positive' : 'negative'
|
|
2263
|
-
};
|
|
2264
|
-
_this14.recordAISessionUsefulness(_this14.sessionIdFromStore, {
|
|
2265
|
-
useful: useful,
|
|
2266
|
-
reason: reason
|
|
2267
|
-
});
|
|
2268
|
-
}
|
|
2269
|
-
}, null)])]);
|
|
2270
|
-
},
|
|
2271
|
-
handleTextAreaHeightChange: function handleTextAreaHeightChange() {
|
|
2272
|
-
var _this$$refs$this$$pro, _this$$refs$_inputGro;
|
|
2273
|
-
var textArea = (_this$$refs$this$$pro = this.$refs[this.$props.innerRef]) == null ? void 0 : _this$$refs$this$$pro.$el;
|
|
2274
|
-
var inputGroupEle = (_this$$refs$_inputGro = this.$refs[_inputGroupRef]) == null ? void 0 : _this$$refs$_inputGro.$el;
|
|
2275
|
-
if (textArea) {
|
|
2276
|
-
textArea.style.height = '42px';
|
|
2277
|
-
var lineHeight = parseInt(getComputedStyle(textArea).lineHeight, 10);
|
|
2278
|
-
var maxHeight = lineHeight * 4; // max height for 3 lines
|
|
2279
|
-
var height = Math.min(textArea.scrollHeight, maxHeight);
|
|
2280
|
-
textArea.style.height = height + "px";
|
|
2281
|
-
textArea.style.overflowY = height === maxHeight ? 'auto' : 'hidden';
|
|
2282
|
-
var dropdownEle = this.$refs[_dropdownULRef];
|
|
2283
|
-
if (dropdownEle) {
|
|
2284
|
-
dropdownEle.style.top = "" + textArea.style.height;
|
|
2285
|
-
}
|
|
2286
|
-
if (inputGroupEle) {
|
|
2287
|
-
inputGroupEle.style.height = "" + textArea.style.height;
|
|
2288
|
-
}
|
|
2289
|
-
}
|
|
2290
|
-
},
|
|
2291
|
-
askButtonOnClick: function askButtonOnClick() {
|
|
2292
|
-
this.showAIScreen = true;
|
|
2293
|
-
this.isOpen = true;
|
|
2294
|
-
this.triggerDefaultQuery(this.currentValue, {
|
|
2295
|
-
enableAI: true
|
|
2296
|
-
});
|
|
2297
|
-
},
|
|
2298
|
-
renderAskButtonElement: function renderAskButtonElement() {
|
|
2299
|
-
var _this15 = this;
|
|
2300
|
-
var _this$$props5 = this.$props,
|
|
2301
|
-
AIUIConfig = _this$$props5.AIUIConfig,
|
|
2302
|
-
innerClass = _this$$props5.innerClass;
|
|
2303
|
-
var _ref7 = AIUIConfig || {},
|
|
2304
|
-
askButton = _ref7.askButton;
|
|
2305
|
-
var renderAskButton = this.$slots.renderAskButton;
|
|
2306
|
-
if (askButton) {
|
|
2307
|
-
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
2308
|
-
if (renderAskButton) {
|
|
2309
|
-
return renderAskButton(_this15.askButtonOnClick);
|
|
2310
|
-
}
|
|
2311
|
-
return vue.createVNode(Button.Button, {
|
|
2312
|
-
"class": "enter-btn " + getClassName$1(innerClass, 'ask-button'),
|
|
2313
|
-
"info": true,
|
|
2314
|
-
"onClick": _this15.askButtonOnClick
|
|
2315
|
-
}, {
|
|
2316
|
-
"default": function _default() {
|
|
2317
|
-
return [vue.createTextVNode("Ask")];
|
|
2318
|
-
}
|
|
2319
|
-
});
|
|
2320
|
-
};
|
|
2321
|
-
return vue.createVNode("div", {
|
|
2322
|
-
"class": "enter-button-wrapper"
|
|
2323
|
-
}, [getEnterButtonMarkup()]);
|
|
2324
|
-
}
|
|
2325
|
-
return null;
|
|
2326
1640
|
}
|
|
2327
1641
|
},
|
|
2328
1642
|
render: function render() {
|
|
2329
|
-
var
|
|
1643
|
+
var _this11 = this;
|
|
2330
1644
|
var expandSuggestionsContainer = this.$props.expandSuggestionsContainer;
|
|
2331
1645
|
var _this$$slots = this.$slots,
|
|
2332
1646
|
recentSearchesIcon = _this$$slots.recentSearchesIcon,
|
|
@@ -2337,250 +1651,164 @@ var SearchBox = vue.defineComponent({
|
|
|
2337
1651
|
"class": this.$props.className
|
|
2338
1652
|
}, {
|
|
2339
1653
|
"default": function _default() {
|
|
2340
|
-
return [
|
|
2341
|
-
"class": getClassName$1(
|
|
1654
|
+
return [_this11.$props.title && vue.createVNode(Title.Title, {
|
|
1655
|
+
"class": getClassName$1(_this11.$props.innerClass, 'title') || ''
|
|
2342
1656
|
}, {
|
|
2343
1657
|
"default": function _default() {
|
|
2344
|
-
return [
|
|
1658
|
+
return [_this11.$props.title];
|
|
2345
1659
|
}
|
|
2346
|
-
}),
|
|
2347
|
-
"id":
|
|
2348
|
-
"handleChange":
|
|
2349
|
-
"handleMouseup":
|
|
2350
|
-
"isOpen":
|
|
1660
|
+
}), _this11.$props.autosuggest ? vue.createVNode(DropDown.Downshift, {
|
|
1661
|
+
"id": _this11.$props.componentId + "-downshift",
|
|
1662
|
+
"handleChange": _this11.onSuggestionSelected,
|
|
1663
|
+
"handleMouseup": _this11.handleStateChange,
|
|
1664
|
+
"isOpen": _this11.$data.isOpen
|
|
2351
1665
|
}, {
|
|
2352
|
-
"default": function _default(
|
|
2353
|
-
var getInputEvents =
|
|
2354
|
-
getInputProps =
|
|
2355
|
-
getItemProps =
|
|
2356
|
-
getItemEvents =
|
|
2357
|
-
isOpen =
|
|
2358
|
-
highlightedIndex =
|
|
2359
|
-
setHighlightedIndex =
|
|
1666
|
+
"default": function _default(_ref5) {
|
|
1667
|
+
var getInputEvents = _ref5.getInputEvents,
|
|
1668
|
+
getInputProps = _ref5.getInputProps,
|
|
1669
|
+
getItemProps = _ref5.getItemProps,
|
|
1670
|
+
getItemEvents = _ref5.getItemEvents,
|
|
1671
|
+
isOpen = _ref5.isOpen,
|
|
1672
|
+
highlightedIndex = _ref5.highlightedIndex,
|
|
1673
|
+
setHighlightedIndex = _ref5.setHighlightedIndex;
|
|
2360
1674
|
var renderSuggestionsDropdown = function renderSuggestionsDropdown() {
|
|
2361
|
-
var getIcon = function getIcon(iconType
|
|
1675
|
+
var getIcon = function getIcon(iconType) {
|
|
2362
1676
|
switch (iconType) {
|
|
2363
1677
|
case helper.suggestionTypes.Recent:
|
|
2364
1678
|
return recentSearchesIcon;
|
|
2365
1679
|
case helper.suggestionTypes.Popular:
|
|
2366
1680
|
return popularSearchesIcon;
|
|
2367
|
-
case helper.suggestionTypes.Featured:
|
|
2368
|
-
if (item.icon) {
|
|
2369
|
-
return function () {
|
|
2370
|
-
return vue.createVNode("div", {
|
|
2371
|
-
"style": {
|
|
2372
|
-
display: 'flex'
|
|
2373
|
-
},
|
|
2374
|
-
"innerHTML": xss(item.icon)
|
|
2375
|
-
}, null);
|
|
2376
|
-
};
|
|
2377
|
-
}
|
|
2378
|
-
if (item.iconURL) {
|
|
2379
|
-
return function () {
|
|
2380
|
-
return (// When you change below also change the empty icon below
|
|
2381
|
-
vue.createVNode("img", {
|
|
2382
|
-
"style": {
|
|
2383
|
-
maxHeight: '25px'
|
|
2384
|
-
},
|
|
2385
|
-
"src": xss(item.iconURL),
|
|
2386
|
-
"alt": item.value
|
|
2387
|
-
}, null)
|
|
2388
|
-
);
|
|
2389
|
-
};
|
|
2390
|
-
}
|
|
2391
|
-
// Render an empty icon when no icon is provided from the dashboard
|
|
2392
|
-
return function () {
|
|
2393
|
-
return vue.createVNode("span", {
|
|
2394
|
-
"style": {
|
|
2395
|
-
display: 'inline-block',
|
|
2396
|
-
height: '25px',
|
|
2397
|
-
width: leaveSpaceForIcon ? '25px' : 0
|
|
2398
|
-
}
|
|
2399
|
-
}, null);
|
|
2400
|
-
};
|
|
2401
1681
|
default:
|
|
2402
1682
|
return null;
|
|
2403
1683
|
}
|
|
2404
1684
|
};
|
|
2405
|
-
|
|
2406
|
-
return vue.createVNode("div", null, [_this16.hasCustomRenderer && _this16.getComponent({
|
|
1685
|
+
return vue.createVNode("div", null, [_this11.hasCustomRenderer && _this11.getComponent({
|
|
2407
1686
|
isOpen: isOpen,
|
|
2408
1687
|
getItemProps: getItemProps,
|
|
2409
1688
|
getItemEvents: getItemEvents,
|
|
2410
1689
|
highlightedIndex: highlightedIndex
|
|
2411
|
-
}),
|
|
2412
|
-
"class": Input.suggestions(
|
|
2413
|
-
|
|
2414
|
-
|
|
2415
|
-
|
|
2416
|
-
|
|
2417
|
-
|
|
2418
|
-
|
|
2419
|
-
|
|
2420
|
-
|
|
2421
|
-
|
|
2422
|
-
|
|
2423
|
-
|
|
2424
|
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
|
|
2428
|
-
|
|
2429
|
-
|
|
2430
|
-
|
|
2431
|
-
|
|
2432
|
-
|
|
2433
|
-
|
|
2434
|
-
|
|
2435
|
-
|
|
2436
|
-
|
|
2437
|
-
|
|
2438
|
-
|
|
2439
|
-
|
|
2440
|
-
|
|
2441
|
-
|
|
2442
|
-
|
|
2443
|
-
|
|
2444
|
-
|
|
2445
|
-
|
|
2446
|
-
|
|
2447
|
-
|
|
2448
|
-
|
|
2449
|
-
|
|
2450
|
-
}), _transformOn(getItemEvents({
|
|
2451
|
-
item: sectionItem
|
|
2452
|
-
})), {
|
|
2453
|
-
"key": index + sectionIndex,
|
|
2454
|
-
"style": {
|
|
2455
|
-
justifyContent: 'flex-start',
|
|
2456
|
-
alignItems: 'center'
|
|
2457
|
-
},
|
|
2458
|
-
"class": "" + (highlightedIndex === index + sectionIndex ? "active-li-item " + getClassName$1(_this16.$props.innerClass, 'active-suggestion-item') : "li-item " + getClassName$1(_this16.$props.innerClass, 'suggestion-item'))
|
|
2459
|
-
}), [vue.createVNode("div", {
|
|
2460
|
-
"style": {
|
|
2461
|
-
padding: '0 10px 0 0',
|
|
2462
|
-
display: 'flex'
|
|
2463
|
-
}
|
|
2464
|
-
}, [vue.createVNode(CustomSvg, {
|
|
2465
|
-
"className": getClassName$1(_this16.$props.innerClass, sectionItem._suggestion_type + "-search-icon") || null,
|
|
2466
|
-
"icon": getIcon(sectionItem._suggestion_type, sectionItem, suggestionsHaveIcon),
|
|
2467
|
-
"type": sectionItem._suggestion_type + "-search-icon"
|
|
2468
|
-
}, null)]), vue.createVNode(SuggestionItem, {
|
|
2469
|
-
"currentValue": _this16.currentValue,
|
|
2470
|
-
"suggestion": sectionItem
|
|
2471
|
-
}, null), _this16.renderActionIcon(sectionItem)]);
|
|
2472
|
-
})])]);
|
|
2473
|
-
}
|
|
2474
|
-
return vue.createVNode("div", null, [vue.createTextVNode("No suggestions")]);
|
|
2475
|
-
}), _this16.$props.showSuggestionsFooter ? _this16.suggestionsFooter() : null]) : _this16.renderNoSuggestions(_this16.normalizedSuggestions)]);
|
|
1690
|
+
}), _this11.renderErrorComponent(), !_this11.hasCustomRenderer && isOpen && hasSuggestions ? vue.createVNode("ul", {
|
|
1691
|
+
"class": Input.suggestions(_this11.themePreset, _this11.theme) + " " + getClassName$1(_this11.$props.innerClass, 'list')
|
|
1692
|
+
}, [_this11.normalizedSuggestions.map(function (item, index) {
|
|
1693
|
+
return renderItem ? vue.createVNode("li", vue.mergeProps(getItemProps({
|
|
1694
|
+
item: item
|
|
1695
|
+
}), getItemEvents({
|
|
1696
|
+
item: item
|
|
1697
|
+
}), {
|
|
1698
|
+
"key": index + 1 + "-" + item.value,
|
|
1699
|
+
"style": {
|
|
1700
|
+
backgroundColor: _this11.getBackgroundColor(highlightedIndex, index),
|
|
1701
|
+
justifyContent: 'flex-start',
|
|
1702
|
+
alignItems: 'center'
|
|
1703
|
+
}
|
|
1704
|
+
}), [renderItem(item)]) : vue.createVNode("li", vue.mergeProps(getItemProps({
|
|
1705
|
+
item: item
|
|
1706
|
+
}), _transformOn(getItemEvents({
|
|
1707
|
+
item: item
|
|
1708
|
+
})), {
|
|
1709
|
+
"key": index + 1 + "-" + item.value,
|
|
1710
|
+
"style": {
|
|
1711
|
+
backgroundColor: _this11.getBackgroundColor(highlightedIndex, index),
|
|
1712
|
+
justifyContent: 'flex-start',
|
|
1713
|
+
alignItems: 'center'
|
|
1714
|
+
}
|
|
1715
|
+
}), [vue.createVNode("div", {
|
|
1716
|
+
"style": {
|
|
1717
|
+
padding: '0 10px 0 0',
|
|
1718
|
+
display: 'flex'
|
|
1719
|
+
}
|
|
1720
|
+
}, [vue.createVNode(CustomSvg, {
|
|
1721
|
+
"className": getClassName$1(_this11.$props.innerClass, item._suggestion_type + "-search-icon") || null,
|
|
1722
|
+
"icon": getIcon(item._suggestion_type),
|
|
1723
|
+
"type": item._suggestion_type + "-search-icon"
|
|
1724
|
+
}, null)]), vue.createVNode(SuggestionItem, {
|
|
1725
|
+
"currentValue": _this11.currentValue,
|
|
1726
|
+
"suggestion": item
|
|
1727
|
+
}, null), _this11.renderAutoFill(item)]);
|
|
1728
|
+
})]) : _this11.renderNoSuggestions(_this11.normalizedSuggestions)]);
|
|
2476
1729
|
};
|
|
2477
1730
|
return vue.createVNode("div", {
|
|
2478
1731
|
"class": Input.suggestionsContainer
|
|
2479
|
-
}, [vue.createVNode(InputGroup, {
|
|
2480
|
-
"searchBox": true,
|
|
2481
|
-
"ref": _inputGroupRef
|
|
2482
|
-
}, {
|
|
1732
|
+
}, [vue.createVNode(InputGroup, null, {
|
|
2483
1733
|
"default": function _default() {
|
|
2484
|
-
return [vue.createVNode(
|
|
1734
|
+
return [_this11.renderInputAddonBefore(), vue.createVNode(DropDown.InputWrapper, null, {
|
|
2485
1735
|
"default": function _default() {
|
|
2486
|
-
return [
|
|
2487
|
-
|
|
2488
|
-
}), vue.createVNode(DropDown.InputWrapper, null, {
|
|
2489
|
-
"default": function _default() {
|
|
2490
|
-
return [vue.createVNode(Input.TextArea, vue.mergeProps(_transformOn(getInputEvents({
|
|
2491
|
-
onInput: _this16.onInputChange,
|
|
1736
|
+
return [vue.createVNode(Input.Input, vue.mergeProps(_transformOn(getInputEvents({
|
|
1737
|
+
onInput: _this11.onInputChange,
|
|
2492
1738
|
onBlur: function onBlur(e) {
|
|
2493
|
-
|
|
1739
|
+
_this11.$emit('blur', e, _this11.triggerQuery);
|
|
2494
1740
|
},
|
|
2495
|
-
onFocus:
|
|
1741
|
+
onFocus: _this11.handleFocus,
|
|
2496
1742
|
onKeyPress: function onKeyPress(e) {
|
|
2497
|
-
|
|
2498
|
-
|
|
1743
|
+
_this11.$emit('keyPress', e, _this11.triggerQuery);
|
|
1744
|
+
_this11.$emit('key-press', e, _this11.triggerQuery);
|
|
2499
1745
|
},
|
|
2500
1746
|
onKeyDown: function onKeyDown(e) {
|
|
2501
|
-
return
|
|
1747
|
+
return _this11.handleKeyDown(e, highlightedIndex);
|
|
2502
1748
|
},
|
|
2503
1749
|
onKeyUp: function onKeyUp(e) {
|
|
2504
|
-
|
|
2505
|
-
|
|
1750
|
+
_this11.$emit('keyUp', e, _this11.triggerQuery);
|
|
1751
|
+
_this11.$emit('key-up', e, _this11.triggerQuery);
|
|
2506
1752
|
},
|
|
2507
1753
|
onClick: function onClick() {
|
|
2508
1754
|
setHighlightedIndex(null);
|
|
2509
1755
|
}
|
|
2510
1756
|
})), {
|
|
2511
|
-
"id":
|
|
2512
|
-
"showIcon":
|
|
2513
|
-
"showClear":
|
|
2514
|
-
"iconPosition":
|
|
2515
|
-
"ref":
|
|
2516
|
-
"class": getClassName$1(
|
|
2517
|
-
"placeholder":
|
|
2518
|
-
"autoFocus":
|
|
2519
|
-
"searchBox": true,
|
|
2520
|
-
"showFocusShortcutsIcon": _this16.$props.showFocusShortcutsIcon,
|
|
2521
|
-
"showVoiceSearch": _this16.$props.showVoiceSearch
|
|
1757
|
+
"id": _this11.$props.componentId + "-input",
|
|
1758
|
+
"showIcon": _this11.$props.showIcon,
|
|
1759
|
+
"showClear": _this11.$props.showClear,
|
|
1760
|
+
"iconPosition": _this11.$props.iconPosition,
|
|
1761
|
+
"ref": _this11.$props.innerRef,
|
|
1762
|
+
"class": getClassName$1(_this11.$props.innerClass, 'input'),
|
|
1763
|
+
"placeholder": _this11.$props.placeholder,
|
|
1764
|
+
"autoFocus": _this11.$props.autoFocus
|
|
2522
1765
|
}, getInputProps({
|
|
2523
|
-
value:
|
|
1766
|
+
value: _this11.$data.currentValue === null ? '' : _this11.$data.currentValue
|
|
2524
1767
|
}), {
|
|
2525
|
-
"themePreset":
|
|
1768
|
+
"themePreset": _this11.themePreset,
|
|
2526
1769
|
"autocomplete": "off"
|
|
2527
|
-
}), null), !expandSuggestionsContainer && renderSuggestionsDropdown()];
|
|
2528
|
-
}
|
|
2529
|
-
}), vue.createVNode(Input.Actions, null, {
|
|
2530
|
-
"default": function _default() {
|
|
2531
|
-
return [_this16.renderRightIcons(), _this16.renderInputAddonAfter(), _this16.renderAskButtonElement(), _this16.renderEnterButtonElement()];
|
|
1770
|
+
}), null), _this11.renderIcons(), !expandSuggestionsContainer && renderSuggestionsDropdown()];
|
|
2532
1771
|
}
|
|
2533
|
-
})];
|
|
1772
|
+
}), _this11.renderInputAddonAfter(), _this11.renderEnterButtonElement()];
|
|
2534
1773
|
}
|
|
2535
|
-
}), expandSuggestionsContainer && renderSuggestionsDropdown(),
|
|
1774
|
+
}), expandSuggestionsContainer && renderSuggestionsDropdown(), _this11.renderTags()]);
|
|
2536
1775
|
}
|
|
2537
1776
|
}) : vue.createVNode("div", {
|
|
2538
1777
|
"class": Input.suggestionsContainer
|
|
2539
|
-
}, [vue.createVNode(InputGroup, {
|
|
2540
|
-
"searchBox": true,
|
|
2541
|
-
"ref": _inputGroupRef
|
|
2542
|
-
}, {
|
|
1778
|
+
}, [vue.createVNode(InputGroup, null, {
|
|
2543
1779
|
"default": function _default() {
|
|
2544
|
-
return [vue.createVNode(
|
|
1780
|
+
return [_this11.renderInputAddonBefore(), vue.createVNode(DropDown.InputWrapper, null, {
|
|
2545
1781
|
"default": function _default() {
|
|
2546
|
-
return [
|
|
2547
|
-
}
|
|
2548
|
-
}), vue.createVNode(DropDown.InputWrapper, null, {
|
|
2549
|
-
"default": function _default() {
|
|
2550
|
-
return [vue.createVNode(Input.TextArea, vue.mergeProps(_transformOn({
|
|
1782
|
+
return [vue.createVNode(Input.Input, vue.mergeProps(_transformOn({
|
|
2551
1783
|
blur: function blur(e) {
|
|
2552
|
-
|
|
1784
|
+
_this11.$emit('blur', e, _this11.triggerQuery);
|
|
2553
1785
|
},
|
|
2554
1786
|
keypress: function keypress(e) {
|
|
2555
|
-
|
|
2556
|
-
|
|
1787
|
+
_this11.$emit('keyPress', e, _this11.triggerQuery);
|
|
1788
|
+
_this11.$emit('key-press', e, _this11.triggerQuery);
|
|
2557
1789
|
},
|
|
2558
|
-
input:
|
|
1790
|
+
input: _this11.onInputChange,
|
|
2559
1791
|
focus: function focus(e) {
|
|
2560
|
-
|
|
1792
|
+
_this11.$emit('focus', e, _this11.triggerQuery);
|
|
2561
1793
|
},
|
|
2562
|
-
keydown:
|
|
1794
|
+
keydown: _this11.handleKeyDown,
|
|
2563
1795
|
keyup: function keyup(e) {
|
|
2564
|
-
|
|
2565
|
-
|
|
1796
|
+
_this11.$emit('keyUp', e, _this11.triggerQuery);
|
|
1797
|
+
_this11.$emit('key-up', e, _this11.triggerQuery);
|
|
2566
1798
|
}
|
|
2567
1799
|
}), {
|
|
2568
|
-
"class": getClassName$1(
|
|
2569
|
-
"placeholder":
|
|
2570
|
-
"autofocus":
|
|
2571
|
-
"value":
|
|
2572
|
-
"iconPosition":
|
|
2573
|
-
"showIcon":
|
|
2574
|
-
"showClear":
|
|
2575
|
-
"ref":
|
|
2576
|
-
"themePreset":
|
|
2577
|
-
}), null)];
|
|
2578
|
-
}
|
|
2579
|
-
}), vue.createVNode(Input.Actions, null, {
|
|
2580
|
-
"default": function _default() {
|
|
2581
|
-
return [_this16.renderRightIcons(), _this16.renderInputAddonAfter(), _this16.renderEnterButtonElement()];
|
|
1800
|
+
"class": getClassName$1(_this11.$props.innerClass, 'input') || '',
|
|
1801
|
+
"placeholder": _this11.$props.placeholder,
|
|
1802
|
+
"autofocus": _this11.$props.autoFocus,
|
|
1803
|
+
"value": _this11.$data.currentValue ? _this11.$data.currentValue : '',
|
|
1804
|
+
"iconPosition": _this11.$props.iconPosition,
|
|
1805
|
+
"showIcon": _this11.$props.showIcon,
|
|
1806
|
+
"showClear": _this11.$props.showClear,
|
|
1807
|
+
"ref": _this11.$props.innerRef,
|
|
1808
|
+
"themePreset": _this11.themePreset
|
|
1809
|
+
}), null), _this11.renderIcons()];
|
|
2582
1810
|
}
|
|
2583
|
-
})];
|
|
1811
|
+
}), _this11.renderInputAddonAfter(), _this11.renderEnterButtonElement()];
|
|
2584
1812
|
}
|
|
2585
1813
|
})])];
|
|
2586
1814
|
}
|
|
@@ -2633,24 +1861,18 @@ var mapStateToProps = function mapStateToProps(state, props) {
|
|
|
2633
1861
|
rawData: state.rawData[props.componentId],
|
|
2634
1862
|
aggregationData: state.compositeAggregations[props.componentId] || [],
|
|
2635
1863
|
themePreset: state.config.themePreset,
|
|
2636
|
-
isLoading: !!state.isLoading[
|
|
1864
|
+
isLoading: !!state.isLoading[props.componentId + "_active"],
|
|
2637
1865
|
error: state.error[props.componentId],
|
|
2638
1866
|
time: state.hits[props.componentId] && state.hits[props.componentId].time || 0,
|
|
2639
1867
|
total: state.hits[props.componentId] && state.hits[props.componentId].total,
|
|
2640
|
-
hidden: state.hits[props.componentId] && state.hits[props.componentId].hidden
|
|
2641
|
-
AIResponse: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response || null,
|
|
2642
|
-
isAIResponseLoading: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].isLoading,
|
|
2643
|
-
AIResponseError: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].error,
|
|
2644
|
-
sessionIdFromStore: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.sessionId || '',
|
|
2645
|
-
isAITyping: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.isTyping || false
|
|
1868
|
+
hidden: state.hits[props.componentId] && state.hits[props.componentId].hidden
|
|
2646
1869
|
};
|
|
2647
1870
|
};
|
|
2648
1871
|
var mapDispatchToProps = {
|
|
2649
1872
|
updateQuery: updateQuery,
|
|
2650
1873
|
setCustomQuery: setCustomQuery,
|
|
2651
1874
|
setDefaultQuery: setDefaultQuery,
|
|
2652
|
-
recordSuggestionClick: recordSuggestionClick
|
|
2653
|
-
recordAISessionUsefulness: analytics.recordAISessionUsefulness
|
|
1875
|
+
recordSuggestionClick: recordSuggestionClick
|
|
2654
1876
|
};
|
|
2655
1877
|
var SBConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps, mapDispatchToProps)(SearchBox), {
|
|
2656
1878
|
componentType: constants.componentTypes.searchBox,
|
|
@@ -2666,608 +1888,9 @@ SBConnected.install = function (Vue) {
|
|
|
2666
1888
|
// Add componentType for SSR
|
|
2667
1889
|
SBConnected.componentType = constants.componentTypes.searchBox;
|
|
2668
1890
|
|
|
2669
|
-
|
|
2670
|
-
|
|
2671
|
-
}
|
|
2672
|
-
var md$1 = new remarkable.Remarkable();
|
|
2673
|
-
md$1.set({
|
|
2674
|
-
html: true,
|
|
2675
|
-
breaks: true,
|
|
2676
|
-
xhtmlOut: true
|
|
2677
|
-
});
|
|
2678
|
-
var _inputWrapperRef = 'inputWrapperRef';
|
|
2679
|
-
var _inputRef = 'inputRef';
|
|
2680
|
-
var _errorContainerRef = 'errorContainerRef';
|
|
2681
|
-
var AIAnswer = vue.defineComponent({
|
|
2682
|
-
name: 'AIAnswer',
|
|
2683
|
-
data: function data() {
|
|
2684
|
-
var props = this.$props;
|
|
2685
|
-
this.__state = {
|
|
2686
|
-
messages: [],
|
|
2687
|
-
inputMessage: '',
|
|
2688
|
-
AISessionId: '',
|
|
2689
|
-
error: null
|
|
2690
|
-
};
|
|
2691
|
-
this.internalComponent = props.componentId + "__internal";
|
|
2692
|
-
return this.__state;
|
|
2693
|
-
},
|
|
2694
|
-
inject: {
|
|
2695
|
-
theme: {
|
|
2696
|
-
from: 'theme_reactivesearch'
|
|
2697
|
-
}
|
|
2698
|
-
},
|
|
2699
|
-
created: function created() {},
|
|
2700
|
-
computed: {
|
|
2701
|
-
hasCustomRenderer: function hasCustomRenderer() {
|
|
2702
|
-
return index.hasCustomRenderer(this);
|
|
2703
|
-
},
|
|
2704
|
-
isLoadingState: function isLoadingState() {
|
|
2705
|
-
return this.isAIResponseLoading || this.isLoading;
|
|
2706
|
-
},
|
|
2707
|
-
shouldShowComponent: function shouldShowComponent() {
|
|
2708
|
-
return this.showComponent;
|
|
2709
|
-
},
|
|
2710
|
-
errorMessageForMissingSessionId: function errorMessageForMissingSessionId() {
|
|
2711
|
-
return "AISessionId for " + this.$props.componentId + " is missing! AIAnswer component requires an AISessionId to function. Try reloading the App.";
|
|
2712
|
-
}
|
|
2713
|
-
},
|
|
2714
|
-
props: {
|
|
2715
|
-
componentId: vueTypes.types.string.isRequired,
|
|
2716
|
-
showVoiceInput: VueTypes.bool.def(false),
|
|
2717
|
-
showFeedback: VueTypes.bool.def(true),
|
|
2718
|
-
showIcon: VueTypes.bool.def(true),
|
|
2719
|
-
onData: vueTypes.types.func,
|
|
2720
|
-
innerRef: VueTypes.string.def('AISearchInputField'),
|
|
2721
|
-
react: vueTypes.types.react,
|
|
2722
|
-
enableAI: VueTypes.bool.def(true),
|
|
2723
|
-
AIConfig: vueTypes.types.AIConfig,
|
|
2724
|
-
iconPosition: vueTypes.types.iconPosition.def('left'),
|
|
2725
|
-
themePreset: vueTypes.types.themePreset,
|
|
2726
|
-
theme: vueTypes.types.style,
|
|
2727
|
-
icon: vueTypes.types.children,
|
|
2728
|
-
iconURL: VueTypes.string.def(''),
|
|
2729
|
-
renderMic: vueTypes.types.func,
|
|
2730
|
-
getMicInstance: vueTypes.types.func,
|
|
2731
|
-
innerClass: vueTypes.types.style,
|
|
2732
|
-
placeholder: VueTypes.string.def('Ask a question'),
|
|
2733
|
-
title: vueTypes.types.title,
|
|
2734
|
-
AIResponse: vueTypes.types.componentObject,
|
|
2735
|
-
isAIResponseLoading: VueTypes.bool.def(false),
|
|
2736
|
-
AIResponseError: vueTypes.types.componentObject,
|
|
2737
|
-
getAIResponse: vueTypes.types.func.isRequired,
|
|
2738
|
-
enterButton: vueTypes.types.bool,
|
|
2739
|
-
renderEnterButton: vueTypes.types.title,
|
|
2740
|
-
showInput: VueTypes.bool.def(true),
|
|
2741
|
-
clearSessionOnDestroy: VueTypes.bool.def(true),
|
|
2742
|
-
rawData: vueTypes.types.rawData,
|
|
2743
|
-
render: vueTypes.types.func,
|
|
2744
|
-
onError: vueTypes.types.func,
|
|
2745
|
-
renderError: vueTypes.types.title,
|
|
2746
|
-
isLoading: vueTypes.types.boolRequired,
|
|
2747
|
-
sessionIdFromStore: VueTypes.string,
|
|
2748
|
-
showComponent: vueTypes.types.boolRequired,
|
|
2749
|
-
componentError: vueTypes.types.componentObject,
|
|
2750
|
-
style: vueTypes.types.style
|
|
2751
|
-
},
|
|
2752
|
-
mounted: function mounted() {},
|
|
2753
|
-
watch: {
|
|
2754
|
-
AIResponse: function AIResponse(newVal) {
|
|
2755
|
-
if (newVal) {
|
|
2756
|
-
this.AISessionId = ((helper.getObjectFromLocalStorage(constants.AI_LOCAL_CACHE_KEY) || {})[this.$props.componentId] || {}).sessionId || null;
|
|
2757
|
-
var messagesHistory = newVal.messages,
|
|
2758
|
-
response = newVal.response;
|
|
2759
|
-
var finalMessages = [];
|
|
2760
|
-
if (response && response.error) {
|
|
2761
|
-
this.error = {
|
|
2762
|
-
message: response.error
|
|
2763
|
-
};
|
|
2764
|
-
}
|
|
2765
|
-
|
|
2766
|
-
// pushing message history so far
|
|
2767
|
-
if (messagesHistory && messagesHistory && Array.isArray(messagesHistory)) {
|
|
2768
|
-
finalMessages.push.apply(finalMessages, messagesHistory.filter(function (msg) {
|
|
2769
|
-
return msg.role !== constants.AI_ROLES.SYSTEM;
|
|
2770
|
-
}));
|
|
2771
|
-
} else if (response && response.answer && response.answer.text) {
|
|
2772
|
-
finalMessages.push({
|
|
2773
|
-
role: constants.AI_ROLES.ASSISTANT,
|
|
2774
|
-
content: response.answer.text
|
|
2775
|
-
});
|
|
2776
|
-
if (!this.AISessionId) this.error = {
|
|
2777
|
-
message: this.errorMessageForMissingSessionId
|
|
2778
|
-
};
|
|
2779
|
-
}
|
|
2780
|
-
this.messages = finalMessages;
|
|
2781
|
-
} else if (!newVal && !this.error) {
|
|
2782
|
-
this.messages = [];
|
|
2783
|
-
}
|
|
2784
|
-
},
|
|
2785
|
-
rawData: function rawData(newVal) {
|
|
2786
|
-
this.$emit('on-data', {
|
|
2787
|
-
data: this.messages,
|
|
2788
|
-
rawData: newVal,
|
|
2789
|
-
loading: this.$props.isAIResponseLoading || this.$props.isLoading,
|
|
2790
|
-
error: this.$props.AIResponseError
|
|
2791
|
-
});
|
|
2792
|
-
},
|
|
2793
|
-
isAIResponseLoading: function isAIResponseLoading(newVal) {
|
|
2794
|
-
this.$emit('on-data', {
|
|
2795
|
-
data: this.messages,
|
|
2796
|
-
rawData: this.$props.rawData,
|
|
2797
|
-
loading: newVal || this.isLoading,
|
|
2798
|
-
error: this.$props.AIResponseError
|
|
2799
|
-
});
|
|
2800
|
-
},
|
|
2801
|
-
isLoading: function isLoading(newVal) {
|
|
2802
|
-
this.$emit('on-data', {
|
|
2803
|
-
data: this.messages,
|
|
2804
|
-
rawData: this.$props.rawData,
|
|
2805
|
-
loading: newVal || this.isAIResponseLoading,
|
|
2806
|
-
error: this.$props.AIResponseError
|
|
2807
|
-
});
|
|
2808
|
-
},
|
|
2809
|
-
sessionIdFromStore: function sessionIdFromStore(newVal) {
|
|
2810
|
-
if (newVal) {
|
|
2811
|
-
this.sessionId = newVal;
|
|
2812
|
-
}
|
|
2813
|
-
},
|
|
2814
|
-
AIResponseError: function AIResponseError(newVal) {
|
|
2815
|
-
this.error = newVal;
|
|
2816
|
-
this.AISessionId = ((helper.getObjectFromLocalStorage(constants.AI_LOCAL_CACHE_KEY) || {})[this.$props.componentId] || {}).sessionId || null;
|
|
2817
|
-
if (this.error && !this.AISessionId) {
|
|
2818
|
-
var errorMessage = this.errorMessageForMissingSessionId;
|
|
2819
|
-
this.error = {
|
|
2820
|
-
message: errorMessage
|
|
2821
|
-
};
|
|
2822
|
-
console.error(errorMessage);
|
|
2823
|
-
}
|
|
2824
|
-
this.$emit('on-data', {
|
|
2825
|
-
data: this.messages,
|
|
2826
|
-
rawData: this.$props.rawData,
|
|
2827
|
-
loading: this.isAIResponseLoading || this.isLoading,
|
|
2828
|
-
error: newVal
|
|
2829
|
-
});
|
|
2830
|
-
},
|
|
2831
|
-
messages: function messages() {
|
|
2832
|
-
this.scrollToBottom();
|
|
2833
|
-
},
|
|
2834
|
-
componentError: function componentError(newVal) {
|
|
2835
|
-
var _this = this;
|
|
2836
|
-
if (newVal && newVal._bodyBlob) {
|
|
2837
|
-
this.AISessionId = ((helper.getObjectFromLocalStorage(constants.AI_LOCAL_CACHE_KEY) || {})[this.$props.componentId] || {}).sessionId || null;
|
|
2838
|
-
if (!this.AISessionId) {
|
|
2839
|
-
this.generateNewSessionId();
|
|
2840
|
-
}
|
|
2841
|
-
newVal._bodyBlob.text().then(function (textData) {
|
|
2842
|
-
try {
|
|
2843
|
-
var parsedErrorRes = JSON.parse(textData);
|
|
2844
|
-
if (parsedErrorRes.error) {
|
|
2845
|
-
_this.error = parsedErrorRes.error;
|
|
2846
|
-
_this.$emit('on-data', {
|
|
2847
|
-
data: _this.messages,
|
|
2848
|
-
rawData: _this.$props.rawData,
|
|
2849
|
-
loading: _this.$props.isAIResponseLoading || _this.$props.isLoading,
|
|
2850
|
-
error: parsedErrorRes.error
|
|
2851
|
-
});
|
|
2852
|
-
}
|
|
2853
|
-
} catch (error) {
|
|
2854
|
-
console.error('Error parsing component error JSON:', error);
|
|
2855
|
-
}
|
|
2856
|
-
})["catch"](function (error) {
|
|
2857
|
-
console.error('Error reading component error text data:', error);
|
|
2858
|
-
});
|
|
2859
|
-
}
|
|
2860
|
-
}
|
|
2861
|
-
},
|
|
2862
|
-
methods: {
|
|
2863
|
-
generateNewSessionId: function generateNewSessionId() {
|
|
2864
|
-
var _this2 = this;
|
|
2865
|
-
var newSessionPromise = this.createAISession();
|
|
2866
|
-
newSessionPromise.then(function (res) {
|
|
2867
|
-
_this2.AISessionId = res.AIsessionId;
|
|
2868
|
-
})["catch"](function (e) {
|
|
2869
|
-
console.error(e);
|
|
2870
|
-
});
|
|
2871
|
-
},
|
|
2872
|
-
scrollToBottom: function scrollToBottom() {
|
|
2873
|
-
var _this3 = this;
|
|
2874
|
-
this.$nextTick(function () {
|
|
2875
|
-
var _this3$$refs;
|
|
2876
|
-
var messageContainer = (_this3$$refs = _this3.$refs) == null ? void 0 : _this3$$refs[_this3.$props.innerRef];
|
|
2877
|
-
if (messageContainer && messageContainer.$el) {
|
|
2878
|
-
messageContainer.$el.scrollTo({
|
|
2879
|
-
top: messageContainer.$el.scrollHeight,
|
|
2880
|
-
behavior: 'smooth'
|
|
2881
|
-
});
|
|
2882
|
-
}
|
|
2883
|
-
});
|
|
2884
|
-
},
|
|
2885
|
-
handleMessageInputChange: function handleMessageInputChange(e) {
|
|
2886
|
-
this.inputMessage = e.target.value;
|
|
2887
|
-
this.handleTextAreaHeightChange();
|
|
2888
|
-
},
|
|
2889
|
-
handleSendMessage: function handleSendMessage(e, isRetry, text) {
|
|
2890
|
-
if (isRetry === void 0) {
|
|
2891
|
-
isRetry = false;
|
|
2892
|
-
}
|
|
2893
|
-
if (text === void 0) {
|
|
2894
|
-
text = this.inputMessage;
|
|
2895
|
-
}
|
|
2896
|
-
if (typeof e === 'object' && e !== null) e.preventDefault();
|
|
2897
|
-
if (text.trim()) {
|
|
2898
|
-
if (this.isLoadingState) {
|
|
2899
|
-
return;
|
|
2900
|
-
}
|
|
2901
|
-
if (this.AISessionId) {
|
|
2902
|
-
if (!isRetry) this.messages = [].concat(this.messages, [{
|
|
2903
|
-
content: text,
|
|
2904
|
-
role: constants.AI_ROLES.USER
|
|
2905
|
-
}]);
|
|
2906
|
-
this.getAIResponse(this.AISessionId, this.componentId, text);
|
|
2907
|
-
} else {
|
|
2908
|
-
console.error(this.errorMessageForMissingSessionId);
|
|
2909
|
-
this.error = {
|
|
2910
|
-
message: "AISessionId for " + this.$props.componentId + " is missing! AIAnswer component requires an AISessionId to function. Trying reloading the App."
|
|
2911
|
-
};
|
|
2912
|
-
}
|
|
2913
|
-
this.inputMessage = '';
|
|
2914
|
-
}
|
|
2915
|
-
},
|
|
2916
|
-
handleRetryRequest: function handleRetryRequest() {
|
|
2917
|
-
if (this.messages && !this.isLoadingState) {
|
|
2918
|
-
var _this$messages;
|
|
2919
|
-
var lastUserRequestMessage = (_this$messages = this.messages[this.messages.length - 1]) == null ? void 0 : _this$messages.content;
|
|
2920
|
-
if (this.AISessionId) {
|
|
2921
|
-
this.getAIResponse(this.AISessionId, this.componentId, lastUserRequestMessage);
|
|
2922
|
-
this.inputMessage = '';
|
|
2923
|
-
} else {
|
|
2924
|
-
console.error("AISessionId for " + this.componentId + " is missing! AIAnswer component requires an AISessionId to function. Try reloading the App.");
|
|
2925
|
-
}
|
|
2926
|
-
}
|
|
2927
|
-
},
|
|
2928
|
-
renderErrorComponent: function renderErrorComponent() {
|
|
2929
|
-
var renderError = this.$slots.renderError || this.$props.renderError;
|
|
2930
|
-
if (this.error && !this.isLoadingState) {
|
|
2931
|
-
var _this$error, _this$error2;
|
|
2932
|
-
if (renderError) {
|
|
2933
|
-
return vue.createVNode("div", {
|
|
2934
|
-
"ref": _errorContainerRef,
|
|
2935
|
-
"class": "--ai-answer-error-container " + (helper.getClassName(this.$props.innerClass, 'ai-error') || '')
|
|
2936
|
-
}, [index.isFunction(renderError) ? renderError(this.error, this.handleRetryRequest) : renderError]);
|
|
2937
|
-
}
|
|
2938
|
-
return vue.createVNode("div", {
|
|
2939
|
-
"ref": _errorContainerRef,
|
|
2940
|
-
"class": "--ai-answer-error-container " + (helper.getClassName(this.$props.innerClass, 'ai-error') || '')
|
|
2941
|
-
}, [vue.createVNode("div", {
|
|
2942
|
-
"class": "--default-error-element"
|
|
2943
|
-
}, [vue.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 && vue.createVNode(Button.Button, {
|
|
2944
|
-
"primary": true,
|
|
2945
|
-
"onClick": this.handleRetryRequest
|
|
2946
|
-
}, {
|
|
2947
|
-
"default": function _default() {
|
|
2948
|
-
return [vue.createTextVNode("Try again")];
|
|
2949
|
-
}
|
|
2950
|
-
})])]);
|
|
2951
|
-
}
|
|
2952
|
-
return null;
|
|
2953
|
-
},
|
|
2954
|
-
handleKeyPress: function handleKeyPress(e) {
|
|
2955
|
-
window.console.log('e', e);
|
|
2956
|
-
if (e.key === 'Enter') {
|
|
2957
|
-
this.handleSendMessage(e);
|
|
2958
|
-
this.inputMessage = '';
|
|
2959
|
-
}
|
|
2960
|
-
},
|
|
2961
|
-
renderIcon: function renderIcon() {
|
|
2962
|
-
if (this.$props.showIcon) {
|
|
2963
|
-
if (this.$props.icon) {
|
|
2964
|
-
return this.$props.icon;
|
|
2965
|
-
}
|
|
2966
|
-
if (this.$slots.icon) {
|
|
2967
|
-
return this.$slots.icon();
|
|
2968
|
-
}
|
|
2969
|
-
if (this.$props.iconURL) {
|
|
2970
|
-
return vue.createVNode("img", {
|
|
2971
|
-
"style": {
|
|
2972
|
-
maxHeight: '25px'
|
|
2973
|
-
},
|
|
2974
|
-
"src": this.$props.iconURL,
|
|
2975
|
-
"alt": "search-icon"
|
|
2976
|
-
}, null);
|
|
2977
|
-
}
|
|
2978
|
-
return vue.createVNode(SearchSvg, null, null);
|
|
2979
|
-
}
|
|
2980
|
-
return null;
|
|
2981
|
-
},
|
|
2982
|
-
shouldMicRender: function shouldMicRender(showVoiceSearch) {
|
|
2983
|
-
// checks for SSR
|
|
2984
|
-
if (typeof window === 'undefined') return false;
|
|
2985
|
-
return showVoiceSearch && (window.webkitSpeechRecognition || window.SpeechRecognition);
|
|
2986
|
-
},
|
|
2987
|
-
handleVoiceResults: function handleVoiceResults(_ref) {
|
|
2988
|
-
var results = _ref.results;
|
|
2989
|
-
if (results && results[0] && results[0].isFinal && results[0][0] && results[0][0].transcript && results[0][0].transcript.trim()) {
|
|
2990
|
-
this.handleSendMessage(null, false, results[0][0].transcript.trim());
|
|
2991
|
-
}
|
|
2992
|
-
},
|
|
2993
|
-
renderIcons: function renderIcons() {
|
|
2994
|
-
var _this4 = this;
|
|
2995
|
-
var _slot, _slot2;
|
|
2996
|
-
var _this$$props = this.$props,
|
|
2997
|
-
getMicInstance = _this$$props.getMicInstance,
|
|
2998
|
-
showVoiceInput = _this$$props.showVoiceInput,
|
|
2999
|
-
iconPosition = _this$$props.iconPosition,
|
|
3000
|
-
innerClass = _this$$props.innerClass;
|
|
3001
|
-
var renderMic = this.$slots.renderMic || this.$props.renderMic;
|
|
3002
|
-
return vue.createVNode("div", null, [vue.createVNode(DropDown.IconGroup, {
|
|
3003
|
-
"enableAI": true,
|
|
3004
|
-
"groupPosition": "right",
|
|
3005
|
-
"positionType": "absolute"
|
|
3006
|
-
}, {
|
|
3007
|
-
"default": function _default() {
|
|
3008
|
-
return [!_this4.isLoadingState && _this4.AISessionId && _this4.shouldMicRender(showVoiceInput) && vue.createVNode(Mic, {
|
|
3009
|
-
"getInstance": getMicInstance,
|
|
3010
|
-
"render": renderMic,
|
|
3011
|
-
"handleResult": _this4.handleVoiceResults,
|
|
3012
|
-
"class": helper.getClassName(innerClass, 'ai-search-mic') || null
|
|
3013
|
-
}, null), iconPosition === 'right' && vue.createVNode(DropDown.IconWrapper, null, _isSlot$1(_slot = _this4.renderIcon()) ? _slot : {
|
|
3014
|
-
"default": function _default() {
|
|
3015
|
-
return [_slot];
|
|
3016
|
-
}
|
|
3017
|
-
})];
|
|
3018
|
-
}
|
|
3019
|
-
}), vue.createVNode(DropDown.IconGroup, {
|
|
3020
|
-
"enableAI": true,
|
|
3021
|
-
"groupPosition": "left",
|
|
3022
|
-
"positionType": "absolute"
|
|
3023
|
-
}, {
|
|
3024
|
-
"default": function _default() {
|
|
3025
|
-
return [iconPosition === 'left' && vue.createVNode(DropDown.IconWrapper, null, _isSlot$1(_slot2 = _this4.renderIcon()) ? _slot2 : {
|
|
3026
|
-
"default": function _default() {
|
|
3027
|
-
return [_slot2];
|
|
3028
|
-
}
|
|
3029
|
-
})];
|
|
3030
|
-
}
|
|
3031
|
-
})]);
|
|
3032
|
-
},
|
|
3033
|
-
enterButtonOnClick: function enterButtonOnClick(e) {
|
|
3034
|
-
this.handleSendMessage(e);
|
|
3035
|
-
},
|
|
3036
|
-
renderEnterButtonElement: function renderEnterButtonElement() {
|
|
3037
|
-
var _this5 = this;
|
|
3038
|
-
var _this$$props2 = this.$props,
|
|
3039
|
-
enterButton = _this$$props2.enterButton,
|
|
3040
|
-
innerClass = _this$$props2.innerClass;
|
|
3041
|
-
var renderEnterButton = this.$slots.renderEnterButton;
|
|
3042
|
-
if (enterButton) {
|
|
3043
|
-
var getEnterButtonMarkup = function getEnterButtonMarkup() {
|
|
3044
|
-
if (renderEnterButton) {
|
|
3045
|
-
return renderEnterButton(_this5.enterButtonOnClick);
|
|
3046
|
-
}
|
|
3047
|
-
return vue.createVNode(SendButton, {
|
|
3048
|
-
"primary": true,
|
|
3049
|
-
"type": "submit",
|
|
3050
|
-
"tabIndex": 0,
|
|
3051
|
-
"onClick": _this5.handleSendMessage,
|
|
3052
|
-
"onKeyPress": _this5.handleKeyPress,
|
|
3053
|
-
"class": "ask-btn " + helper.getClassName(innerClass, 'ai-enter-button'),
|
|
3054
|
-
"disabled": _this5.isLoadingState || !_this5.AISessionId
|
|
3055
|
-
}, {
|
|
3056
|
-
"default": function _default() {
|
|
3057
|
-
return [vue.createTextVNode("Send")];
|
|
3058
|
-
}
|
|
3059
|
-
});
|
|
3060
|
-
};
|
|
3061
|
-
return vue.createVNode("div", {
|
|
3062
|
-
"class": "ai-enter-button-wrapper"
|
|
3063
|
-
}, [getEnterButtonMarkup()]);
|
|
3064
|
-
}
|
|
3065
|
-
return null;
|
|
3066
|
-
},
|
|
3067
|
-
getComponent: function getComponent() {
|
|
3068
|
-
var data = {
|
|
3069
|
-
error: this.AIResponseError,
|
|
3070
|
-
loading: this.isAIResponseLoading,
|
|
3071
|
-
data: this.messages,
|
|
3072
|
-
rawData: this.rawData
|
|
3073
|
-
};
|
|
3074
|
-
return index.getComponent(data, this);
|
|
3075
|
-
},
|
|
3076
|
-
handleTextAreaHeightChange: function handleTextAreaHeightChange() {
|
|
3077
|
-
var _this$$refs, _this$$refs$_inputRef, _this$$refs2, _this$$refs2$_inputWr, _this$$refs3;
|
|
3078
|
-
var textArea = (_this$$refs = this.$refs) == null ? void 0 : (_this$$refs$_inputRef = _this$$refs[_inputRef]) == null ? void 0 : _this$$refs$_inputRef.$el;
|
|
3079
|
-
var inputWrapper = (_this$$refs2 = this.$refs) == null ? void 0 : (_this$$refs2$_inputWr = _this$$refs2[_inputWrapperRef]) == null ? void 0 : _this$$refs2$_inputWr.$el;
|
|
3080
|
-
var errorContainer = (_this$$refs3 = this.$refs) == null ? void 0 : _this$$refs3[_errorContainerRef];
|
|
3081
|
-
if (textArea) {
|
|
3082
|
-
textArea.style.height = '42px';
|
|
3083
|
-
var lineHeight = parseInt(getComputedStyle(textArea).lineHeight, 10);
|
|
3084
|
-
var maxHeight = lineHeight * 11; // max height for 10 lines
|
|
3085
|
-
var height = Math.min(textArea.scrollHeight, maxHeight);
|
|
3086
|
-
textArea.style.height = height + "px";
|
|
3087
|
-
textArea.style.overflowY = height === maxHeight ? 'auto' : 'hidden';
|
|
3088
|
-
// wrapper around input/ textarea
|
|
3089
|
-
inputWrapper.style.height = height + "px";
|
|
3090
|
-
// adjust error-container
|
|
3091
|
-
|
|
3092
|
-
if (errorContainer) {
|
|
3093
|
-
errorContainer.style.bottom = height + "px";
|
|
3094
|
-
}
|
|
3095
|
-
this.$forceUpdate();
|
|
3096
|
-
}
|
|
3097
|
-
}
|
|
3098
|
-
},
|
|
3099
|
-
beforeUnmount: function beforeUnmount() {
|
|
3100
|
-
if (this.$props.clearSessionOnDestroy) {
|
|
3101
|
-
// cleanup logic
|
|
3102
|
-
// final Object to store in local storage cache
|
|
3103
|
-
var finalCacheObj = helper.getObjectFromLocalStorage(constants.AI_LOCAL_CACHE_KEY) || {};
|
|
3104
|
-
// delete current component's cache
|
|
3105
|
-
delete finalCacheObj[this.$props.componentId];
|
|
3106
|
-
// update local cache
|
|
3107
|
-
helper.setObjectInLocalStorage(constants.AI_LOCAL_CACHE_KEY, finalCacheObj);
|
|
3108
|
-
}
|
|
3109
|
-
},
|
|
3110
|
-
render: function render() {
|
|
3111
|
-
var _slot3;
|
|
3112
|
-
var _this6 = this;
|
|
3113
|
-
var props = this.$props;
|
|
3114
|
-
if (!this.shouldShowComponent) {
|
|
3115
|
-
return null;
|
|
3116
|
-
}
|
|
3117
|
-
return vue.createVNode(Chatbox, {
|
|
3118
|
-
"style": props.style || {}
|
|
3119
|
-
}, {
|
|
3120
|
-
"default": function _default() {
|
|
3121
|
-
return [_this6.$props.title && vue.createVNode(Title.Title, {
|
|
3122
|
-
"class": helper.getClassName(_this6.$props.innerClass, 'title') || ''
|
|
3123
|
-
}, {
|
|
3124
|
-
"default": function _default() {
|
|
3125
|
-
return [_this6.$props.title];
|
|
3126
|
-
}
|
|
3127
|
-
}), vue.createVNode(ChatContainer, {
|
|
3128
|
-
"class": "--ai-chat-container",
|
|
3129
|
-
"theme": props.theme,
|
|
3130
|
-
"showInput": props.showInput
|
|
3131
|
-
}, {
|
|
3132
|
-
"default": function _default() {
|
|
3133
|
-
return [_this6.hasCustomRenderer && vue.createVNode(MessagesContainer, {
|
|
3134
|
-
"themePreset": _this6.themePreset,
|
|
3135
|
-
"theme": props.theme,
|
|
3136
|
-
"ref": _this6.$props.innerRef,
|
|
3137
|
-
"class": "--ai-message-container " + (helper.getClassName(props.innerClass, 'ai-message-container') || '')
|
|
3138
|
-
}, _isSlot$1(_slot3 = _this6.getComponent()) ? _slot3 : {
|
|
3139
|
-
"default": function _default() {
|
|
3140
|
-
return [_slot3];
|
|
3141
|
-
}
|
|
3142
|
-
}), !_this6.hasCustomRenderer && vue.createVNode(MessagesContainer, {
|
|
3143
|
-
"themePreset": _this6.themePreset,
|
|
3144
|
-
"theme": props.theme,
|
|
3145
|
-
"ref": _this6.$props.innerRef,
|
|
3146
|
-
"class": "--ai-message-container " + (helper.getClassName(props.innerClass, 'ai-message-container') || '')
|
|
3147
|
-
}, {
|
|
3148
|
-
"default": function _default() {
|
|
3149
|
-
return [_this6.messages.map(function (message, index) {
|
|
3150
|
-
return vue.createVNode(Message, {
|
|
3151
|
-
"key": index,
|
|
3152
|
-
"isSender": message.role === constants.AI_ROLES.USER,
|
|
3153
|
-
"innerHTML": md$1.render(message.content),
|
|
3154
|
-
"themePreset": _this6.themePreset,
|
|
3155
|
-
"theme": props.theme,
|
|
3156
|
-
"class": "--ai-answer-message " + (helper.getClassName(props.innerClass, 'ai-message') || '')
|
|
3157
|
-
}, null);
|
|
3158
|
-
}), _this6.isLoadingState && vue.createVNode(Message, {
|
|
3159
|
-
"themePreset": _this6.themePreset,
|
|
3160
|
-
"theme": props.theme,
|
|
3161
|
-
"isSender": false,
|
|
3162
|
-
"class": "--ai-answer-message " + (helper.getClassName(props.innerClass, 'ai-message') || null)
|
|
3163
|
-
}, {
|
|
3164
|
-
"default": function _default() {
|
|
3165
|
-
return [vue.createVNode(TypingIndicator, null, {
|
|
3166
|
-
"default": function _default() {
|
|
3167
|
-
return [vue.createVNode(TypingDot, {
|
|
3168
|
-
"themePreset": _this6.themePreset
|
|
3169
|
-
}, null), vue.createVNode(TypingDot, {
|
|
3170
|
-
"themePreset": _this6.themePreset
|
|
3171
|
-
}, null), vue.createVNode(TypingDot, {
|
|
3172
|
-
"themePreset": _this6.themePreset
|
|
3173
|
-
}, null)];
|
|
3174
|
-
}
|
|
3175
|
-
})];
|
|
3176
|
-
}
|
|
3177
|
-
})];
|
|
3178
|
-
}
|
|
3179
|
-
}), _this6.renderErrorComponent(), ' ', props.showFeedback && vue.createVNode("div", {
|
|
3180
|
-
"class": "--ai-answer-feedback-container " + (helper.getClassName(props.innerClass, 'ai-feedback') || '')
|
|
3181
|
-
}, [vue.createVNode(AIFeedback, {
|
|
3182
|
-
"hideUI": _this6.isLoadingState || !_this6.sessionId,
|
|
3183
|
-
"key": _this6.sessionId,
|
|
3184
|
-
"onFeedbackSubmit": function onFeedbackSubmit(useful, reason) {
|
|
3185
|
-
_this6.trackUsefullness(_this6.sessionId, {
|
|
3186
|
-
useful: useful,
|
|
3187
|
-
reason: reason
|
|
3188
|
-
});
|
|
3189
|
-
}
|
|
3190
|
-
}, null)]), props.showInput && vue.createVNode(MessageInputContainer, {
|
|
3191
|
-
"class": "--ai-input-container",
|
|
3192
|
-
"onSubmit": _this6.handleSendMessage
|
|
3193
|
-
}, {
|
|
3194
|
-
"default": function _default() {
|
|
3195
|
-
return [vue.createVNode(InputGroup, {
|
|
3196
|
-
"enableAI": true,
|
|
3197
|
-
"isOpen": false
|
|
3198
|
-
}, {
|
|
3199
|
-
"default": function _default() {
|
|
3200
|
-
return [vue.createVNode(DropDown.InputWrapper, {
|
|
3201
|
-
"ref": _inputWrapperRef
|
|
3202
|
-
}, {
|
|
3203
|
-
"default": function _default() {
|
|
3204
|
-
return [vue.createVNode(MessageInput, {
|
|
3205
|
-
"ref": _inputRef,
|
|
3206
|
-
"placeholder": props.placeholder,
|
|
3207
|
-
"enterButton": props.enterButton,
|
|
3208
|
-
"value": _this6.inputMessage,
|
|
3209
|
-
"onInput": _this6.handleMessageInputChange,
|
|
3210
|
-
"id": props.componentId + "-ai-input",
|
|
3211
|
-
"showIcon": props.showIcon,
|
|
3212
|
-
"iconPosition": props.iconPosition,
|
|
3213
|
-
"themePreset": _this6.themePreset,
|
|
3214
|
-
"disabled": _this6.isLoadingState || !_this6.AISessionId,
|
|
3215
|
-
"class": helper.getClassName(props.innerClass, 'ai-input') || null
|
|
3216
|
-
}, null), ' ', _this6.renderIcons()];
|
|
3217
|
-
}
|
|
3218
|
-
})];
|
|
3219
|
-
}
|
|
3220
|
-
}), _this6.renderEnterButtonElement()];
|
|
3221
|
-
}
|
|
3222
|
-
}), ' '];
|
|
3223
|
-
}
|
|
3224
|
-
})];
|
|
3225
|
-
}
|
|
3226
|
-
});
|
|
3227
|
-
}
|
|
3228
|
-
});
|
|
3229
|
-
AIAnswer.hasInternalComponent = function () {
|
|
3230
|
-
return true;
|
|
3231
|
-
};
|
|
3232
|
-
var mapStateToProps$1 = function mapStateToProps(state, props) {
|
|
3233
|
-
var dependencyComponent = Object.values(props.react)[0];
|
|
3234
|
-
if (Array.isArray(dependencyComponent)) {
|
|
3235
|
-
// eslint-disable-next-line prefer-destructuring
|
|
3236
|
-
dependencyComponent = dependencyComponent[0];
|
|
3237
|
-
}
|
|
3238
|
-
var showComponent = state.selectedValues[dependencyComponent] && state.selectedValues[dependencyComponent].value;
|
|
3239
|
-
return {
|
|
3240
|
-
showComponent: showComponent,
|
|
3241
|
-
AIResponse: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response,
|
|
3242
|
-
isAIResponseLoading: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].isLoading,
|
|
3243
|
-
AIResponseError: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].error,
|
|
3244
|
-
rawData: state.rawData[props.componentId],
|
|
3245
|
-
themePreset: state.config.themePreset,
|
|
3246
|
-
isLoading: state.isLoading[props.componentId] || false,
|
|
3247
|
-
sessionIdFromStore: state.AIResponses[props.componentId] && state.AIResponses[props.componentId].response && state.AIResponses[props.componentId].response.sessionId || '',
|
|
3248
|
-
componentError: state.error[props.componentId]
|
|
3249
|
-
};
|
|
3250
|
-
};
|
|
3251
|
-
var mapDispatchToProps$1 = {
|
|
3252
|
-
getAIResponse: query.fetchAIResponse,
|
|
3253
|
-
trackUsefullness: analytics.recordAISessionUsefulness,
|
|
3254
|
-
createAISession: query.createAISession
|
|
3255
|
-
};
|
|
3256
|
-
var AIConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps$1, mapDispatchToProps$1)(AIAnswer), {
|
|
3257
|
-
componentType: constants.componentTypes.AIAnswer,
|
|
3258
|
-
internalComponent: true
|
|
3259
|
-
}));
|
|
3260
|
-
AIConnected.name = AIAnswer.name;
|
|
3261
|
-
AIConnected.hasInternalComponent = AIAnswer.hasInternalComponent;
|
|
3262
|
-
AIConnected.install = function (Vue) {
|
|
3263
|
-
Vue.component(AIConnected.name, AIConnected);
|
|
3264
|
-
};
|
|
3265
|
-
// Add componentType for SSR
|
|
3266
|
-
AIConnected.componentType = constants.componentTypes.AIAnswer;
|
|
3267
|
-
|
|
3268
|
-
var _templateObject$9, _templateObject2$4;
|
|
3269
|
-
var HierarchicalMenuList = vueEmotion.styled('ul')(_templateObject$9 || (_templateObject$9 = _rollupPluginBabelHelpers._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"])));
|
|
3270
|
-
var HierarchicalMenuListItem = vueEmotion.styled('li')(_templateObject2$4 || (_templateObject2$4 = _rollupPluginBabelHelpers._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) {
|
|
1891
|
+
var _templateObject$5, _templateObject2$1;
|
|
1892
|
+
var HierarchicalMenuList = vueEmotion.styled('ul')(_templateObject$5 || (_templateObject$5 = _rollupPluginBabelHelpers._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"])));
|
|
1893
|
+
var HierarchicalMenuListItem = vueEmotion.styled('li')(_templateObject2$1 || (_templateObject2$1 = _rollupPluginBabelHelpers._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) {
|
|
3271
1894
|
return !props.showLine && "\n\t\t\t\t\tdisplay: none;\n\t\t\t\t";
|
|
3272
1895
|
});
|
|
3273
1896
|
|
|
@@ -3480,7 +2103,7 @@ var HierarchicalMenuListItemComponent = {
|
|
|
3480
2103
|
}
|
|
3481
2104
|
};
|
|
3482
2105
|
|
|
3483
|
-
function _isSlot$
|
|
2106
|
+
function _isSlot$1(s) {
|
|
3484
2107
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
3485
2108
|
}
|
|
3486
2109
|
var HierarchicalMenuComponent = {
|
|
@@ -3505,7 +2128,7 @@ var HierarchicalMenuComponent = {
|
|
|
3505
2128
|
return vue.createVNode(HierarchicalMenuList, {
|
|
3506
2129
|
"class": "" + (isExpanded ? '--open' : ''),
|
|
3507
2130
|
"isSelected": isExpanded
|
|
3508
|
-
}, _isSlot$
|
|
2131
|
+
}, _isSlot$1(_slot = listArray.map(function (listItem) {
|
|
3509
2132
|
return vue.createVNode(HierarchicalMenuListItemComponent, vue.mergeProps({
|
|
3510
2133
|
"key": parentPath + "__" + JSON.stringify(listItem),
|
|
3511
2134
|
"parentPath": parentPath,
|
|
@@ -3519,7 +2142,7 @@ var HierarchicalMenuComponent = {
|
|
|
3519
2142
|
}
|
|
3520
2143
|
};
|
|
3521
2144
|
|
|
3522
|
-
function _isSlot$
|
|
2145
|
+
function _isSlot$2(s) {
|
|
3523
2146
|
return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
|
|
3524
2147
|
}
|
|
3525
2148
|
var updateQueryAction = reactivecore.Actions.updateQuery,
|
|
@@ -3969,7 +2592,7 @@ var TreeList = {
|
|
|
3969
2592
|
"default": function _default() {
|
|
3970
2593
|
return [props.title && vue.createVNode(Title.Title, {
|
|
3971
2594
|
"class": helper.getClassName(innerClass, 'title') || null
|
|
3972
|
-
}, _isSlot$
|
|
2595
|
+
}, _isSlot$2(title) ? title : {
|
|
3973
2596
|
"default": function _default() {
|
|
3974
2597
|
return [title];
|
|
3975
2598
|
}
|
|
@@ -3998,7 +2621,7 @@ var TreeList = {
|
|
|
3998
2621
|
});
|
|
3999
2622
|
}
|
|
4000
2623
|
};
|
|
4001
|
-
var mapStateToProps$
|
|
2624
|
+
var mapStateToProps$1 = function mapStateToProps(state, props) {
|
|
4002
2625
|
return {
|
|
4003
2626
|
selectedValue: state.selectedValues[props.componentId] && state.selectedValues[props.componentId].value || null,
|
|
4004
2627
|
rawData: state.rawData[props.componentId] || {},
|
|
@@ -4016,7 +2639,7 @@ var mapDispatchtoProps = {
|
|
|
4016
2639
|
TreeList.hasInternalComponent = function () {
|
|
4017
2640
|
return true;
|
|
4018
2641
|
};
|
|
4019
|
-
var TreeListConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps$
|
|
2642
|
+
var TreeListConnected = PreferencesConsumer.PreferencesConsumer(ComponentWrapper.ComponentWrapper(index.connect(mapStateToProps$1, mapDispatchtoProps)(TreeList), {
|
|
4020
2643
|
componentType: constants.componentTypes.treeList,
|
|
4021
2644
|
internalComponent: TreeList.hasInternalComponent()
|
|
4022
2645
|
}));
|
|
@@ -4084,7 +2707,7 @@ RcConnected.install = function (Vue) {
|
|
|
4084
2707
|
Vue.component(RcConnected.name, RcConnected);
|
|
4085
2708
|
};
|
|
4086
2709
|
|
|
4087
|
-
var components = [ReactiveList.default, ResultCard.default, ResultList.default, ReactiveBase.default, SBConnected, SingleList.default, MultiList.default, SingleRange.default, MultiRange.default, RangeSlider.default, DynamicRangeSlider.default, ReactiveComponent.default, RcConnected, SelectedFilters.default, ToggleButton.default, SingleDropdownList.default, MultiDropdownList.default, StateProvider.default, RangeInput.default, TreeListConnected
|
|
2710
|
+
var components = [ReactiveList.default, ResultCard.default, ResultList.default, ReactiveBase.default, SBConnected, SingleList.default, MultiList.default, SingleRange.default, MultiRange.default, RangeSlider.default, DynamicRangeSlider.default, ReactiveComponent.default, RcConnected, SelectedFilters.default, ToggleButton.default, SingleDropdownList.default, MultiDropdownList.default, StateProvider.default, RangeInput.default, TreeListConnected];
|
|
4088
2711
|
function install (Vue) {
|
|
4089
2712
|
components.map(function (component) {
|
|
4090
2713
|
Vue.use(component);
|
|
@@ -4092,7 +2715,6 @@ function install (Vue) {
|
|
|
4092
2715
|
});
|
|
4093
2716
|
}
|
|
4094
2717
|
|
|
4095
|
-
exports.AIAnswer = AIConnected;
|
|
4096
2718
|
exports.ReactiveComponentPrivate = RcConnected;
|
|
4097
2719
|
exports.SearchBox = SBConnected;
|
|
4098
2720
|
exports.TreeList = TreeListConnected;
|