@pingux/astro 2.115.0 → 2.115.1-alpha.0

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

@@ -41,6 +41,8 @@ var PromptInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var attachmentProps = props.attachmentProps,
     isFullScreen = props.isFullScreen,
     isLoading = props.isLoading,
+    _props$isUploadButton = props.isUploadButtonHidden,
+    isUploadButtonHidden = _props$isUploadButton === void 0 ? false : _props$isUploadButton,
     fileInputButtonProps = props.fileInputButtonProps,
     valueProp = props.value,
     defaultValueProp = props.defaultValue,
@@ -188,7 +190,7 @@ var PromptInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   }, fieldControlInputProps, {
     onKeyUp: onKeyUp,
     onKeyDown: onKeyDown
-  })), (0, _react2.jsx)(_index.Box, {
+  })), !isUploadButtonHidden && (0, _react2.jsx)(_index.Box, {
     sx: {
       mx: '.75rem',
       mb: 'auto'

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

@@ -2,8 +2,17 @@ import React from 'react';
 declare const _default: {
     title: string;
     component: React.ForwardRefExoticComponent<import("../../../types/promptInput").PromptInputProps & React.RefAttributes<HTMLInputElement>>;
+    parameters: {
+        docs: {
+            page: () => React.JSX.Element;
+            source: {
+                type: string;
+            };
+        };
+    };
     argTypes: {
         isLoading: any;
+        isUploadButtonHidden: any;
     };
 };
 export default _default;

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

@@ -19,9 +19,11 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/e
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
+var _storybookDocsLayout = _interopRequireDefault(require("../../../../.storybook/storybookDocsLayout"));
 var _ = require("../../..");
 var _docArgTypes = require("../../../utils/docUtils/docArgTypes");
 var _PromptInput = _interopRequireDefault(require("./PromptInput"));
+var _PromptInputReadMe = _interopRequireDefault(require("./PromptInputReadMe.mdx"));
 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; }
@@ -30,8 +32,19 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 var _default = {
   title: 'Ai Components/Prompt Input',
   component: _PromptInput["default"],
+  parameters: {
+    docs: {
+      page: function page() {
+        return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_PromptInputReadMe["default"], null), (0, _react2.jsx)(_storybookDocsLayout["default"], null));
+      },
+      source: {
+        type: 'code'
+      }
+    }
+  },
   argTypes: {
-    isLoading: _objectSpread({}, _docArgTypes.booleanArg)
+    isLoading: _objectSpread({}, _docArgTypes.booleanArg),
+    isUploadButtonHidden: _objectSpread({}, _docArgTypes.booleanArg)
   }
 };
 exports["default"] = _default;

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

@@ -134,6 +134,15 @@ test('onSubmit prop works correctly', /*#__PURE__*/(0, _asyncToGenerator2["defau
     }
   }, _callee2);
 })));
+test('', function () {
+  getComponent({
+    isUploadButtonHidden: true,
+    uploadButtonProps: {
+      'data-testid': buttonTestId
+    }
+  });
+  expect(_testWrapper.screen.queryByText(buttonTestId)).not.toBeInTheDocument();
+});
 test('onCancel prop works correctly', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
   var control;
   return _regeneratorRuntime().wrap(function _callee3$(_context3) {

package/lib/cjs/components/AIComponents/PromptInput/PromptInputReadMe.mdx

@@ -0,0 +1,71 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/PromptInput" />
+
+# PromptInput
+
+The `PromptInput` component is used to capture user input in a conversational UI. It supports text input, file attachments, and customizable actions like submission or cancellation.
+
+### Recommended Use
+
+- Use the `PromptInput` component to collect user input in chat-like interfaces.
+- Attach files or documents to the input using the file attachment feature.
+
+### Features
+
+- **Text Input**: Allows users to type text with dynamic height adjustment based on content.
+- **File Attachments**: Supports adding and removing file attachments.
+- **Customizable Actions**: Includes `onSubmit`, `onCancel`, `onKeyDown`, and `onKeyUp` handlers for custom behavior.
+
+### Props
+
+| Prop                  | Type                 | Description                                                                 |
+| --------------------- | -------------------- | --------------------------------------------------------------------------- |
+| `value`               | `string`            | The controlled value of the input.                                          |
+| `defaultValue`        | `string`            | The default value of the input.                                             |
+| `onSubmit`            | `function`          | Callback triggered when the input is submitted.                             |
+| `onCancel`            | `function`          | Callback triggered when the input is canceled.                              |
+| `onKeyDown`           | `function`          | Callback triggered on key down events.                                      |
+| `onKeyUp`             | `function`          | Callback triggered on key up events.                                        |
+| `onFileChange`        | `function`          | Callback triggered when files are added or removed.                         |
+| `attachmentProps`     | `object`            | Props passed to the `Attachment` component for file attachments.            |
+| `fileInputButtonProps`| `object`            | Props passed to the file input button.                                       |
+| `uploadButtonProps`   | `object`            | Props passed to the upload button.                                          |
+| `isLoading`           | `boolean`           | Indicates whether the input is in a loading state.                          |
+
+### Accessibility
+
+This component adheres to accessibility guidelines to ensure a better user experience for all users.
+
+#### Keyboard Navigation
+
+| Keys         | Function                                                                 |
+| ------------ | ----------------------------------------------------------------------- |
+| Tab          | Focuses on the next focusable element within the input.                 |
+| Shift + Tab  | Moves focus to the previous focusable element.                          |
+| Enter        | Submits the input when `onSubmit` is defined.                           |
+| Shift + Enter| Adds a new line to the input.                           |
+| Escape       | Cancels the input when `onCancel` is defined.                           |
+
+#### Screen Readers
+
+- **`aria-label`**: Describes the purpose of the input field.
+- **`aria-disabled`**: Indicates when the input is disabled.
+- **`aria-live`**: Announces changes to the input dynamically.
+
+### Example Usage
+
+```jsx
+<PromptInput
+  value=""
+  onSubmit={(e, value) => console.log('Submitted:', value)}
+  onCancel={(e) => console.log('Canceled')}
+  onFileChange={(files) => console.log('Files:', files)}
+  attachmentProps={{
+    icon: GlobeIcon,
+  }}
+  uploadButtonProps={{
+    'aria-label': 'Upload',
+  }}
+  isLoading={false}
+/>

package/lib/cjs/types/promptInput.d.ts

@@ -18,6 +18,7 @@ export interface PromptProps {
 export interface PromptInputProps extends TextFieldProps, PromptProps {
     onKeyUp?: (e: React.KeyboardEvent, value?: string) => void;
     onKeyDown?: (e: React.KeyboardEvent, value?: string) => void;
+    isUploadButtonHidden?: boolean;
 }
 export interface AttachmentProps {
     title: string;

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

@@ -29,6 +29,8 @@ var PromptInput = /*#__PURE__*/forwardRef(function (props, ref) {
   var attachmentProps = props.attachmentProps,
     isFullScreen = props.isFullScreen,
     isLoading = props.isLoading,
+    _props$isUploadButton = props.isUploadButtonHidden,
+    isUploadButtonHidden = _props$isUploadButton === void 0 ? false : _props$isUploadButton,
     fileInputButtonProps = props.fileInputButtonProps,
     valueProp = props.value,
     defaultValueProp = props.defaultValue,
@@ -176,7 +178,7 @@ var PromptInput = /*#__PURE__*/forwardRef(function (props, ref) {
   }, fieldControlInputProps, {
     onKeyUp: onKeyUp,
     onKeyDown: onKeyDown
-  })), ___EmotionJSX(Box, {
+  })), !isUploadButtonHidden && ___EmotionJSX(Box, {
     sx: {
       mx: '.75rem',
       mb: 'auto'

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

@@ -12,15 +12,28 @@ import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 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) { _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; }
 import React, { useState } from 'react';
+import DocsLayout from '../../../../.storybook/storybookDocsLayout';
 import { AstroProvider, Box, NextGenTheme } from '../../..';
 import { booleanArg } from '../../../utils/docUtils/docArgTypes';
 import PromptInput from './PromptInput';
+import PromptInputReadMe from './PromptInputReadMe.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 export default {
   title: 'Ai Components/Prompt Input',
   component: PromptInput,
+  parameters: {
+    docs: {
+      page: function page() {
+        return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(PromptInputReadMe, null), ___EmotionJSX(DocsLayout, null));
+      },
+      source: {
+        type: 'code'
+      }
+    }
+  },
   argTypes: {
-    isLoading: _objectSpread({}, booleanArg)
+    isLoading: _objectSpread({}, booleanArg),
+    isUploadButtonHidden: _objectSpread({}, booleanArg)
   }
 };
 export var Default = function Default(args) {

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

@@ -131,6 +131,15 @@ test('onSubmit prop works correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE_
     }
   }, _callee2);
 })));
+test('', function () {
+  getComponent({
+    isUploadButtonHidden: true,
+    uploadButtonProps: {
+      'data-testid': buttonTestId
+    }
+  });
+  expect(screen.queryByText(buttonTestId)).not.toBeInTheDocument();
+});
 test('onCancel prop works correctly', /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
   var control;
   return _regeneratorRuntime().wrap(function _callee3$(_context3) {

package/lib/components/AIComponents/PromptInput/PromptInputReadMe.mdx

@@ -0,0 +1,71 @@
+import { Meta } from '@storybook/addon-docs';
+
+<Meta title="Components/PromptInput" />
+
+# PromptInput
+
+The `PromptInput` component is used to capture user input in a conversational UI. It supports text input, file attachments, and customizable actions like submission or cancellation.
+
+### Recommended Use
+
+- Use the `PromptInput` component to collect user input in chat-like interfaces.
+- Attach files or documents to the input using the file attachment feature.
+
+### Features
+
+- **Text Input**: Allows users to type text with dynamic height adjustment based on content.
+- **File Attachments**: Supports adding and removing file attachments.
+- **Customizable Actions**: Includes `onSubmit`, `onCancel`, `onKeyDown`, and `onKeyUp` handlers for custom behavior.
+
+### Props
+
+| Prop                  | Type                 | Description                                                                 |
+| --------------------- | -------------------- | --------------------------------------------------------------------------- |
+| `value`               | `string`            | The controlled value of the input.                                          |
+| `defaultValue`        | `string`            | The default value of the input.                                             |
+| `onSubmit`            | `function`          | Callback triggered when the input is submitted.                             |
+| `onCancel`            | `function`          | Callback triggered when the input is canceled.                              |
+| `onKeyDown`           | `function`          | Callback triggered on key down events.                                      |
+| `onKeyUp`             | `function`          | Callback triggered on key up events.                                        |
+| `onFileChange`        | `function`          | Callback triggered when files are added or removed.                         |
+| `attachmentProps`     | `object`            | Props passed to the `Attachment` component for file attachments.            |
+| `fileInputButtonProps`| `object`            | Props passed to the file input button.                                       |
+| `uploadButtonProps`   | `object`            | Props passed to the upload button.                                          |
+| `isLoading`           | `boolean`           | Indicates whether the input is in a loading state.                          |
+
+### Accessibility
+
+This component adheres to accessibility guidelines to ensure a better user experience for all users.
+
+#### Keyboard Navigation
+
+| Keys         | Function                                                                 |
+| ------------ | ----------------------------------------------------------------------- |
+| Tab          | Focuses on the next focusable element within the input.                 |
+| Shift + Tab  | Moves focus to the previous focusable element.                          |
+| Enter        | Submits the input when `onSubmit` is defined.                           |
+| Shift + Enter| Adds a new line to the input.                           |
+| Escape       | Cancels the input when `onCancel` is defined.                           |
+
+#### Screen Readers
+
+- **`aria-label`**: Describes the purpose of the input field.
+- **`aria-disabled`**: Indicates when the input is disabled.
+- **`aria-live`**: Announces changes to the input dynamically.
+
+### Example Usage
+
+```jsx
+<PromptInput
+  value=""
+  onSubmit={(e, value) => console.log('Submitted:', value)}
+  onCancel={(e) => console.log('Canceled')}
+  onFileChange={(files) => console.log('Files:', files)}
+  attachmentProps={{
+    icon: GlobeIcon,
+  }}
+  uploadButtonProps={{
+    'aria-label': 'Upload',
+  }}
+  isLoading={false}
+/>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.115.0",
+  "version": "2.115.1-alpha.0",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",