@pingux/astro 2.107.0-alpha.1 → 2.107.0-alpha.3
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/lib/cjs/components/AIComponents/Attachment/Attachment.d.ts +5 -0
- package/lib/cjs/components/AIComponents/Attachment/Attachment.js +107 -0
- package/lib/cjs/components/AIComponents/Attachment/Attachment.styles.d.ts +22 -0
- package/lib/cjs/components/AIComponents/Attachment/Attachment.styles.js +31 -0
- package/lib/cjs/components/AIComponents/Attachment/index.d.ts +1 -0
- package/lib/cjs/components/AIComponents/Attachment/index.js +14 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptInput.d.ts +4 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptInput.js +147 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptInput.stories.d.ts +10 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptInput.stories.js +74 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptInput.test.d.ts +1 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptInput.test.js +225 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptUploadButton.d.ts +4 -0
- package/lib/cjs/components/AIComponents/PromptInput/PromptUploadButton.js +45 -0
- package/lib/cjs/components/AIComponents/PromptInput/index.d.ts +1 -0
- package/lib/cjs/components/AIComponents/PromptInput/index.js +14 -0
- package/lib/cjs/components/FileInputField/FileInputField.js +34 -22
- package/lib/cjs/components/FileInputField/FileInputField.test.js +9 -0
- package/lib/cjs/components/FileInputField/FileSelectIcon.d.ts +10 -0
- package/lib/cjs/components/FileInputField/FileSelectIcon.js +39 -0
- package/lib/cjs/index.d.ts +2 -0
- package/lib/cjs/index.js +16 -0
- package/lib/cjs/styles/themes/next-gen/convertedComponentList.js +1 -1
- package/lib/cjs/styles/themes/next-gen/next-gen.d.ts +79 -0
- package/lib/cjs/styles/themes/next-gen/variants/button.d.ts +58 -0
- package/lib/cjs/styles/themes/next-gen/variants/button.js +34 -1
- package/lib/cjs/styles/themes/next-gen/variants/input.js +19 -0
- package/lib/cjs/styles/themes/next-gen/variants/variants.d.ts +21 -0
- package/lib/cjs/styles/themes/next-gen/variants/variants.js +2 -0
- package/lib/cjs/types/promptInput.d.ts +42 -0
- package/lib/cjs/types/promptInput.js +6 -0
- package/lib/components/AIComponents/Attachment/Attachment.js +98 -0
- package/lib/components/AIComponents/Attachment/Attachment.styles.js +23 -0
- package/lib/components/AIComponents/Attachment/index.js +1 -0
- package/lib/components/AIComponents/PromptInput/PromptInput.js +133 -0
- package/lib/components/AIComponents/PromptInput/PromptInput.stories.js +61 -0
- package/lib/components/AIComponents/PromptInput/PromptInput.test.js +218 -0
- package/lib/components/AIComponents/PromptInput/PromptUploadButton.js +36 -0
- package/lib/components/AIComponents/PromptInput/index.js +1 -0
- package/lib/components/FileInputField/FileInputField.js +34 -22
- package/lib/components/FileInputField/FileInputField.test.js +9 -0
- package/lib/components/FileInputField/FileSelectIcon.js +30 -0
- package/lib/index.js +2 -0
- package/lib/styles/themes/next-gen/convertedComponentList.js +1 -1
- package/lib/styles/themes/next-gen/variants/button.js +34 -1
- package/lib/styles/themes/next-gen/variants/input.js +19 -0
- package/lib/styles/themes/next-gen/variants/variants.js +2 -0
- package/lib/types/promptInput.js +1 -0
- package/package.json +1 -1
@@ -0,0 +1,218 @@
|
|
1
|
+
import _typeof from "@babel/runtime-corejs3/helpers/esm/typeof";
|
2
|
+
import _asyncToGenerator from "@babel/runtime-corejs3/helpers/esm/asyncToGenerator";
|
3
|
+
import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
|
4
|
+
function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return exports; }; var exports = {}, Op = Object.prototype, hasOwn = Op.hasOwnProperty, defineProperty = _Object$defineProperty || function (obj, key, desc) { obj[key] = desc.value; }, $Symbol = "function" == typeof _Symbol ? _Symbol : {}, iteratorSymbol = $Symbol.iterator || "@@iterator", asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator", toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; function define(obj, key, value) { return _Object$defineProperty(obj, key, { value: value, enumerable: !0, configurable: !0, writable: !0 }), obj[key]; } try { define({}, ""); } catch (err) { define = function define(obj, key, value) { return obj[key] = value; }; } function wrap(innerFn, outerFn, self, tryLocsList) { var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator, generator = _Object$create(protoGenerator.prototype), context = new Context(tryLocsList || []); return defineProperty(generator, "_invoke", { value: makeInvokeMethod(innerFn, self, context) }), generator; } function tryCatch(fn, obj, arg) { try { return { type: "normal", arg: fn.call(obj, arg) }; } catch (err) { return { type: "throw", arg: err }; } } exports.wrap = wrap; var ContinueSentinel = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var IteratorPrototype = {}; define(IteratorPrototype, iteratorSymbol, function () { return this; }); var getProto = _Object$getPrototypeOf, NativeIteratorPrototype = getProto && getProto(getProto(values([]))); NativeIteratorPrototype && NativeIteratorPrototype !== Op && hasOwn.call(NativeIteratorPrototype, iteratorSymbol) && (IteratorPrototype = NativeIteratorPrototype); var Gp = GeneratorFunctionPrototype.prototype = Generator.prototype = _Object$create(IteratorPrototype); function defineIteratorMethods(prototype) { var _context7; _forEachInstanceProperty(_context7 = ["next", "throw", "return"]).call(_context7, function (method) { define(prototype, method, function (arg) { return this._invoke(method, arg); }); }); } function AsyncIterator(generator, PromiseImpl) { function invoke(method, arg, resolve, reject) { var record = tryCatch(generator[method], generator, arg); if ("throw" !== record.type) { var result = record.arg, value = result.value; return value && "object" == _typeof(value) && hasOwn.call(value, "__await") ? PromiseImpl.resolve(value.__await).then(function (value) { invoke("next", value, resolve, reject); }, function (err) { invoke("throw", err, resolve, reject); }) : PromiseImpl.resolve(value).then(function (unwrapped) { result.value = unwrapped, resolve(result); }, function (error) { return invoke("throw", error, resolve, reject); }); } reject(record.arg); } var previousPromise; defineProperty(this, "_invoke", { value: function value(method, arg) { function callInvokeWithMethodAndArg() { return new PromiseImpl(function (resolve, reject) { invoke(method, arg, resolve, reject); }); } return previousPromise = previousPromise ? previousPromise.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(innerFn, self, context) { var state = "suspendedStart"; return function (method, arg) { if ("executing" === state) throw new Error("Generator is already running"); if ("completed" === state) { if ("throw" === method) throw arg; return doneResult(); } for (context.method = method, context.arg = arg;;) { var delegate = context.delegate; if (delegate) { var delegateResult = maybeInvokeDelegate(delegate, context); if (delegateResult) { if (delegateResult === ContinueSentinel) continue; return delegateResult; } } if ("next" === context.method) context.sent = context._sent = context.arg;else if ("throw" === context.method) { if ("suspendedStart" === state) throw state = "completed", context.arg; context.dispatchException(context.arg); } else "return" === context.method && context.abrupt("return", context.arg); state = "executing"; var record = tryCatch(innerFn, self, context); if ("normal" === record.type) { if (state = context.done ? "completed" : "suspendedYield", record.arg === ContinueSentinel) continue; return { value: record.arg, done: context.done }; } "throw" === record.type && (state = "completed", context.method = "throw", context.arg = record.arg); } }; } function maybeInvokeDelegate(delegate, context) { var methodName = context.method, method = delegate.iterator[methodName]; if (undefined === method) return context.delegate = null, "throw" === methodName && delegate.iterator["return"] && (context.method = "return", context.arg = undefined, maybeInvokeDelegate(delegate, context), "throw" === context.method) || "return" !== methodName && (context.method = "throw", context.arg = new TypeError("The iterator does not provide a '" + methodName + "' method")), ContinueSentinel; var record = tryCatch(method, delegate.iterator, context.arg); if ("throw" === record.type) return context.method = "throw", context.arg = record.arg, context.delegate = null, ContinueSentinel; var info = record.arg; return info ? info.done ? (context[delegate.resultName] = info.value, context.next = delegate.nextLoc, "return" !== context.method && (context.method = "next", context.arg = undefined), context.delegate = null, ContinueSentinel) : info : (context.method = "throw", context.arg = new TypeError("iterator result is not an object"), context.delegate = null, ContinueSentinel); } function pushTryEntry(locs) { var entry = { tryLoc: locs[0] }; 1 in locs && (entry.catchLoc = locs[1]), 2 in locs && (entry.finallyLoc = locs[2], entry.afterLoc = locs[3]), this.tryEntries.push(entry); } function resetTryEntry(entry) { var record = entry.completion || {}; record.type = "normal", delete record.arg, entry.completion = record; } function Context(tryLocsList) { this.tryEntries = [{ tryLoc: "root" }], _forEachInstanceProperty(tryLocsList).call(tryLocsList, pushTryEntry, this), this.reset(!0); } function values(iterable) { if (iterable) { var iteratorMethod = iterable[iteratorSymbol]; if (iteratorMethod) return iteratorMethod.call(iterable); if ("function" == typeof iterable.next) return iterable; if (!isNaN(iterable.length)) { var i = -1, next = function next() { for (; ++i < iterable.length;) if (hasOwn.call(iterable, i)) return next.value = iterable[i], next.done = !1, next; return next.value = undefined, next.done = !0, next; }; return next.next = next; } } return { next: doneResult }; } function doneResult() { return { value: undefined, done: !0 }; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, defineProperty(Gp, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), defineProperty(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, toStringTagSymbol, "GeneratorFunction"), exports.isGeneratorFunction = function (genFun) { var ctor = "function" == typeof genFun && genFun.constructor; return !!ctor && (ctor === GeneratorFunction || "GeneratorFunction" === (ctor.displayName || ctor.name)); }, exports.mark = function (genFun) { return _Object$setPrototypeOf ? _Object$setPrototypeOf(genFun, GeneratorFunctionPrototype) : (genFun.__proto__ = GeneratorFunctionPrototype, define(genFun, toStringTagSymbol, "GeneratorFunction")), genFun.prototype = _Object$create(Gp), genFun; }, exports.awrap = function (arg) { return { __await: arg }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, asyncIteratorSymbol, function () { return this; }), exports.AsyncIterator = AsyncIterator, exports.async = function (innerFn, outerFn, self, tryLocsList, PromiseImpl) { void 0 === PromiseImpl && (PromiseImpl = _Promise); var iter = new AsyncIterator(wrap(innerFn, outerFn, self, tryLocsList), PromiseImpl); return exports.isGeneratorFunction(outerFn) ? iter : iter.next().then(function (result) { return result.done ? result.value : iter.next(); }); }, defineIteratorMethods(Gp), define(Gp, toStringTagSymbol, "Generator"), define(Gp, iteratorSymbol, function () { return this; }), define(Gp, "toString", function () { return "[object Generator]"; }), exports.keys = function (val) { var object = Object(val), keys = []; for (var key in object) keys.push(key); return _reverseInstanceProperty(keys).call(keys), function next() { for (; keys.length;) { var key = keys.pop(); if (key in object) return next.value = key, next.done = !1, next; } return next.done = !0, next; }; }, exports.values = values, Context.prototype = { constructor: Context, reset: function reset(skipTempReset) { var _context8; if (this.prev = 0, this.next = 0, this.sent = this._sent = undefined, this.done = !1, this.delegate = null, this.method = "next", this.arg = undefined, _forEachInstanceProperty(_context8 = this.tryEntries).call(_context8, resetTryEntry), !skipTempReset) for (var name in this) "t" === name.charAt(0) && hasOwn.call(this, name) && !isNaN(+_sliceInstanceProperty(name).call(name, 1)) && (this[name] = undefined); }, stop: function stop() { this.done = !0; var rootRecord = this.tryEntries[0].completion; if ("throw" === rootRecord.type) throw rootRecord.arg; return this.rval; }, dispatchException: function dispatchException(exception) { if (this.done) throw exception; var context = this; function handle(loc, caught) { return record.type = "throw", record.arg = exception, context.next = loc, caught && (context.method = "next", context.arg = undefined), !!caught; } for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i], record = entry.completion; if ("root" === entry.tryLoc) return handle("end"); if (entry.tryLoc <= this.prev) { var hasCatch = hasOwn.call(entry, "catchLoc"), hasFinally = hasOwn.call(entry, "finallyLoc"); if (hasCatch && hasFinally) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } else if (hasCatch) { if (this.prev < entry.catchLoc) return handle(entry.catchLoc, !0); } else { if (!hasFinally) throw new Error("try statement without catch or finally"); if (this.prev < entry.finallyLoc) return handle(entry.finallyLoc); } } } }, abrupt: function abrupt(type, arg) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc <= this.prev && hasOwn.call(entry, "finallyLoc") && this.prev < entry.finallyLoc) { var finallyEntry = entry; break; } } finallyEntry && ("break" === type || "continue" === type) && finallyEntry.tryLoc <= arg && arg <= finallyEntry.finallyLoc && (finallyEntry = null); var record = finallyEntry ? finallyEntry.completion : {}; return record.type = type, record.arg = arg, finallyEntry ? (this.method = "next", this.next = finallyEntry.finallyLoc, ContinueSentinel) : this.complete(record); }, complete: function complete(record, afterLoc) { if ("throw" === record.type) throw record.arg; return "break" === record.type || "continue" === record.type ? this.next = record.arg : "return" === record.type ? (this.rval = this.arg = record.arg, this.method = "return", this.next = "end") : "normal" === record.type && afterLoc && (this.next = afterLoc), ContinueSentinel; }, finish: function finish(finallyLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.finallyLoc === finallyLoc) return this.complete(entry.completion, entry.afterLoc), resetTryEntry(entry), ContinueSentinel; } }, "catch": function _catch(tryLoc) { for (var i = this.tryEntries.length - 1; i >= 0; --i) { var entry = this.tryEntries[i]; if (entry.tryLoc === tryLoc) { var record = entry.completion; if ("throw" === record.type) { var thrown = record.arg; resetTryEntry(entry); } return thrown; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(iterable, resultName, nextLoc) { return this.delegate = { iterator: values(iterable), resultName: resultName, nextLoc: nextLoc }, "next" === this.method && (this.arg = undefined), ContinueSentinel; } }, exports; }
|
5
|
+
import _URL from "@babel/runtime-corejs3/core-js-stable/url";
|
6
|
+
import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
|
7
|
+
import _Symbol from "@babel/runtime-corejs3/core-js-stable/symbol";
|
8
|
+
import _Object$create from "@babel/runtime-corejs3/core-js-stable/object/create";
|
9
|
+
import _Object$getPrototypeOf from "@babel/runtime-corejs3/core-js-stable/object/get-prototype-of";
|
10
|
+
import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
|
11
|
+
import _Object$setPrototypeOf from "@babel/runtime-corejs3/core-js-stable/object/set-prototype-of";
|
12
|
+
import _Promise from "@babel/runtime-corejs3/core-js-stable/promise";
|
13
|
+
import _reverseInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/reverse";
|
14
|
+
import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
|
15
|
+
import React, { useState } from 'react';
|
16
|
+
import GlobeIcon from '@pingux/mdi-react/GlobeIcon';
|
17
|
+
import { AstroProvider, NextGenTheme } from '../../..';
|
18
|
+
import { fireEvent, render, screen } from '../../../utils/testUtils/testWrapper';
|
19
|
+
import { getFileExtension } from '../Attachment/Attachment';
|
20
|
+
import PromptInput from './PromptInput';
|
21
|
+
import { jsx as ___EmotionJSX } from "@emotion/react";
|
22
|
+
var testFileURL = 'test-file-url';
|
23
|
+
var testFileName = 'chucknorris.png';
|
24
|
+
var testFile = new File(['(⌐□_□)'], testFileName, {
|
25
|
+
type: 'image/png'
|
26
|
+
});
|
27
|
+
var onSubmitCallback = jest.fn();
|
28
|
+
var onCancelCallback = jest.fn();
|
29
|
+
var onChangeCallback = jest.fn();
|
30
|
+
var onFileChangeCallback = jest.fn();
|
31
|
+
var PromptInputStory = function PromptInputStory(props) {
|
32
|
+
var _useState = useState(''),
|
33
|
+
_useState2 = _slicedToArray(_useState, 2),
|
34
|
+
value = _useState2[0],
|
35
|
+
setValue = _useState2[1];
|
36
|
+
return ___EmotionJSX(AstroProvider, {
|
37
|
+
themeOverrides: [NextGenTheme]
|
38
|
+
}, ___EmotionJSX(PromptInput, {
|
39
|
+
placeholder: "Enter a prompt here",
|
40
|
+
onChange: function onChange(e) {
|
41
|
+
setValue(e.target.value);
|
42
|
+
onChangeCallback(e);
|
43
|
+
},
|
44
|
+
onSubmit: onSubmitCallback,
|
45
|
+
onCancel: onCancelCallback,
|
46
|
+
onFileChange: onFileChangeCallback,
|
47
|
+
value: value,
|
48
|
+
"data-testid": "testid",
|
49
|
+
label: "chat prompt",
|
50
|
+
isLoading: props.isLoading,
|
51
|
+
attachmentProps: {
|
52
|
+
icon: props.attachmentIcon,
|
53
|
+
iconWrapperProps: {
|
54
|
+
'data-testid': 'icon-wrapper'
|
55
|
+
}
|
56
|
+
},
|
57
|
+
uploadButtonProps: {
|
58
|
+
'data-testid': 'upload button'
|
59
|
+
}
|
60
|
+
}));
|
61
|
+
};
|
62
|
+
var originalValue = _URL.createObjectURL;
|
63
|
+
beforeAll(function () {
|
64
|
+
_URL.createObjectURL = jest.fn(function () {
|
65
|
+
return testFileURL;
|
66
|
+
});
|
67
|
+
});
|
68
|
+
afterAll(function () {
|
69
|
+
_URL.createObjectURL = originalValue;
|
70
|
+
});
|
71
|
+
afterEach(function () {
|
72
|
+
jest.resetAllMocks();
|
73
|
+
});
|
74
|
+
test('prompt is rendered', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
|
75
|
+
var input;
|
76
|
+
return _regeneratorRuntime().wrap(function _callee$(_context) {
|
77
|
+
while (1) switch (_context.prev = _context.next) {
|
78
|
+
case 0:
|
79
|
+
render(___EmotionJSX(PromptInputStory, null));
|
80
|
+
input = screen.getByTestId('testid');
|
81
|
+
expect(input).toBeInTheDocument();
|
82
|
+
case 3:
|
83
|
+
case "end":
|
84
|
+
return _context.stop();
|
85
|
+
}
|
86
|
+
}, _callee);
|
87
|
+
})));
|
88
|
+
test('onChange and value props work correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
|
89
|
+
var input, testValue;
|
90
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
91
|
+
while (1) switch (_context2.prev = _context2.next) {
|
92
|
+
case 0:
|
93
|
+
render(___EmotionJSX(PromptInputStory, null));
|
94
|
+
input = screen.getByTestId('prompt-input');
|
95
|
+
testValue = 'test input';
|
96
|
+
fireEvent.change(input, {
|
97
|
+
target: {
|
98
|
+
value: testValue
|
99
|
+
}
|
100
|
+
});
|
101
|
+
expect(input).toHaveValue(testValue);
|
102
|
+
expect(onChangeCallback).toHaveBeenCalledTimes(1);
|
103
|
+
case 6:
|
104
|
+
case "end":
|
105
|
+
return _context2.stop();
|
106
|
+
}
|
107
|
+
}, _callee2);
|
108
|
+
})));
|
109
|
+
test('onSubmit prop works correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
|
110
|
+
var input, button, testValue;
|
111
|
+
return _regeneratorRuntime().wrap(function _callee3$(_context3) {
|
112
|
+
while (1) switch (_context3.prev = _context3.next) {
|
113
|
+
case 0:
|
114
|
+
render(___EmotionJSX(PromptInputStory, null));
|
115
|
+
input = screen.getByTestId('prompt-input');
|
116
|
+
button = screen.getByTestId('upload button');
|
117
|
+
testValue = 'test input';
|
118
|
+
fireEvent.change(input, {
|
119
|
+
target: {
|
120
|
+
value: testValue
|
121
|
+
}
|
122
|
+
});
|
123
|
+
fireEvent.mouseDown(button);
|
124
|
+
fireEvent.mouseUp(button);
|
125
|
+
expect(onSubmitCallback).toHaveBeenCalledTimes(1);
|
126
|
+
case 8:
|
127
|
+
case "end":
|
128
|
+
return _context3.stop();
|
129
|
+
}
|
130
|
+
}, _callee3);
|
131
|
+
})));
|
132
|
+
test('onCancel prop works correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4() {
|
133
|
+
var input, button, testValue;
|
134
|
+
return _regeneratorRuntime().wrap(function _callee4$(_context4) {
|
135
|
+
while (1) switch (_context4.prev = _context4.next) {
|
136
|
+
case 0:
|
137
|
+
render(___EmotionJSX(PromptInputStory, {
|
138
|
+
isLoading: true
|
139
|
+
}));
|
140
|
+
input = screen.getByTestId('prompt-input');
|
141
|
+
button = screen.getByTestId('upload button');
|
142
|
+
testValue = 'test input';
|
143
|
+
fireEvent.change(input, {
|
144
|
+
target: {
|
145
|
+
value: testValue
|
146
|
+
}
|
147
|
+
});
|
148
|
+
fireEvent.mouseDown(button);
|
149
|
+
fireEvent.mouseUp(button);
|
150
|
+
expect(onCancelCallback).toHaveBeenCalledTimes(1);
|
151
|
+
case 8:
|
152
|
+
case "end":
|
153
|
+
return _context4.stop();
|
154
|
+
}
|
155
|
+
}, _callee4);
|
156
|
+
})));
|
157
|
+
test('should add and remove a file attachment', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5() {
|
158
|
+
var fileInput, removeButton;
|
159
|
+
return _regeneratorRuntime().wrap(function _callee5$(_context5) {
|
160
|
+
while (1) switch (_context5.prev = _context5.next) {
|
161
|
+
case 0:
|
162
|
+
render(___EmotionJSX(PromptInputStory, {
|
163
|
+
attachmentIcon: GlobeIcon
|
164
|
+
}));
|
165
|
+
fileInput = screen.getAllByLabelText('add attachment')[0];
|
166
|
+
fireEvent.change(fileInput, {
|
167
|
+
target: {
|
168
|
+
files: [testFile]
|
169
|
+
}
|
170
|
+
});
|
171
|
+
expect(onFileChangeCallback).toHaveBeenCalledTimes(1);
|
172
|
+
expect(screen.getByText(testFileName)).toBeInTheDocument();
|
173
|
+
expect(screen.getByTestId('icon-wrapper')).toBeInTheDocument();
|
174
|
+
removeButton = screen.getByTestId('remove-attachment');
|
175
|
+
fireEvent.mouseDown(removeButton);
|
176
|
+
fireEvent.mouseUp(removeButton);
|
177
|
+
expect(onFileChangeCallback).toHaveBeenCalledTimes(2);
|
178
|
+
expect(screen.queryByText(testFileName)).not.toBeInTheDocument();
|
179
|
+
expect(screen.queryByTestId('icon-wrapper')).not.toBeInTheDocument();
|
180
|
+
case 12:
|
181
|
+
case "end":
|
182
|
+
return _context5.stop();
|
183
|
+
}
|
184
|
+
}, _callee5);
|
185
|
+
})));
|
186
|
+
test('should use default icon if no icon is provided', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee6() {
|
187
|
+
var fileInput, removeButton;
|
188
|
+
return _regeneratorRuntime().wrap(function _callee6$(_context6) {
|
189
|
+
while (1) switch (_context6.prev = _context6.next) {
|
190
|
+
case 0:
|
191
|
+
render(___EmotionJSX(PromptInputStory, null));
|
192
|
+
fileInput = screen.getAllByLabelText('add attachment')[0];
|
193
|
+
fireEvent.change(fileInput, {
|
194
|
+
target: {
|
195
|
+
files: [testFile]
|
196
|
+
}
|
197
|
+
});
|
198
|
+
expect(onFileChangeCallback).toHaveBeenCalledTimes(1);
|
199
|
+
expect(screen.getByText(testFileName)).toBeInTheDocument();
|
200
|
+
expect(screen.getByTestId('icon-wrapper')).toBeInTheDocument();
|
201
|
+
removeButton = screen.getByTestId('remove-attachment');
|
202
|
+
fireEvent.mouseDown(removeButton);
|
203
|
+
fireEvent.mouseUp(removeButton);
|
204
|
+
expect(onFileChangeCallback).toHaveBeenCalledTimes(2);
|
205
|
+
expect(screen.queryByText(testFileName)).not.toBeInTheDocument();
|
206
|
+
expect(screen.queryByTestId('icon-wrapper')).not.toBeInTheDocument();
|
207
|
+
case 12:
|
208
|
+
case "end":
|
209
|
+
return _context6.stop();
|
210
|
+
}
|
211
|
+
}, _callee6);
|
212
|
+
})));
|
213
|
+
test('regex expression', function () {
|
214
|
+
var string = 'alongiflename.txt';
|
215
|
+
expect(getFileExtension(string)).toBe('txt');
|
216
|
+
var badString = 'alongfilename.rtrtrert...';
|
217
|
+
expect(getFileExtension(badString)).toBe('unknown file type');
|
218
|
+
});
|
@@ -0,0 +1,36 @@
|
|
1
|
+
import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
|
2
|
+
import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
|
3
|
+
var _excluded = ["isLoading", "onCancel", "onSubmit", "value", "uploadButtonContainerProps"];
|
4
|
+
import React from 'react';
|
5
|
+
import ArrowUpIcon from '@pingux/mdi-react/ArrowUpIcon';
|
6
|
+
import StopIcon from '@pingux/mdi-react/StopIcon';
|
7
|
+
import { Box, Icon, IconButton } from '../../../index';
|
8
|
+
import { jsx as ___EmotionJSX } from "@emotion/react";
|
9
|
+
var PromptUploadButton = function PromptUploadButton(props) {
|
10
|
+
var isLoading = props.isLoading,
|
11
|
+
onCancel = props.onCancel,
|
12
|
+
onSubmit = props.onSubmit,
|
13
|
+
value = props.value,
|
14
|
+
uploadButtonContainerProps = props.uploadButtonContainerProps,
|
15
|
+
others = _objectWithoutProperties(props, _excluded);
|
16
|
+
var onPress = function onPress(e) {
|
17
|
+
if (isLoading && onCancel) {
|
18
|
+
onCancel(e);
|
19
|
+
} else if (onSubmit) {
|
20
|
+
onSubmit(e);
|
21
|
+
}
|
22
|
+
};
|
23
|
+
return ___EmotionJSX(Box, uploadButtonContainerProps, ___EmotionJSX(IconButton, _extends({
|
24
|
+
"aria-label": "upload chat",
|
25
|
+
isDisabled: !isLoading && value.length === 0,
|
26
|
+
variant: "inverted",
|
27
|
+
sx: {
|
28
|
+
size: '24px'
|
29
|
+
},
|
30
|
+
onPress: onPress
|
31
|
+
}, others), ___EmotionJSX(Icon, {
|
32
|
+
size: "xs",
|
33
|
+
icon: isLoading ? StopIcon : ArrowUpIcon
|
34
|
+
})));
|
35
|
+
};
|
36
|
+
export default PromptUploadButton;
|
@@ -0,0 +1 @@
|
|
1
|
+
export { default } from './PromptInput';
|
@@ -9,7 +9,7 @@ import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
|
|
9
9
|
import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
|
10
10
|
import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
|
11
11
|
import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
|
12
|
-
var _excluded = ["defaultButtonText", "defaultFileList", "fileList", "helperText", "isDisabled", "isLoading", "isMultiple", "onFileSelect", "onRemove", "status", "textProps"];
|
12
|
+
var _excluded = ["buttonProps", "defaultButtonText", "defaultFileList", "fileList", "helperText", "iconContainerProps", "iconProps", "isDisabled", "isIconButton", "isLoading", "isMultiple", "label", "onFileSelect", "onRemove", "status", "textProps"];
|
13
13
|
import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
|
14
14
|
import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
|
15
15
|
import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
|
@@ -34,25 +34,31 @@ import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAtt
|
|
34
34
|
import { statusDefaultProp, statusPropTypes } from '../../utils/docUtils/statusProp';
|
35
35
|
import FileItem from './FileItem';
|
36
36
|
import FileSelect from './FileSelect';
|
37
|
+
import FileSelectIcon from './FileSelectIcon';
|
37
38
|
import { jsx as ___EmotionJSX } from "@emotion/react";
|
38
39
|
var displayName = 'FileInputField';
|
39
40
|
var FILE_CHANGE_STATUS = {
|
40
41
|
ADDED: 'added',
|
41
42
|
DELETED: 'deleted'
|
42
43
|
};
|
43
|
-
var FileInputField = /*#__PURE__*/forwardRef(function (
|
44
|
-
var
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
44
|
+
var FileInputField = /*#__PURE__*/forwardRef(function (props, ref) {
|
45
|
+
var buttonProps = props.buttonProps,
|
46
|
+
defaultButtonText = props.defaultButtonText,
|
47
|
+
defaultFileList = props.defaultFileList,
|
48
|
+
uploadedFilesImperative = props.fileList,
|
49
|
+
helperText = props.helperText,
|
50
|
+
iconContainerProps = props.iconContainerProps,
|
51
|
+
iconProps = props.iconProps,
|
52
|
+
isDisabled = props.isDisabled,
|
53
|
+
isIconButton = props.isIconButton,
|
54
|
+
isLoading = props.isLoading,
|
55
|
+
isMultiple = props.isMultiple,
|
56
|
+
label = props.label,
|
57
|
+
onFileSelect = props.onFileSelect,
|
58
|
+
onRemove = props.onRemove,
|
59
|
+
status = props.status,
|
60
|
+
textProps = props.textProps,
|
61
|
+
others = _objectWithoutProperties(props, _excluded);
|
56
62
|
var _useState = useState(defaultFileList || []),
|
57
63
|
_useState2 = _slicedToArray(_useState, 2),
|
58
64
|
uploadedFiles = _useState2[0],
|
@@ -75,8 +81,9 @@ var FileInputField = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
75
81
|
nonAriaProps = _getAriaAttributeProp.nonAriaProps;
|
76
82
|
var _useField = useField(_objectSpread({
|
77
83
|
status: status,
|
78
|
-
isDisabled: isDisabled
|
79
|
-
|
84
|
+
isDisabled: isDisabled,
|
85
|
+
label: label
|
86
|
+
}, props)),
|
80
87
|
fieldContainerProps = _useField.fieldContainerProps,
|
81
88
|
fieldControlInputProps = _useField.fieldControlInputProps,
|
82
89
|
fieldControlWrapperProps = _useField.fieldControlWrapperProps,
|
@@ -154,8 +161,8 @@ var FileInputField = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
154
161
|
onRemove(e, fileId);
|
155
162
|
}
|
156
163
|
setUploadedFiles(function (prevFiles) {
|
157
|
-
return _filterInstanceProperty(prevFiles).call(prevFiles, function (
|
158
|
-
var id =
|
164
|
+
return _filterInstanceProperty(prevFiles).call(prevFiles, function (_ref) {
|
165
|
+
var id = _ref.id;
|
159
166
|
return id !== fileId;
|
160
167
|
});
|
161
168
|
});
|
@@ -194,7 +201,7 @@ var FileInputField = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
194
201
|
}, [uploadedFiles, uploadedFilesImperative, isMultiple]);
|
195
202
|
return ___EmotionJSX(Box, {
|
196
203
|
fieldContainerProps: fieldContainerProps
|
197
|
-
}, ___EmotionJSX(Label, fieldLabelProps), ___EmotionJSX(Box, _extends({
|
204
|
+
}, label && ___EmotionJSX(Label, fieldLabelProps), ___EmotionJSX(Box, _extends({
|
198
205
|
variant: "forms.fileInputField.wrapper"
|
199
206
|
}, getPendoID(displayName), mergeProps(fieldControlWrapperProps, nonAriaProps), {
|
200
207
|
className: classNames
|
@@ -202,17 +209,22 @@ var FileInputField = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
202
209
|
// to pass accessibility test, this removes focusable dependents
|
203
210
|
role: "none"
|
204
211
|
}), ___EmotionJSX(Input, _extends({}, mergeProps(visuallyHiddenProps, fieldControlInputProps, getInputProps()), {
|
205
|
-
"aria-label": "File Input",
|
206
212
|
multiple: isMultiple,
|
207
213
|
onChange: handleOnChange,
|
208
214
|
ref: inputRef,
|
209
215
|
type: "file"
|
210
|
-
})), filesListNode, shouldFileSelectRender() && ___EmotionJSX(
|
216
|
+
})), filesListNode, shouldFileSelectRender() && (isIconButton ? ___EmotionJSX(FileSelectIcon, _extends({
|
217
|
+
handleFileSelect: handleFileSelect,
|
218
|
+
iconContainerProps: iconContainerProps,
|
219
|
+
buttonProps: buttonProps,
|
220
|
+
iconProps: iconProps,
|
221
|
+
isDisabled: isDisabled || isLoading
|
222
|
+
}, ariaProps)) : ___EmotionJSX(FileSelect, _extends({
|
211
223
|
buttonText: defaultButtonText,
|
212
224
|
handleFileSelect: handleFileSelect,
|
213
225
|
isDisabled: isDisabled || isLoading,
|
214
226
|
textProps: textProps
|
215
|
-
}, ariaProps)), isLoading && ___EmotionJSX(Loader, {
|
227
|
+
}, ariaProps))), isLoading && ___EmotionJSX(Loader, {
|
216
228
|
color: "active",
|
217
229
|
sx: {
|
218
230
|
position: 'absolute'
|
@@ -209,4 +209,13 @@ test('should display helper text if passed', function () {
|
|
209
209
|
helperText: testHelperText
|
210
210
|
});
|
211
211
|
expect(screen.getByText(testHelperText)).toBeInTheDocument();
|
212
|
+
});
|
213
|
+
test('should render icon button if isIconButton prop is true', function () {
|
214
|
+
getComponent({
|
215
|
+
isIconButton: true
|
216
|
+
});
|
217
|
+
var iconButton = screen.getByRole('button', {
|
218
|
+
name: 'Add File Icon'
|
219
|
+
});
|
220
|
+
expect(iconButton).toBeInTheDocument();
|
212
221
|
});
|
@@ -0,0 +1,30 @@
|
|
1
|
+
import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
|
2
|
+
import _objectWithoutProperties from "@babel/runtime-corejs3/helpers/esm/objectWithoutProperties";
|
3
|
+
var _excluded = ["handleFileSelect", "iconContainerProps", "buttonProps", "iconProps"];
|
4
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
5
|
+
import React from 'react';
|
6
|
+
import { mergeProps } from 'react-aria';
|
7
|
+
import AddIcon from '@pingux/mdi-react/AddIcon';
|
8
|
+
import { Box, Icon, IconButton } from '../../index';
|
9
|
+
import { jsx as ___EmotionJSX } from "@emotion/react";
|
10
|
+
var FileSelectIcon = function FileSelectIcon(props) {
|
11
|
+
var handleFileSelect = props.handleFileSelect,
|
12
|
+
iconContainerProps = props.iconContainerProps,
|
13
|
+
buttonProps = props.buttonProps,
|
14
|
+
iconProps = props.iconProps,
|
15
|
+
others = _objectWithoutProperties(props, _excluded);
|
16
|
+
return ___EmotionJSX(Box, iconContainerProps, ___EmotionJSX(IconButton, _extends({
|
17
|
+
onPress: handleFileSelect
|
18
|
+
}, mergeProps(buttonProps, others)), ___EmotionJSX(Icon, _extends({
|
19
|
+
title: {
|
20
|
+
name: 'Add File Icon'
|
21
|
+
},
|
22
|
+
icon: AddIcon,
|
23
|
+
sx: {
|
24
|
+
borderRadius: '50%',
|
25
|
+
border: '2px solid',
|
26
|
+
borderColor: 'gray-800'
|
27
|
+
}
|
28
|
+
}, iconProps))));
|
29
|
+
};
|
30
|
+
export default FileSelectIcon;
|
package/lib/index.js
CHANGED
@@ -12,7 +12,9 @@ export { default as AccordionItem } from './components/AccordionItem';
|
|
12
12
|
export * from './components/AccordionItem';
|
13
13
|
export { default as AIPanel } from './components/AIComponents/AIPanel/AIPanel';
|
14
14
|
export { default as AIPanelHeader } from './components/AIComponents/AIPanel/AIPanelHeader';
|
15
|
+
export { default as Attachment } from './components/AIComponents/Attachment';
|
15
16
|
export { default as Prompt } from './components/AIComponents/Prompt';
|
17
|
+
export { default as PromptInput } from './components/AIComponents/PromptInput';
|
16
18
|
export { default as Response } from './components/AIComponents/Response';
|
17
19
|
export { default as ResponseAttachment } from './components/AIComponents/Response/ResponseAttachment';
|
18
20
|
export { default as ResponseList } from './components/AIComponents/Response/ResponseList';
|
@@ -9,5 +9,5 @@ export var componentSpecificNextGenBlacklist = {
|
|
9
9
|
TextField: ['Success'],
|
10
10
|
OverlayPanel: ['Expandable']
|
11
11
|
};
|
12
|
-
export var nextGenOnlyComponents = ['NavigationHeader', 'Prompt', 'AI Panel', 'Response', 'Suggestions'];
|
12
|
+
export var nextGenOnlyComponents = ['NavigationHeader', 'Prompt', 'AI Panel', 'Response', 'Suggestions', 'Prompt Input'];
|
13
13
|
export default nextGenConvertedComponents;
|
@@ -287,7 +287,40 @@ var iconButtons = {
|
|
287
287
|
outlineOffset: '1px'
|
288
288
|
})
|
289
289
|
}),
|
290
|
-
copyButton: copyButton
|
290
|
+
copyButton: copyButton,
|
291
|
+
deleteAttachment: _objectSpread(_objectSpread({}, baseIconButton), {}, {
|
292
|
+
backgroundColor: 'white',
|
293
|
+
border: '1px solid',
|
294
|
+
borderColor: 'gray-300',
|
295
|
+
size: '24px',
|
296
|
+
p: '4px'
|
297
|
+
}),
|
298
|
+
inverted: {
|
299
|
+
cursor: 'pointer',
|
300
|
+
transition: 'color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out',
|
301
|
+
outline: 'none',
|
302
|
+
path: {
|
303
|
+
fill: 'white'
|
304
|
+
},
|
305
|
+
'&.is-focused': {
|
306
|
+
outline: '2px solid',
|
307
|
+
outlineColor: 'primary',
|
308
|
+
outlineOffset: '3px'
|
309
|
+
},
|
310
|
+
'&.is-pressed': {
|
311
|
+
backgroundColor: chroma.mix(primaryBlue, 'black', 0.125, 'rgb').hex(),
|
312
|
+
borderColor: chroma.mix(primaryBlue, 'black', 0.125, 'rgb').hex()
|
313
|
+
},
|
314
|
+
'&.is-hovered': {
|
315
|
+
border: 'none !important',
|
316
|
+
boxShadow: 'none !important',
|
317
|
+
borderColor: 'none !important',
|
318
|
+
backgroundColor: chroma.mix(primaryBlue, 'black', 0.075, 'rgb').hex()
|
319
|
+
},
|
320
|
+
'&.is-disabled': {
|
321
|
+
backgroundColor: 'gray-300'
|
322
|
+
}
|
323
|
+
}
|
291
324
|
};
|
292
325
|
var buttons = {
|
293
326
|
neutral: neutral,
|
@@ -21,6 +21,7 @@ var readOnlyandDisabledStyles = {
|
|
21
21
|
};
|
22
22
|
export var input = {
|
23
23
|
fontSize: 'md',
|
24
|
+
fontFamily: 'standard',
|
24
25
|
p: '0.75rem',
|
25
26
|
backgroundColor: 'background.base',
|
26
27
|
borderColor: 'border.input',
|
@@ -30,6 +31,15 @@ export var input = {
|
|
30
31
|
height: '50px',
|
31
32
|
'&::placeholder': text.placeholder
|
32
33
|
};
|
34
|
+
input.promptInput = _objectSpread(_objectSpread({}, input), {}, {
|
35
|
+
pl: '0px',
|
36
|
+
border: 'none',
|
37
|
+
outline: 'none !important',
|
38
|
+
'&.is-focused': {
|
39
|
+
border: 'none !important',
|
40
|
+
outline: 'none !important'
|
41
|
+
}
|
42
|
+
});
|
33
43
|
input.search = _objectSpread(_objectSpread({}, input), {}, {
|
34
44
|
'&.is-disabled': _objectSpread(_objectSpread({}, readOnlyandDisabledStyles), {}, {
|
35
45
|
'> input': _objectSpread({}, readOnlyandDisabledStyles)
|
@@ -99,6 +109,15 @@ export var fieldControlWrapper = {
|
|
99
109
|
}
|
100
110
|
};
|
101
111
|
input.fieldControlWrapper = _objectSpread({}, fieldControlWrapper);
|
112
|
+
input.promptInputWrapper = _objectSpread(_objectSpread({}, fieldControlWrapper), {}, {
|
113
|
+
border: '1px solid',
|
114
|
+
borderColor: 'border.input',
|
115
|
+
px: '.75rem',
|
116
|
+
borderRadius: '4px',
|
117
|
+
'&.is-focused': {
|
118
|
+
boxShadow: '0 1px 1px rgba(0,0,0,.075), 0 0 0 .0625rem blue'
|
119
|
+
}
|
120
|
+
});
|
102
121
|
input.multivaluesWrapper = _objectSpread(_objectSpread({}, fieldControlWrapper), {}, {
|
103
122
|
borderColor: 'border.input',
|
104
123
|
borderStyle: 'solid',
|
@@ -9,6 +9,7 @@ import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object
|
|
9
9
|
import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
|
10
10
|
function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
11
11
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
|
12
|
+
import attachment from '../../../../components/AIComponents/Attachment/Attachment.styles';
|
12
13
|
import codeView from '../codeView/codeView';
|
13
14
|
import { avatar } from './avatar';
|
14
15
|
import button from './button';
|
@@ -301,6 +302,7 @@ var overlayPanel = {
|
|
301
302
|
}
|
302
303
|
};
|
303
304
|
export default {
|
305
|
+
attachment: attachment,
|
304
306
|
navBar: navBar,
|
305
307
|
fieldHelperText: fieldHelperText,
|
306
308
|
message: message,
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|