@pingux/astro 2.107.0-alpha.2 → 2.107.0-alpha.4

package/lib/cjs/components/AIComponents/Attachment/Attachment.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { AttachmentProps } from '../../../types/promptInput';
+export declare const getFileExtension: (fullString: string) => string;
+declare const Attachment: (props: AttachmentProps) => React.JSX.Element;
+export default Attachment;

package/lib/cjs/components/AIComponents/Attachment/Attachment.js

@@ -0,0 +1,107 @@
+"use strict";
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getFileExtension = exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+var _CloseIcon = _interopRequireDefault(require("@pingux/mdi-react/CloseIcon"));
+var _PaperOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/PaperOutlineIcon"));
+var _hooks = require("../../../hooks");
+var _index = require("../../../index");
+var _react2 = require("@emotion/react");
+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; }
+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) { (0, _defineProperty2["default"])(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; }
+var getFileExtension = function getFileExtension(fullString) {
+  var fileExtensionPattern = /\.([0-9a-z]+)(?:[?#]|$)/i;
+  var ext = fullString.match(fileExtensionPattern);
+  if (ext) {
+    return ext[1];
+  }
+  return 'unknown file type';
+};
+exports.getFileExtension = getFileExtension;
+var Attachment = function Attachment(props) {
+  var title = props.title,
+    fileType = props.fileType,
+    removeFile = props.removeFile,
+    isFullScreen = props.isFullScreen,
+    className = props.className,
+    id = props.id,
+    containerProps = props.containerProps,
+    iconWrapperProps = props.iconWrapperProps,
+    _props$icon = props.icon,
+    icon = _props$icon === void 0 ? _PaperOutlineIcon["default"] : _props$icon,
+    deleteButtonProps = props.deleteButtonProps;
+  var _useStatusClasses = (0, _hooks.useStatusClasses)(className, {
+      isFullScreen: isFullScreen
+    }),
+    classNames = _useStatusClasses.classNames;
+  return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
+    variant: "attachment.container",
+    className: classNames
+  }, containerProps), (0, _react2.jsx)(_index.Box, {
+    isRow: true,
+    alignItems: "center",
+    px: "lg",
+    py: "md"
+  }, (0, _react2.jsx)(_index.IconWrapper, {
+    isCircle: true,
+    title: {
+      name: 'File Icon'
+    },
+    icon: icon,
+    color: "red",
+    size: "sm",
+    wrapperProps: _objectSpread({
+      size: '36px',
+      minHeight: '36px',
+      minWidth: '36px',
+      p: '9px'
+    }, iconWrapperProps)
+  }), (0, _react2.jsx)(_index.Box, {
+    sx: {
+      ml: 'md'
+    }
+  }, (0, _react2.jsx)(_index.Text, {
+    as: "h5",
+    sx: {
+      fontWeight: 2,
+      textOverflow: 'ellipsis',
+      whiteSpace: 'nowrap',
+      overflow: 'hidden'
+    }
+  }, title), (0, _react2.jsx)(_index.Text, {
+    sx: {
+      textOverflow: 'ellipsis'
+    },
+    variant: "small"
+  }, fileType.toLocaleUpperCase()))), (0, _react2.jsx)(_index.Box, {
+    variant: "attachment.iconWrapper"
+  }, (0, _react2.jsx)(_index.IconButton, (0, _extends2["default"])({
+    "aria-label": "remove attachment",
+    "data-testid": "remove-attachment",
+    onPress: function onPress() {
+      return removeFile(id);
+    },
+    variant: "deleteAttachment"
+  }, deleteButtonProps), (0, _react2.jsx)(_index.Icon, {
+    title: {
+      name: 'Remove Attachment Icon'
+    },
+    icon: _CloseIcon["default"]
+  }))));
+};
+var _default = Attachment;
+exports["default"] = _default;

package/lib/cjs/components/AIComponents/Attachment/Attachment.styles.d.ts

@@ -0,0 +1,22 @@
+declare const _default: {
+    container: {
+        backgroundColor: string;
+        mt: string;
+        borderRadius: string;
+        border: string;
+        borderColor: string;
+        position: string;
+        maxWidth: string;
+        minWidth: string;
+        '&.is-full-screen': {
+            maxWidth: string;
+            minWidth: string;
+        };
+    };
+    iconWrapper: {
+        position: string;
+        top: string;
+        right: string;
+    };
+};
+export default _default;

package/lib/cjs/components/AIComponents/Attachment/Attachment.styles.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var container = {
+  backgroundColor: 'light',
+  mt: '12px',
+  borderRadius: '16px',
+  border: '1px solid',
+  borderColor: 'gray-200',
+  position: 'relative',
+  maxWidth: '15rem',
+  minWidth: '15rem',
+  '&.is-full-screen': {
+    maxWidth: '20rem',
+    minWidth: '20rem'
+  }
+};
+var iconWrapper = {
+  position: 'absolute',
+  top: '-8px',
+  right: '-8px'
+};
+var _default = {
+  container: container,
+  iconWrapper: iconWrapper
+};
+exports["default"] = _default;

package/lib/cjs/components/AIComponents/Attachment/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Attachment';

package/lib/cjs/components/AIComponents/Attachment/index.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+_Object$defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _Attachment["default"];
+  }
+});
+var _Attachment = _interopRequireDefault(require("./Attachment"));

package/lib/cjs/components/AIComponents/PromptInput/PromptInput.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { PromptInputProps } from '../../../types/promptInput';
+declare const PromptInput: React.ForwardRefExoticComponent<PromptInputProps & React.RefAttributes<HTMLInputElement>>;
+export default PromptInput;

package/lib/cjs/components/AIComponents/PromptInput/PromptInput.js

@@ -0,0 +1,147 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _from = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/from"));
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+var _url = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/url"));
+var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
+var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _uuid = require("uuid");
+var _hooks = require("../../../hooks");
+var _index = require("../../../index");
+var _statuses = _interopRequireDefault(require("../../../utils/devUtils/constants/statuses"));
+var _Attachment = _interopRequireWildcard(require("../Attachment/Attachment"));
+var _PromptUploadButton = _interopRequireDefault(require("./PromptUploadButton"));
+var _react2 = require("@emotion/react");
+var _excluded = ["attachmentProps", "onFileChange", "isFullScreen", "isLoading", "fileInputButtonProps", "value", "onCancel", "onSubmit", "uploadButtonContainerProps", "uploadButtonProps"];
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var PromptInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+  var attachmentProps = props.attachmentProps,
+    onFileChange = props.onFileChange,
+    isFullScreen = props.isFullScreen,
+    isLoading = props.isLoading,
+    fileInputButtonProps = props.fileInputButtonProps,
+    value = props.value,
+    onCancel = props.onCancel,
+    onSubmit = props.onSubmit,
+    uploadButtonContainerProps = props.uploadButtonContainerProps,
+    uploadButtonProps = props.uploadButtonProps,
+    others = (0, _objectWithoutProperties2["default"])(props, _excluded);
+  var firstUpdate = (0, _react.useRef)(true);
+  var _useState = (0, _react.useState)([]),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    userFiles = _useState2[0],
+    setUserFiles = _useState2[1];
+  var handleFileSelect = function handleFileSelect(event, files) {
+    var arrayWithNewFiles = (0, _from["default"])(files);
+    var filesWithIdAndLink = (0, _map["default"])(arrayWithNewFiles).call(arrayWithNewFiles, function (newFile) {
+      return {
+        fileObj: newFile,
+        name: newFile.name,
+        id: (0, _uuid.v4)(),
+        downloadLink: _url["default"].createObjectURL(newFile),
+        status: _statuses["default"].DEFAULT,
+        fileType: (0, _Attachment.getFileExtension)(newFile.name)
+      };
+    });
+    setUserFiles(function (prevFiles) {
+      var _context;
+      return (0, _concat["default"])(_context = []).call(_context, prevFiles, filesWithIdAndLink);
+    });
+  };
+  (0, _react.useEffect)(function () {
+    if (firstUpdate.current) {
+      firstUpdate.current = false;
+      return;
+    }
+    if (onFileChange) {
+      onFileChange(userFiles);
+    }
+  }, [userFiles, onFileChange]);
+  var handleFileRemove = function handleFileRemove(id) {
+    setUserFiles((0, _filter["default"])(userFiles).call(userFiles, function (_file) {
+      return _file.id !== id;
+    }));
+  };
+  var _useField = (0, _hooks.useField)(others),
+    fieldContainerProps = _useField.fieldContainerProps,
+    fieldControlInputProps = _useField.fieldControlInputProps,
+    fieldControlWrapperProps = _useField.fieldControlWrapperProps;
+  var inputRef = (0, _hooks.useLocalOrForwardRef)(ref);
+  return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
+    variant: "forms.input.fieldContainer"
+  }, fieldContainerProps), (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
+    variant: "forms.input.promptInputWrapper"
+  }, fieldControlWrapperProps), (0, _react2.jsx)(_index.Box, {
+    isRow: true,
+    gap: "1.5rem",
+    sx: {
+      overflowX: 'auto',
+      overflowY: 'hidden',
+      whiteSpace: 'nowrap'
+    }
+  }, (0, _map["default"])(userFiles).call(userFiles, function (_ref) {
+    var name = _ref.name,
+      fileType = _ref.fileType,
+      id = _ref.id;
+    return (0, _react2.jsx)(_Attachment["default"], (0, _extends2["default"])({
+      key: id,
+      title: name,
+      fileType: fileType,
+      removeFile: handleFileRemove,
+      id: id,
+      isFullScreen: isFullScreen
+    }, attachmentProps));
+  })), (0, _react2.jsx)(_index.Box, {
+    isRow: true,
+    alignItems: "center",
+    justifyContent: "center",
+    flexGrow: "1"
+  }, (0, _react2.jsx)(_index.Box, {
+    mr: "md"
+  }, (0, _react2.jsx)(_index.FileInputField, (0, _extends2["default"])({
+    onFileSelect: handleFileSelect,
+    onRemove: handleFileRemove,
+    fileList: [],
+    isIconButton: true,
+    buttonProps: {
+      sx: {
+        size: '24px',
+        padding: '0px'
+      }
+    },
+    sx: {
+      width: 'fit-content',
+      border: 'none',
+      p: '0px'
+    },
+    "aria-label": "add attachment"
+  }, fileInputButtonProps))), (0, _react2.jsx)(_index.Input, (0, _extends2["default"])({
+    ref: inputRef
+  }, fieldControlInputProps, {
+    variant: "forms.input.promptInput",
+    "data-testid": "prompt-input"
+  })), (0, _react2.jsx)(_PromptUploadButton["default"], (0, _extends2["default"])({
+    isLoading: isLoading,
+    value: value,
+    onSubmit: onSubmit,
+    onCancel: onCancel
+  }, uploadButtonProps, {
+    uploadButtonContainerProps: uploadButtonContainerProps
+  })))));
+});
+var _default = PromptInput;
+exports["default"] = _default;

package/lib/cjs/components/AIComponents/PromptInput/PromptInput.stories.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+declare const _default: {
+    title: string;
+    component: React.ForwardRefExoticComponent<import("../../../types/promptInput").PromptInputProps & React.RefAttributes<HTMLInputElement>>;
+    argTypes: {
+        isLoading: any;
+    };
+};
+export default _default;
+export declare const Default: (args: any) => React.JSX.Element;

package/lib/cjs/components/AIComponents/PromptInput/PromptInput.stories.js

@@ -0,0 +1,74 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _ = require("../../..");
+var _docArgTypes = require("../../../utils/docUtils/docArgTypes");
+var _PromptInput = _interopRequireDefault(require("./PromptInput"));
+var _react2 = require("@emotion/react");
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+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; }
+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) { (0, _defineProperty2["default"])(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; }
+var _default = {
+  title: 'Ai Components/Prompt Input',
+  component: _PromptInput["default"],
+  argTypes: {
+    isLoading: _objectSpread({}, _docArgTypes.booleanArg)
+  }
+};
+exports["default"] = _default;
+var Default = function Default(args) {
+  var _useState = (0, _react.useState)(''),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  var _useState3 = (0, _react.useState)([]),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    attachments = _useState4[0],
+    setAttachments = _useState4[1];
+  var onFileChange = function onFileChange(files) {
+    console.log(files);
+    setAttachments(files);
+  };
+  var onCancel = function onCancel(event) {
+    console.log(event);
+  };
+  var onSubmit = function onSubmit(event) {
+    console.log(event);
+    console.log(attachments);
+  };
+  return (0, _react2.jsx)(_.AstroProvider, {
+    themeOverrides: [_.NextGenTheme]
+  }, (0, _react2.jsx)(_.Box, {
+    maxWidth: "768px"
+  }, (0, _react2.jsx)(_PromptInput["default"], (0, _extends2["default"])({}, args, {
+    placeholder: "Enter a prompt here",
+    onChange: function onChange(e) {
+      return setValue(e.target.value);
+    },
+    value: value,
+    "aria-label": "test",
+    onFileChange: onFileChange,
+    onSubmit: onSubmit,
+    onCancel: onCancel
+  }))));
+};
+exports.Default = Default;

package/lib/cjs/components/AIComponents/PromptInput/PromptInput.test.d.ts

@@ -0,0 +1 @@
+export {};