@mongodb-js/compass-components 1.14.0 → 1.16.0

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.
Files changed (63) hide show
  1. package/lib/components/combobox/Combobox.d.ts +0 -1
  2. package/lib/components/combobox/Combobox.d.ts.map +1 -1
  3. package/lib/components/combobox/ComboboxGroup.d.ts +0 -1
  4. package/lib/components/combobox/ComboboxGroup.d.ts.map +1 -1
  5. package/lib/components/combobox/utils/wrapJSX.d.ts +0 -1
  6. package/lib/components/combobox/utils/wrapJSX.d.ts.map +1 -1
  7. package/lib/components/combobox-with-custom-option.d.ts +0 -1
  8. package/lib/components/combobox-with-custom-option.d.ts.map +1 -1
  9. package/lib/components/feedback-popover.d.ts.map +1 -1
  10. package/lib/components/feedback-popover.js +2 -0
  11. package/lib/components/feedback-popover.js.map +1 -1
  12. package/lib/components/index-icon.d.ts +0 -1
  13. package/lib/components/index-icon.d.ts.map +1 -1
  14. package/lib/components/inline-info-link.d.ts +0 -1
  15. package/lib/components/inline-info-link.d.ts.map +1 -1
  16. package/lib/components/leafygreen.d.ts +2 -1
  17. package/lib/components/leafygreen.d.ts.map +1 -1
  18. package/lib/components/leafygreen.js +3 -1
  19. package/lib/components/leafygreen.js.map +1 -1
  20. package/lib/components/modals/modal-footer-button.d.ts +0 -1
  21. package/lib/components/modals/modal-footer-button.d.ts.map +1 -1
  22. package/lib/components/modals/modal.d.ts.map +1 -1
  23. package/lib/components/modals/modal.js +1 -0
  24. package/lib/components/modals/modal.js.map +1 -1
  25. package/lib/components/resizeable-sidebar.d.ts +0 -1
  26. package/lib/components/resizeable-sidebar.d.ts.map +1 -1
  27. package/lib/components/signals.d.ts +13 -2
  28. package/lib/components/signals.d.ts.map +1 -1
  29. package/lib/components/signals.js +15 -1
  30. package/lib/components/signals.js.map +1 -1
  31. package/lib/components/tab-nav-bar.d.ts +3 -3
  32. package/lib/components/tab-nav-bar.d.ts.map +1 -1
  33. package/lib/components/workspace-tabs/tab.d.ts +0 -1
  34. package/lib/components/workspace-tabs/tab.d.ts.map +1 -1
  35. package/lib/index.d.ts +1 -1
  36. package/lib/index.d.ts.map +1 -1
  37. package/lib/index.js +8 -10
  38. package/lib/index.js.map +1 -1
  39. package/package.json +5 -4
  40. package/lib/components/generative-ai/ai-entry-svg.d.ts +0 -12
  41. package/lib/components/generative-ai/ai-entry-svg.d.ts.map +0 -1
  42. package/lib/components/generative-ai/ai-entry-svg.js +0 -57
  43. package/lib/components/generative-ai/ai-entry-svg.js.map +0 -1
  44. package/lib/components/generative-ai/ai-experience-entry.d.ts +0 -13
  45. package/lib/components/generative-ai/ai-experience-entry.d.ts.map +0 -1
  46. package/lib/components/generative-ai/ai-experience-entry.js +0 -85
  47. package/lib/components/generative-ai/ai-experience-entry.js.map +0 -1
  48. package/lib/components/generative-ai/ai-feedback.d.ts +0 -7
  49. package/lib/components/generative-ai/ai-feedback.d.ts.map +0 -1
  50. package/lib/components/generative-ai/ai-feedback.js +0 -124
  51. package/lib/components/generative-ai/ai-feedback.js.map +0 -1
  52. package/lib/components/generative-ai/ai-guide-cue.d.ts +0 -12
  53. package/lib/components/generative-ai/ai-guide-cue.d.ts.map +0 -1
  54. package/lib/components/generative-ai/ai-guide-cue.js +0 -58
  55. package/lib/components/generative-ai/ai-guide-cue.js.map +0 -1
  56. package/lib/components/generative-ai/generative-ai-input.d.ts +0 -19
  57. package/lib/components/generative-ai/generative-ai-input.d.ts.map +0 -1
  58. package/lib/components/generative-ai/generative-ai-input.js +0 -203
  59. package/lib/components/generative-ai/generative-ai-input.js.map +0 -1
  60. package/lib/components/generative-ai/index.d.ts +0 -3
  61. package/lib/components/generative-ai/index.d.ts.map +0 -1
  62. package/lib/components/generative-ai/index.js +0 -9
  63. package/lib/components/generative-ai/index.js.map +0 -1
@@ -1,57 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.AIEntrySVG = exports.getAIEntrySVGString = exports.DEFAULT_AI_ENTRY_SIZE = exports.aiEntrySVGLightModeStyles = exports.aiEntrySVGDarkModeStyles = exports.aiEntrySVGStyles = void 0;
7
- const react_1 = __importDefault(require("react"));
8
- const emotion_1 = require("@leafygreen-ui/emotion");
9
- const palette_1 = require("@leafygreen-ui/palette");
10
- const tokens_1 = require("@leafygreen-ui/tokens");
11
- exports.aiEntrySVGStyles = (0, emotion_1.css)({
12
- alignSelf: 'center',
13
- marginLeft: tokens_1.spacing[1],
14
- path: {
15
- transition: 'fill 0.16s ease-in',
16
- },
17
- });
18
- exports.aiEntrySVGDarkModeStyles = (0, emotion_1.css)({
19
- path: {
20
- fill: palette_1.palette.green.dark1,
21
- },
22
- '&:hover': {
23
- path: {
24
- fill: palette_1.palette.green.base,
25
- },
26
- },
27
- });
28
- exports.aiEntrySVGLightModeStyles = (0, emotion_1.css)({
29
- path: {
30
- fill: palette_1.palette.green.dark2,
31
- },
32
- '&:hover': {
33
- path: {
34
- fill: palette_1.palette.green.dark1,
35
- },
36
- },
37
- });
38
- exports.DEFAULT_AI_ENTRY_SIZE = 16;
39
- const AIEntrySVG = ({ darkMode, size = exports.DEFAULT_AI_ENTRY_SIZE, }) => (react_1.default.createElement("svg", { width: size, height: size, viewBox: "0 0 16 16", fill: "none", className: (0, emotion_1.cx)(exports.aiEntrySVGStyles, darkMode ? exports.aiEntrySVGDarkModeStyles : exports.aiEntrySVGLightModeStyles), xmlns: "http://www.w3.org/2000/svg" },
40
- react_1.default.createElement("path", { d: "M6.27339 2.89343L5.27506 5.88842C5.17495 6.18877 4.93927 6.42445 4.63892 6.52456L1.64393 7.52289C1.18542 7.67573 1.18542 8.32427 1.64393 8.47711L4.63892 9.47544C4.93927 9.57555 5.17495 9.81123 5.27506 10.1116L6.27339 13.1066C6.42623 13.5651 7.07477 13.5651 7.22761 13.1066L8.22594 10.1116C8.32605 9.81123 8.56173 9.57555 8.86208 9.47544L11.8571 8.47711C12.3156 8.32427 12.3156 7.67573 11.8571 7.52289L8.86208 6.52456C8.56173 6.42445 8.32605 6.18877 8.22594 5.88842L7.22761 2.89343C7.07477 2.43492 6.42623 2.43492 6.27339 2.89343Z", fill: "#00684A" }),
41
- react_1.default.createElement("path", { d: "M12.5469 1.17194L12.3159 1.8651C12.2158 2.16545 11.9801 2.40113 11.6797 2.50125L10.9866 2.7323C10.7573 2.80872 10.7573 3.13299 10.9866 3.20941L11.6797 3.44046C11.9801 3.54058 12.2158 3.77626 12.3159 4.0766L12.5469 4.76977C12.6233 4.99902 12.9476 4.99902 13.024 4.76977L13.2551 4.0766C13.3552 3.77626 13.5909 3.54058 13.8912 3.44046L14.5844 3.20941C14.8136 3.13299 14.8136 2.80872 14.5844 2.7323L13.8912 2.50125C13.5909 2.40113 13.3552 2.16545 13.2551 1.8651L13.024 1.17194C12.9476 0.942687 12.6233 0.942687 12.5469 1.17194Z", fill: "#00684A" }),
42
- react_1.default.createElement("path", { d: "M12.5469 11.2302L12.3159 11.9234C12.2158 12.2237 11.9801 12.4594 11.6797 12.5595L10.9866 12.7906C10.7573 12.867 10.7573 13.1913 10.9866 13.2677L11.6797 13.4988C11.9801 13.5989 12.2158 13.8346 12.3159 14.1349L12.5469 14.8281C12.6233 15.0573 12.9476 15.0573 13.024 14.8281L13.2551 14.1349C13.3552 13.8346 13.5909 13.5989 13.8912 13.4988L14.5844 13.2677C14.8136 13.1913 14.8136 12.867 14.5844 12.7906L13.8912 12.5595C13.5909 12.4594 13.3552 12.2237 13.2551 11.9234L13.024 11.2302C12.9476 11.001 12.6233 11.001 12.5469 11.2302Z", fill: "#00684A" })));
43
- exports.AIEntrySVG = AIEntrySVG;
44
- const getAIEntrySVGString = () => `<svg
45
- width="16"
46
- height="16"
47
- viewBox="0 0 16 16"
48
- fill="none"
49
- xmlns="http://www.w3.org/2000/svg"
50
- >
51
- <path d="M6.27339 2.89343L5.27506 5.88842C5.17495 6.18877 4.93927 6.42445 4.63892 6.52456L1.64393 7.52289C1.18542 7.67573 1.18542 8.32427 1.64393 8.47711L4.63892 9.47544C4.93927 9.57555 5.17495 9.81123 5.27506 10.1116L6.27339 13.1066C6.42623 13.5651 7.07477 13.5651 7.22761 13.1066L8.22594 10.1116C8.32605 9.81123 8.56173 9.57555 8.86208 9.47544L11.8571 8.47711C12.3156 8.32427 12.3156 7.67573 11.8571 7.52289L8.86208 6.52456C8.56173 6.42445 8.32605 6.18877 8.22594 5.88842L7.22761 2.89343C7.07477 2.43492 6.42623 2.43492 6.27339 2.89343Z" fill="#00684A"/>
52
- <path d="M12.5469 1.17194L12.3159 1.8651C12.2158 2.16545 11.9801 2.40113 11.6797 2.50125L10.9866 2.7323C10.7573 2.80872 10.7573 3.13299 10.9866 3.20941L11.6797 3.44046C11.9801 3.54058 12.2158 3.77626 12.3159 4.0766L12.5469 4.76977C12.6233 4.99902 12.9476 4.99902 13.024 4.76977L13.2551 4.0766C13.3552 3.77626 13.5909 3.54058 13.8912 3.44046L14.5844 3.20941C14.8136 3.13299 14.8136 2.80872 14.5844 2.7323L13.8912 2.50125C13.5909 2.40113 13.3552 2.16545 13.2551 1.8651L13.024 1.17194C12.9476 0.942687 12.6233 0.942687 12.5469 1.17194Z" fill="#00684A"/>
53
- <path d="M12.5469 11.2302L12.3159 11.9234C12.2158 12.2237 11.9801 12.4594 11.6797 12.5595L10.9866 12.7906C10.7573 12.867 10.7573 13.1913 10.9866 13.2677L11.6797 13.4988C11.9801 13.5989 12.2158 13.8346 12.3159 14.1349L12.5469 14.8281C12.6233 15.0573 12.9476 15.0573 13.024 14.8281L13.2551 14.1349C13.3552 13.8346 13.5909 13.5989 13.8912 13.4988L14.5844 13.2677C14.8136 13.1913 14.8136 12.867 14.5844 12.7906L13.8912 12.5595C13.5909 12.4594 13.3552 12.2237 13.2551 11.9234L13.024 11.2302C12.9476 11.001 12.6233 11.001 12.5469 11.2302Z" fill="#00684A"/>
54
- </svg>
55
- `;
56
- exports.getAIEntrySVGString = getAIEntrySVGString;
57
- //# sourceMappingURL=ai-entry-svg.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-entry-svg.js","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-entry-svg.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,oDAAiD;AACjD,oDAAiD;AACjD,kDAAgD;AAEnC,QAAA,gBAAgB,GAAG,IAAA,aAAG,EAAC;IAClC,SAAS,EAAE,QAAQ;IACnB,UAAU,EAAE,gBAAO,CAAC,CAAC,CAAC;IACtB,IAAI,EAAE;QACJ,UAAU,EAAE,oBAAoB;KACjC;CACF,CAAC,CAAC;AAEU,QAAA,wBAAwB,GAAG,IAAA,aAAG,EAAC;IAC1C,IAAI,EAAE;QACJ,IAAI,EAAE,iBAAO,CAAC,KAAK,CAAC,KAAK;KAC1B;IAED,SAAS,EAAE;QACT,IAAI,EAAE;YACJ,IAAI,EAAE,iBAAO,CAAC,KAAK,CAAC,IAAI;SACzB;KACF;CACF,CAAC,CAAC;AAEU,QAAA,yBAAyB,GAAG,IAAA,aAAG,EAAC;IAC3C,IAAI,EAAE;QACJ,IAAI,EAAE,iBAAO,CAAC,KAAK,CAAC,KAAK;KAC1B;IACD,SAAS,EAAE;QACT,IAAI,EAAE;YACJ,IAAI,EAAE,iBAAO,CAAC,KAAK,CAAC,KAAK;SAC1B;KACF;CACF,CAAC,CAAC;AAEU,QAAA,qBAAqB,GAAG,EAAE,CAAC;AAGxC,MAAM,UAAU,GAAG,CAAC,EAClB,QAAQ,EACR,IAAI,GAAG,6BAAqB,GAI7B,EAAE,EAAE,CAAC,CACJ,uCACE,KAAK,EAAE,IAAI,EACX,MAAM,EAAE,IAAI,EACZ,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,IAAA,YAAE,EACX,wBAAgB,EAChB,QAAQ,CAAC,CAAC,CAAC,gCAAwB,CAAC,CAAC,CAAC,iCAAyB,CAChE,EACD,KAAK,EAAC,4BAA4B;IAElC,wCACE,CAAC,EAAC,mhBAAmhB,EACrhB,IAAI,EAAC,SAAS,GACd;IACF,wCACE,CAAC,EAAC,6gBAA6gB,EAC/gB,IAAI,EAAC,SAAS,GACd;IACF,wCACE,CAAC,EAAC,6gBAA6gB,EAC/gB,IAAI,EAAC,SAAS,GACd,CACE,CACP,CAAC;AAgB4B,gCAAU;AAbxC,MAAM,mBAAmB,GAAG,GAAG,EAAE,CAAC;;;;;;;;;;;CAWjC,CAAC;AAEO,kDAAmB"}
@@ -1,13 +0,0 @@
1
- /// <reference types="react" />
2
- declare function AIExperienceEntry({ 'data-testid': dataTestId, type, onClick, }: {
3
- ['data-testid']?: string;
4
- type: 'aggregation' | 'query';
5
- onClick: () => void;
6
- }): JSX.Element;
7
- declare function createAIPlaceholderHTMLPlaceholder({ onClickAI, darkMode, placeholderText, }: {
8
- onClickAI: () => void;
9
- darkMode?: boolean;
10
- placeholderText: string;
11
- }): HTMLElement;
12
- export { AIExperienceEntry, createAIPlaceholderHTMLPlaceholder };
13
- //# sourceMappingURL=ai-experience-entry.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-experience-entry.d.ts","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-experience-entry.tsx"],"names":[],"mappings":";AA4EA,iBAAS,iBAAiB,CAAC,EACzB,aAAa,EAAE,UAAU,EACzB,IAAI,EACJ,OAAO,GACR,EAAE;IACD,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,EAAE,aAAa,GAAG,OAAO,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,eAgBA;AAID,iBAAS,kCAAkC,CAAC,EAC1C,SAAS,EACT,QAAQ,EACR,eAAe,GAChB,EAAE;IACD,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;CACzB,GAAG,WAAW,CAmCd;AAED,OAAO,EAAE,iBAAiB,EAAE,kCAAkC,EAAE,CAAC"}
@@ -1,85 +0,0 @@
1
- "use strict";
2
- var __importDefault = (this && this.__importDefault) || function (mod) {
3
- return (mod && mod.__esModule) ? mod : { "default": mod };
4
- };
5
- Object.defineProperty(exports, "__esModule", { value: true });
6
- exports.createAIPlaceholderHTMLPlaceholder = exports.AIExperienceEntry = void 0;
7
- const react_1 = __importDefault(require("react"));
8
- const palette_1 = require("@leafygreen-ui/palette");
9
- const emotion_1 = require("@leafygreen-ui/emotion");
10
- const tokens_1 = require("@leafygreen-ui/tokens");
11
- const ai_entry_svg_1 = require("./ai-entry-svg");
12
- const use_focus_ring_1 = require("../../hooks/use-focus-ring");
13
- const use_theme_1 = require("../../hooks/use-theme");
14
- const aiEntryStyles = (0, emotion_1.css)({
15
- border: 'none',
16
- outline: 'none',
17
- boxShadow: 'none',
18
- padding: `${tokens_1.spacing[1]}px ${tokens_1.spacing[2]}px`,
19
- margin: `${-tokens_1.spacing[1]}px ${-tokens_1.spacing[2]}px`,
20
- background: 'none',
21
- whiteSpace: 'normal',
22
- position: 'relative',
23
- textDecoration: 'underline',
24
- fontWeight: 'bold',
25
- display: 'inline-flex',
26
- gap: `${tokens_1.spacing[1]}px`,
27
- transition: 'color 0.16s ease-in',
28
- path: {
29
- transition: 'fill 0.16s ease-in',
30
- },
31
- '&:hover': {
32
- cursor: 'pointer',
33
- },
34
- }, use_focus_ring_1.focusRing, ai_entry_svg_1.aiEntrySVGStyles);
35
- const aiEntryDarkModeStyles = (0, emotion_1.css)({
36
- color: palette_1.palette.green.dark1,
37
- '&:hover': {
38
- path: {
39
- fill: palette_1.palette.green.base,
40
- },
41
- color: palette_1.palette.green.base,
42
- },
43
- }, ai_entry_svg_1.aiEntrySVGDarkModeStyles);
44
- const aiEntryLightModeStyles = (0, emotion_1.css)({
45
- color: palette_1.palette.green.dark2,
46
- '&:hover': {
47
- path: {
48
- fill: palette_1.palette.green.dark1,
49
- },
50
- color: palette_1.palette.green.dark1,
51
- },
52
- }, ai_entry_svg_1.aiEntrySVGLightModeStyles);
53
- function AIExperienceEntry({ 'data-testid': dataTestId, type, onClick, }) {
54
- const darkMode = (0, use_theme_1.useDarkMode)();
55
- return (react_1.default.createElement("button", { className: (0, emotion_1.cx)(aiEntryStyles, darkMode ? aiEntryDarkModeStyles : aiEntryLightModeStyles), onClick: onClick, "data-testid": dataTestId },
56
- "Generate ",
57
- type,
58
- react_1.default.createElement(ai_entry_svg_1.AIEntrySVG, { darkMode: darkMode })));
59
- }
60
- exports.AIExperienceEntry = AIExperienceEntry;
61
- function createAIPlaceholderHTMLPlaceholder({ onClickAI, darkMode, placeholderText, }) {
62
- const containerEl = document.createElement('div');
63
- const placeholderTextEl = document.createTextNode(`${placeholderText} or `);
64
- containerEl.appendChild(placeholderTextEl);
65
- const aiButtonEl = document.createElement('button');
66
- aiButtonEl.setAttribute('data-testid', 'open-ai-query-entry-button');
67
- aiButtonEl.style.pointerEvents = 'auto';
68
- aiButtonEl.addEventListener('mousedown', (e) => {
69
- e.preventDefault();
70
- e.stopPropagation();
71
- });
72
- aiButtonEl.addEventListener('click', (e) => {
73
- e.preventDefault();
74
- e.stopPropagation();
75
- onClickAI();
76
- });
77
- aiButtonEl.className = (0, emotion_1.cx)(aiEntryStyles, darkMode ? aiEntryDarkModeStyles : aiEntryLightModeStyles);
78
- const aiButtonContent = `<span>Generate query</span>
79
- ${(0, ai_entry_svg_1.getAIEntrySVGString)()}`;
80
- aiButtonEl.innerHTML = aiButtonContent;
81
- containerEl.appendChild(aiButtonEl);
82
- return containerEl;
83
- }
84
- exports.createAIPlaceholderHTMLPlaceholder = createAIPlaceholderHTMLPlaceholder;
85
- //# sourceMappingURL=ai-experience-entry.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-experience-entry.js","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-experience-entry.tsx"],"names":[],"mappings":"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"}
@@ -1,7 +0,0 @@
1
- /// <reference types="react" />
2
- type AIFeedbackProps = {
3
- onSubmitFeedback: (feedback: 'positive' | 'negative', text: string) => void;
4
- };
5
- declare function AIFeedback({ onSubmitFeedback }: AIFeedbackProps): JSX.Element | null;
6
- export { AIFeedback };
7
- //# sourceMappingURL=ai-feedback.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-feedback.d.ts","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-feedback.tsx"],"names":[],"mappings":";AAsEA,KAAK,eAAe,GAAG;IACrB,gBAAgB,EAAE,CAAC,QAAQ,EAAE,UAAU,GAAG,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC7E,CAAC;AAEF,iBAAS,UAAU,CAAC,EAAE,gBAAgB,EAAE,EAAE,eAAe,sBA0GxD;AAED,OAAO,EAAE,UAAU,EAAE,CAAC"}
@@ -1,124 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.AIFeedback = void 0;
27
- const react_1 = __importStar(require("react"));
28
- const emotion_1 = require("@leafygreen-ui/emotion");
29
- const palette_1 = require("@leafygreen-ui/palette");
30
- const tokens_1 = require("@leafygreen-ui/tokens");
31
- const leafygreen_1 = require("../leafygreen");
32
- const feedback_popover_1 = require("../feedback-popover");
33
- const use_theme_1 = require("../../hooks/use-theme");
34
- const suggestionActionButtonStyles = (0, emotion_1.css)({
35
- flexShrink: 0,
36
- display: 'flex',
37
- gap: tokens_1.spacing[2],
38
- });
39
- const fadeOutAnimationTimeMS = 2000;
40
- const fadeOutWidthAnimation = (0, emotion_1.keyframes)({
41
- '0%': {
42
- width: tokens_1.spacing[7],
43
- },
44
- '90%': {
45
- width: tokens_1.spacing[7],
46
- },
47
- '100%': {
48
- width: 0,
49
- },
50
- });
51
- const feedbackSubmittedStyles = (0, emotion_1.css)({
52
- overflow: 'hidden',
53
- animation: `${fadeOutWidthAnimation} ${fadeOutAnimationTimeMS}ms ease-in`,
54
- width: 0,
55
- display: 'flex',
56
- alignItems: 'center',
57
- justifyContent: 'space-around',
58
- });
59
- const submittedDarkStyles = (0, emotion_1.css)({
60
- color: palette_1.palette.green.light1,
61
- });
62
- const submittedLightStyles = (0, emotion_1.css)({
63
- color: palette_1.palette.green.dark1,
64
- });
65
- const feedbackButtonLightStyles = (0, emotion_1.css)({
66
- fill: palette_1.palette.gray.dark1,
67
- });
68
- const feedbackButtonDarkStyles = (0, emotion_1.css)({
69
- fill: palette_1.palette.gray.light1,
70
- });
71
- const buttonActivePositiveStyles = (0, emotion_1.css)({
72
- backgroundColor: palette_1.palette.green.light3,
73
- borderColor: palette_1.palette.green.dark1,
74
- fill: palette_1.palette.green.dark1,
75
- });
76
- const buttonActiveNegativeStyles = (0, emotion_1.css)({
77
- backgroundColor: palette_1.palette.red.light3,
78
- borderColor: palette_1.palette.red.dark2,
79
- fill: palette_1.palette.red.dark2,
80
- });
81
- function AIFeedback({ onSubmitFeedback }) {
82
- const darkMode = (0, use_theme_1.useDarkMode)();
83
- const feedbackPositiveButtonRef = (0, react_1.useRef)(null);
84
- const feedbackNegativeButtonRef = (0, react_1.useRef)(null);
85
- const [chosenFeedbackOption, setChosenFeedbackOption] = (0, react_1.useState)('none');
86
- const [didSubmit, setDidSubmit] = (0, react_1.useState)(false);
87
- const [enableShowFeedbackSuccess, setEnableShowFeedbackSuccess] = (0, react_1.useState)(true);
88
- const _onSubmitFeedback = (0, react_1.useCallback)((text) => {
89
- if (chosenFeedbackOption === 'none') {
90
- return;
91
- }
92
- onSubmitFeedback(chosenFeedbackOption, text);
93
- setDidSubmit(true);
94
- }, [chosenFeedbackOption, onSubmitFeedback, setDidSubmit]);
95
- (0, react_1.useEffect)(() => {
96
- if (didSubmit) {
97
- const timeoutId = setTimeout(() => {
98
- setEnableShowFeedbackSuccess(false);
99
- }, fadeOutAnimationTimeMS);
100
- return () => {
101
- clearTimeout(timeoutId);
102
- };
103
- }
104
- }, [didSubmit]);
105
- if (didSubmit) {
106
- if (!enableShowFeedbackSuccess) {
107
- return null;
108
- }
109
- return (react_1.default.createElement("div", { className: feedbackSubmittedStyles },
110
- react_1.default.createElement(leafygreen_1.Disclaimer, { className: darkMode ? submittedDarkStyles : submittedLightStyles }, "Success!")));
111
- }
112
- return (react_1.default.createElement("div", { className: suggestionActionButtonStyles },
113
- react_1.default.createElement(leafygreen_1.Button, { className: (0, emotion_1.cx)(darkMode ? feedbackButtonDarkStyles : feedbackButtonLightStyles, chosenFeedbackOption === 'positive' && buttonActivePositiveStyles), onClick: () => setChosenFeedbackOption('positive'), size: "small", "data-testid": "ai-feedback-thumbs-up", ref: feedbackPositiveButtonRef, "aria-label": "Submit positive feedback" },
114
- react_1.default.createElement(leafygreen_1.Icon, { glyph: "ThumbsUp" })),
115
- react_1.default.createElement(leafygreen_1.Button, { className: (0, emotion_1.cx)(darkMode ? feedbackButtonDarkStyles : feedbackButtonLightStyles, chosenFeedbackOption === 'negative' && buttonActiveNegativeStyles), onClick: () => setChosenFeedbackOption('negative'), size: "small", ref: feedbackNegativeButtonRef, "aria-label": "Submit negative feedback" },
116
- react_1.default.createElement(leafygreen_1.Icon, { glyph: "ThumbsDown" })),
117
- chosenFeedbackOption !== 'none' && (react_1.default.createElement(feedback_popover_1.FeedbackPopover, { refEl: chosenFeedbackOption === 'positive'
118
- ? feedbackPositiveButtonRef
119
- : feedbackNegativeButtonRef, open: true, setOpen: () => setChosenFeedbackOption('none'), onSubmitFeedback: _onSubmitFeedback, label: "Provide Feedback", placeholder: chosenFeedbackOption === 'positive'
120
- ? 'What do you like about the generated query?'
121
- : 'What could be better about the generated query?' }))));
122
- }
123
- exports.AIFeedback = AIFeedback;
124
- //# sourceMappingURL=ai-feedback.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-feedback.js","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-feedback.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAwE;AACxE,oDAA4D;AAC5D,oDAAiD;AACjD,kDAAgD;AAEhD,8CAAyD;AACzD,0DAAsD;AACtD,qDAAoD;AAEpD,MAAM,4BAA4B,GAAG,IAAA,aAAG,EAAC;IACvC,UAAU,EAAE,CAAC;IACb,OAAO,EAAE,MAAM;IACf,GAAG,EAAE,gBAAO,CAAC,CAAC,CAAC;CAChB,CAAC,CAAC;AAEH,MAAM,sBAAsB,GAAG,IAAI,CAAC;AAEpC,MAAM,qBAAqB,GAAG,IAAA,mBAAS,EAAC;IACtC,IAAI,EAAE;QACJ,KAAK,EAAE,gBAAO,CAAC,CAAC,CAAC;KAClB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,gBAAO,CAAC,CAAC,CAAC;KAClB;IACD,MAAM,EAAE;QACN,KAAK,EAAE,CAAC;KACT;CACF,CAAC,CAAC;AAEH,MAAM,uBAAuB,GAAG,IAAA,aAAG,EAAC;IAClC,QAAQ,EAAE,QAAQ;IAClB,SAAS,EAAE,GAAG,qBAAqB,IAAI,sBAAsB,YAAY;IACzE,KAAK,EAAE,CAAC;IACR,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,cAAc;CAC/B,CAAC,CAAC;AAEH,MAAM,mBAAmB,GAAG,IAAA,aAAG,EAAC;IAC9B,KAAK,EAAE,iBAAO,CAAC,KAAK,CAAC,MAAM;CAC5B,CAAC,CAAC;AAEH,MAAM,oBAAoB,GAAG,IAAA,aAAG,EAAC;IAC/B,KAAK,EAAE,iBAAO,CAAC,KAAK,CAAC,KAAK;CAC3B,CAAC,CAAC;AAEH,MAAM,yBAAyB,GAAG,IAAA,aAAG,EAAC;IAGpC,IAAI,EAAE,iBAAO,CAAC,IAAI,CAAC,KAAK;CACzB,CAAC,CAAC;AAEH,MAAM,wBAAwB,GAAG,IAAA,aAAG,EAAC;IAGnC,IAAI,EAAE,iBAAO,CAAC,IAAI,CAAC,MAAM;CAC1B,CAAC,CAAC;AAEH,MAAM,0BAA0B,GAAG,IAAA,aAAG,EAAC;IACrC,eAAe,EAAE,iBAAO,CAAC,KAAK,CAAC,MAAM;IACrC,WAAW,EAAE,iBAAO,CAAC,KAAK,CAAC,KAAK;IAChC,IAAI,EAAE,iBAAO,CAAC,KAAK,CAAC,KAAK;CAC1B,CAAC,CAAC;AAEH,MAAM,0BAA0B,GAAG,IAAA,aAAG,EAAC;IACrC,eAAe,EAAE,iBAAO,CAAC,GAAG,CAAC,MAAM;IACnC,WAAW,EAAE,iBAAO,CAAC,GAAG,CAAC,KAAK;IAC9B,IAAI,EAAE,iBAAO,CAAC,GAAG,CAAC,KAAK;CACxB,CAAC,CAAC;AAMH,SAAS,UAAU,CAAC,EAAE,gBAAgB,EAAmB;IACvD,MAAM,QAAQ,GAAG,IAAA,uBAAW,GAAE,CAAC;IAE/B,MAAM,yBAAyB,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IACjE,MAAM,yBAAyB,GAAG,IAAA,cAAM,EAAmB,IAAI,CAAC,CAAC;IAEjE,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,IAAA,gBAAQ,EAE9D,MAAM,CAAC,CAAC;IAEV,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,yBAAyB,EAAE,4BAA4B,CAAC,GAC7D,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAEjB,MAAM,iBAAiB,GAAG,IAAA,mBAAW,EACnC,CAAC,IAAY,EAAE,EAAE;QACf,IAAI,oBAAoB,KAAK,MAAM,EAAE;YACnC,OAAO;SACR;QAED,gBAAgB,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAC;QAC7C,YAAY,CAAC,IAAI,CAAC,CAAC;IACrB,CAAC,EACD,CAAC,oBAAoB,EAAE,gBAAgB,EAAE,YAAY,CAAC,CACvD,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,SAAS,EAAE;YACb,MAAM,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;gBAChC,4BAA4B,CAAC,KAAK,CAAC,CAAC;YACtC,CAAC,EAAE,sBAAsB,CAAC,CAAC;YAC3B,OAAO,GAAG,EAAE;gBACV,YAAY,CAAC,SAAS,CAAC,CAAC;YAC1B,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,IAAI,SAAS,EAAE;QACb,IAAI,CAAC,yBAAyB,EAAE;YAC9B,OAAO,IAAI,CAAC;SACb;QAED,OAAO,CACL,uCAAK,SAAS,EAAE,uBAAuB;YACrC,8BAAC,uBAAU,IACT,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,oBAAoB,eAGrD,CACT,CACP,CAAC;KACH;IAED,OAAO,CACL,uCAAK,SAAS,EAAE,4BAA4B;QAC1C,8BAAC,mBAAM,IACL,SAAS,EAAE,IAAA,YAAE,EACX,QAAQ,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,yBAAyB,EAC/D,oBAAoB,KAAK,UAAU,IAAI,0BAA0B,CAClE,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,uBAAuB,CAAC,UAAU,CAAC,EAClD,IAAI,EAAC,OAAO,iBACA,uBAAuB,EACnC,GAAG,EAAE,yBAAyB,gBACnB,0BAA0B;YAErC,8BAAC,iBAAI,IAAC,KAAK,EAAC,UAAU,GAAG,CAClB;QAET,8BAAC,mBAAM,IACL,SAAS,EAAE,IAAA,YAAE,EACX,QAAQ,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,yBAAyB,EAC/D,oBAAoB,KAAK,UAAU,IAAI,0BAA0B,CAClE,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,uBAAuB,CAAC,UAAU,CAAC,EAClD,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,yBAAyB,gBACnB,0BAA0B;YAErC,8BAAC,iBAAI,IAAC,KAAK,EAAC,YAAY,GAAG,CACpB;QAMR,oBAAoB,KAAK,MAAM,IAAI,CAClC,8BAAC,kCAAe,IACd,KAAK,EACH,oBAAoB,KAAK,UAAU;gBACjC,CAAC,CAAC,yBAAyB;gBAC3B,CAAC,CAAC,yBAAyB,EAE/B,IAAI,QACJ,OAAO,EAAE,GAAG,EAAE,CAAC,uBAAuB,CAAC,MAAM,CAAC,EAC9C,gBAAgB,EAAE,iBAAiB,EACnC,KAAK,EAAC,kBAAkB,EACxB,WAAW,EACT,oBAAoB,KAAK,UAAU;gBACjC,CAAC,CAAC,6CAA6C;gBAC/C,CAAC,CAAC,iDAAiD,GAEvD,CACH,CACG,CACP,CAAC;AACJ,CAAC;AAEQ,gCAAU"}
@@ -1,12 +0,0 @@
1
- import React from 'react';
2
- import { GuideCue as LGGuideCue } from '@leafygreen-ui/guide-cue';
3
- type LGGuideCueProps = React.ComponentProps<typeof LGGuideCue>;
4
- export type AIGuideCueProps = Omit<LGGuideCueProps, 'currentStep' | 'numberOfSteps' | 'children' | 'title' | 'open' | 'setOpen'> & {
5
- title?: string;
6
- description?: string;
7
- showGuideCue: boolean;
8
- onCloseGuideCue(): void;
9
- };
10
- export declare const AIGuideCue: ({ title, description, refEl, showGuideCue, onCloseGuideCue, }: AIGuideCueProps) => JSX.Element;
11
- export {};
12
- //# sourceMappingURL=ai-guide-cue.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-guide-cue.d.ts","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-guide-cue.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAC;AACzC,OAAO,EAAE,QAAQ,IAAI,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAIlE,KAAK,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC;AAG/D,MAAM,MAAM,eAAe,GAAG,IAAI,CAChC,eAAe,EACf,aAAa,GAAG,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAC5E,GAAG;IACF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,eAAe,IAAI,IAAI,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,UAAU,kEAMpB,eAAe,gBAoDjB,CAAC"}
@@ -1,58 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.AIGuideCue = void 0;
27
- const react_1 = __importStar(require("react"));
28
- const guide_cue_1 = require("@leafygreen-ui/guide-cue");
29
- const tokens_1 = require("@leafygreen-ui/tokens");
30
- const utils_1 = require("@react-aria/utils");
31
- const AIGuideCue = ({ title = '', description, refEl, showGuideCue, onCloseGuideCue, }) => {
32
- const aiGuideCuePopoverId = (0, utils_1.useId)();
33
- (0, react_1.useEffect)(() => {
34
- if (!showGuideCue) {
35
- return;
36
- }
37
- const listener = (event) => {
38
- const popover = document.querySelector(`[data-popoverid="ai-guide-cue-description-popover-${aiGuideCuePopoverId}"]`);
39
- if (!popover) {
40
- return;
41
- }
42
- if (event.composedPath().includes(popover) ||
43
- event.composedPath().includes(refEl.current)) {
44
- return;
45
- }
46
- onCloseGuideCue();
47
- };
48
- document.addEventListener('mousedown', listener);
49
- return () => {
50
- document.removeEventListener('mousedown', listener);
51
- };
52
- }, [aiGuideCuePopoverId, onCloseGuideCue, refEl, showGuideCue]);
53
- return (react_1.default.createElement(guide_cue_1.GuideCue, { spacing: tokens_1.spacing[3], open: showGuideCue, setOpen: () => {
54
- }, refEl: refEl, numberOfSteps: 1, currentStep: 1, onPrimaryButtonClick: onCloseGuideCue, onDismiss: onCloseGuideCue, title: title, "data-popoverid": `ai-guide-cue-description-popover-${aiGuideCuePopoverId}`, buttonText: "Got it" },
55
- react_1.default.createElement("span", { "data-testid": "ai-guide-cue-description-span" }, description)));
56
- };
57
- exports.AIGuideCue = AIGuideCue;
58
- //# sourceMappingURL=ai-guide-cue.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"ai-guide-cue.js","sourceRoot":"","sources":["../../../src/components/generative-ai/ai-guide-cue.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAyC;AACzC,wDAAkE;AAClE,kDAAgD;AAChD,6CAA0C;AAenC,MAAM,UAAU,GAAG,CAAC,EACzB,KAAK,GAAG,EAAE,EACV,WAAW,EACX,KAAK,EACL,YAAY,EACZ,eAAe,GACC,EAAE,EAAE;IACpB,MAAM,mBAAmB,GAAG,IAAA,aAAK,GAAE,CAAC;IAEpC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY,EAAE;YACjB,OAAO;SACR;QAED,MAAM,QAAQ,GAAG,CAAC,KAAiB,EAAE,EAAE;YACrC,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CACpC,qDAAqD,mBAAmB,IAAI,CAC7E,CAAC;YACF,IAAI,CAAC,OAAO,EAAE;gBACZ,OAAO;aACR;YAGD,IACE,KAAK,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC;gBACtC,KAAK,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAQ,CAAC,EAC7C;gBACA,OAAO;aACR;YAED,eAAe,EAAE,CAAC;QACpB,CAAC,CAAC;QAEF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QACjD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;QACtD,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,mBAAmB,EAAE,eAAe,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAEhE,OAAO,CACL,8BAAC,oBAAU,IACT,OAAO,EAAE,gBAAO,CAAC,CAAC,CAAC,EACnB,IAAI,EAAE,YAAY,EAClB,OAAO,EAAE,GAAG,EAAE;QAEd,CAAC,EACD,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,CAAC,EAChB,WAAW,EAAE,CAAC,EACd,oBAAoB,EAAE,eAAe,EACrC,SAAS,EAAE,eAAe,EAC1B,KAAK,EAAE,KAAK,oBACI,oCAAoC,mBAAmB,EAAE,EACzE,UAAU,EAAC,QAAQ;QAEnB,uDAAkB,+BAA+B,IAAE,WAAW,CAAQ,CAC3D,CACd,CAAC;AACJ,CAAC,CAAC;AA1DW,QAAA,UAAU,cA0DrB"}
@@ -1,19 +0,0 @@
1
- /// <reference types="react" />
2
- type GenerativeAIInputProps = {
3
- aiPromptText: string;
4
- didSucceed: boolean;
5
- errorMessage?: string;
6
- isFetching?: boolean;
7
- placeholder?: string;
8
- show: boolean;
9
- isAggregationGeneratedFromQuery?: boolean;
10
- onResetIsAggregationGeneratedFromQuery?: () => void;
11
- onCancelRequest: () => void;
12
- onChangeAIPromptText: (text: string) => void;
13
- onClose: () => void;
14
- onSubmitText: (text: string) => void;
15
- onSubmitFeedback?: (feedback: 'positive' | 'negative', feedbackText: string) => void;
16
- };
17
- declare function GenerativeAIInput({ aiPromptText, didSucceed, errorMessage, isFetching, placeholder, show, onCancelRequest, onClose, onChangeAIPromptText, onSubmitFeedback, onSubmitText, isAggregationGeneratedFromQuery, onResetIsAggregationGeneratedFromQuery, }: GenerativeAIInputProps): JSX.Element | null;
18
- export { GenerativeAIInput };
19
- //# sourceMappingURL=generative-ai-input.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"generative-ai-input.d.ts","sourceRoot":"","sources":["../../../src/components/generative-ai/generative-ai-input.tsx"],"names":[],"mappings":";AAyJA,KAAK,sBAAsB,GAAG;IAC5B,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,EAAE,OAAO,CAAC;IACd,+BAA+B,CAAC,EAAE,OAAO,CAAC;IAC1C,sCAAsC,CAAC,EAAE,MAAM,IAAI,CAAC;IACpD,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,oBAAoB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,gBAAgB,CAAC,EAAE,CACjB,QAAQ,EAAE,UAAU,GAAG,UAAU,EACjC,YAAY,EAAE,MAAM,KACjB,IAAI,CAAC;CACX,CAAC;AAEF,iBAAS,iBAAiB,CAAC,EACzB,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,UAAU,EACV,WAA6F,EAC7F,IAAI,EACJ,eAAe,EACf,OAAO,EACP,oBAAoB,EACpB,gBAAgB,EAChB,YAAY,EACZ,+BAAuC,EACvC,sCAAsC,GACvC,EAAE,sBAAsB,sBAqKxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
@@ -1,203 +0,0 @@
1
- "use strict";
2
- var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
- if (k2 === undefined) k2 = k;
4
- var desc = Object.getOwnPropertyDescriptor(m, k);
5
- if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
- desc = { enumerable: true, get: function() { return m[k]; } };
7
- }
8
- Object.defineProperty(o, k2, desc);
9
- }) : (function(o, m, k, k2) {
10
- if (k2 === undefined) k2 = k;
11
- o[k2] = m[k];
12
- }));
13
- var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
- Object.defineProperty(o, "default", { enumerable: true, value: v });
15
- }) : function(o, v) {
16
- o["default"] = v;
17
- });
18
- var __importStar = (this && this.__importStar) || function (mod) {
19
- if (mod && mod.__esModule) return mod;
20
- var result = {};
21
- if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
- __setModuleDefault(result, mod);
23
- return result;
24
- };
25
- Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.GenerativeAIInput = void 0;
27
- const react_1 = __importStar(require("react"));
28
- const emotion_1 = require("@leafygreen-ui/emotion");
29
- const palette_1 = require("@leafygreen-ui/palette");
30
- const tokens_1 = require("@leafygreen-ui/tokens");
31
- const leafygreen_1 = require("../leafygreen");
32
- const use_theme_1 = require("../../hooks/use-theme");
33
- const error_warning_summary_1 = require("../error-warning-summary");
34
- const loader_1 = require("../loader");
35
- const ai_entry_svg_1 = require("./ai-entry-svg");
36
- const ai_feedback_1 = require("./ai-feedback");
37
- const ai_guide_cue_1 = require("./ai-guide-cue");
38
- const use_focus_ring_1 = require("../../hooks/use-focus-ring");
39
- const containerStyles = (0, emotion_1.css)({
40
- display: 'flex',
41
- flexDirection: 'column',
42
- gap: tokens_1.spacing[1],
43
- });
44
- const inputBarContainerStyles = (0, emotion_1.css)({
45
- paddingTop: tokens_1.spacing[2],
46
- gap: tokens_1.spacing[2],
47
- flexGrow: 1,
48
- display: 'flex',
49
- });
50
- const inputContainerStyles = (0, emotion_1.css)({
51
- display: 'flex',
52
- flexGrow: 1,
53
- position: 'relative',
54
- });
55
- const textInputStyles = (0, emotion_1.css)({
56
- flexGrow: 1,
57
- input: {
58
- paddingLeft: tokens_1.spacing[5],
59
- paddingRight: tokens_1.spacing[6] * 2 + tokens_1.spacing[2],
60
- },
61
- });
62
- const errorSummaryContainer = (0, emotion_1.css)({
63
- marginTop: tokens_1.spacing[1],
64
- });
65
- const floatingButtonsContainerStyles = (0, emotion_1.css)({
66
- position: 'absolute',
67
- right: tokens_1.spacing[1],
68
- display: 'flex',
69
- gap: tokens_1.spacing[2],
70
- alignItems: 'center',
71
- height: tokens_1.spacing[4] + tokens_1.spacing[1],
72
- });
73
- const successIndicatorDarkModeStyles = (0, emotion_1.css)({
74
- color: palette_1.palette.gray.dark3,
75
- backgroundColor: palette_1.palette.green.base,
76
- borderRadius: '50%',
77
- });
78
- const successIndicatorLightModeStyles = (0, emotion_1.css)({
79
- color: palette_1.palette.white,
80
- backgroundColor: palette_1.palette.green.dark1,
81
- borderRadius: '50%',
82
- });
83
- const generateButtonStyles = (0, emotion_1.css)({
84
- border: 'none',
85
- height: tokens_1.spacing[4] - tokens_1.spacing[1],
86
- display: 'flex',
87
- fontSize: '12px',
88
- borderRadius: tokens_1.spacing[1],
89
- });
90
- const generateButtonLightModeStyles = (0, emotion_1.css)({
91
- backgroundColor: palette_1.palette.gray.light2,
92
- });
93
- const highlightSize = 14;
94
- const buttonHighlightStyles = (0, emotion_1.css)({
95
- height: `${highlightSize}px`,
96
- lineHeight: `${highlightSize}px`,
97
- padding: `0px ${tokens_1.spacing[1]}px`,
98
- borderRadius: '2px',
99
- });
100
- const buttonHighlightDarkModeStyles = (0, emotion_1.css)({
101
- backgroundColor: palette_1.palette.gray.dark1,
102
- color: palette_1.palette.gray.light1,
103
- });
104
- const buttonHighlightLightModeStyles = (0, emotion_1.css)({
105
- backgroundColor: palette_1.palette.gray.light1,
106
- color: palette_1.palette.gray.dark1,
107
- });
108
- const loaderContainerStyles = (0, emotion_1.css)({
109
- padding: tokens_1.spacing[1],
110
- display: 'inline-flex',
111
- width: ai_entry_svg_1.DEFAULT_AI_ENTRY_SIZE + tokens_1.spacing[2],
112
- justifyContent: 'space-around',
113
- });
114
- const buttonResetStyles = (0, emotion_1.css)({
115
- margin: 0,
116
- padding: 0,
117
- border: 'none',
118
- background: 'none',
119
- cursor: 'pointer',
120
- });
121
- const closeAIButtonStyles = (0, emotion_1.css)(buttonResetStyles, use_focus_ring_1.focusRing, {
122
- height: tokens_1.spacing[4] + tokens_1.spacing[1],
123
- display: 'flex',
124
- alignItems: 'center',
125
- padding: tokens_1.spacing[1],
126
- position: 'absolute',
127
- });
128
- const aiEntryContainerStyles = (0, emotion_1.css)({
129
- display: 'flex',
130
- });
131
- const closeText = 'Close AI Helper';
132
- const SubmitArrowSVG = ({ darkMode }) => (react_1.default.createElement("svg", { width: highlightSize, height: highlightSize, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
133
- react_1.default.createElement("rect", { width: "14", height: "14", rx: "2", fill: darkMode ? palette_1.palette.gray.dark1 : palette_1.palette.gray.light1 }),
134
- react_1.default.createElement("path", { d: "M5.24984 6.41668L2.9165 8.75001M2.9165 8.75001L5.24984 11.0833M2.9165 8.75001H9.33317C9.95201 8.75001 10.5455 8.50418 10.9831 8.06659C11.4207 7.62901 11.6665 7.03552 11.6665 6.41668C11.6665 5.79784 11.4207 5.20435 10.9831 4.76676C10.5455 4.32918 9.95201 4.08334 9.33317 4.08334H8.74984", stroke: darkMode ? palette_1.palette.gray.light1 : palette_1.palette.gray.dark1, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })));
135
- function GenerativeAIInput({ aiPromptText, didSucceed, errorMessage, isFetching, placeholder = 'Tell Compass what documents to find (e.g. which movies were released in 2000)', show, onCancelRequest, onClose, onChangeAIPromptText, onSubmitFeedback, onSubmitText, isAggregationGeneratedFromQuery = false, onResetIsAggregationGeneratedFromQuery, }) {
136
- const promptTextInputRef = (0, react_1.useRef)(null);
137
- const [showSuccess, setShowSuccess] = (0, react_1.useState)(false);
138
- const darkMode = (0, use_theme_1.useDarkMode)();
139
- const guideCueRef = (0, react_1.useRef)(null);
140
- const onTextInputKeyDown = (0, react_1.useCallback)((evt) => {
141
- if (evt.key === 'Enter') {
142
- evt.preventDefault();
143
- if (!aiPromptText) {
144
- return;
145
- }
146
- onSubmitText(aiPromptText);
147
- }
148
- else if (evt.key === 'Escape') {
149
- isFetching ? onCancelRequest() : onClose();
150
- }
151
- }, [aiPromptText, onClose, onSubmitText, isFetching, onCancelRequest]);
152
- (0, react_1.useEffect)(() => {
153
- if (didSucceed) {
154
- setShowSuccess(true);
155
- const timeoutId = setTimeout(() => {
156
- setShowSuccess(false);
157
- }, 1500);
158
- return () => clearTimeout(timeoutId);
159
- }
160
- }, [didSucceed]);
161
- (0, react_1.useEffect)(() => {
162
- if (show) {
163
- promptTextInputRef.current?.focus();
164
- }
165
- }, [show]);
166
- const onCancelRequestRef = (0, react_1.useRef)(onCancelRequest);
167
- onCancelRequestRef.current = onCancelRequest;
168
- (0, react_1.useEffect)(() => {
169
- return () => onCancelRequestRef.current?.();
170
- }, []);
171
- if (!show) {
172
- return null;
173
- }
174
- return (react_1.default.createElement("div", { className: containerStyles },
175
- react_1.default.createElement("div", { className: inputBarContainerStyles },
176
- react_1.default.createElement("div", { className: inputContainerStyles },
177
- react_1.default.createElement(leafygreen_1.TextInput, { className: textInputStyles, ref: promptTextInputRef, sizeVariant: "small", "data-testid": "ai-user-text-input", "aria-label": "Enter a plain text query that the AI will translate into MongoDB query language.", placeholder: placeholder, value: aiPromptText, onChange: (evt) => onChangeAIPromptText(evt.currentTarget.value), onKeyDown: onTextInputKeyDown }),
178
- react_1.default.createElement("div", { className: floatingButtonsContainerStyles },
179
- isFetching ? (react_1.default.createElement("div", { className: loaderContainerStyles },
180
- react_1.default.createElement(loader_1.SpinLoader, null))) : showSuccess ? (react_1.default.createElement("div", { className: loaderContainerStyles },
181
- react_1.default.createElement(leafygreen_1.Icon, { className: darkMode
182
- ? successIndicatorDarkModeStyles
183
- : successIndicatorLightModeStyles, glyph: "CheckmarkWithCircle" }))) : (react_1.default.createElement(react_1.default.Fragment, null, aiPromptText && (react_1.default.createElement(leafygreen_1.IconButton, { "aria-label": "Clear prompt", onClick: () => onChangeAIPromptText(''), "data-testid": "ai-text-clear-prompt" },
184
- react_1.default.createElement(leafygreen_1.Icon, { glyph: "X" }))))),
185
- react_1.default.createElement(leafygreen_1.Button, { size: "small", className: (0, emotion_1.cx)(generateButtonStyles, !darkMode && generateButtonLightModeStyles), disabled: !aiPromptText, "data-testid": "ai-generate-button", onClick: () => isFetching ? onCancelRequest() : onSubmitText(aiPromptText) }, isFetching ? (react_1.default.createElement(react_1.default.Fragment, null,
186
- react_1.default.createElement("div", null, "Cancel"),
187
- react_1.default.createElement("span", { className: (0, emotion_1.cx)(buttonHighlightStyles, darkMode
188
- ? buttonHighlightDarkModeStyles
189
- : buttonHighlightLightModeStyles) }, "esc"))) : (react_1.default.createElement(react_1.default.Fragment, null,
190
- react_1.default.createElement("div", null, "Generate"),
191
- react_1.default.createElement(SubmitArrowSVG, { darkMode: darkMode }))))),
192
- react_1.default.createElement("button", { className: closeAIButtonStyles, "data-testid": "close-ai-button", "aria-label": closeText, title: closeText, onClick: () => onClose() },
193
- react_1.default.createElement(ai_guide_cue_1.AIGuideCue, { showGuideCue: isAggregationGeneratedFromQuery, onCloseGuideCue: () => {
194
- onResetIsAggregationGeneratedFromQuery?.();
195
- }, refEl: guideCueRef, title: "Aggregation generated", description: "Your query requires stages from MongoDB's aggregation framework. Continue to work on it in our Aggregation Pipeline Builder" }),
196
- react_1.default.createElement("span", { className: aiEntryContainerStyles, ref: guideCueRef },
197
- react_1.default.createElement(ai_entry_svg_1.AIEntrySVG, { darkMode: darkMode })))),
198
- didSucceed && onSubmitFeedback && (react_1.default.createElement(ai_feedback_1.AIFeedback, { onSubmitFeedback: onSubmitFeedback }))),
199
- errorMessage && (react_1.default.createElement("div", { className: errorSummaryContainer },
200
- react_1.default.createElement(error_warning_summary_1.ErrorSummary, { "data-testid": "ai-error-msg", errors: errorMessage }, errorMessage)))));
201
- }
202
- exports.GenerativeAIInput = GenerativeAIInput;
203
- //# sourceMappingURL=generative-ai-input.js.map