@pingux/astro 2.219.0 → 2.220.0

package/lib/components/ImageUploadField/ImageUploadField.js

@@ -6,40 +6,49 @@ import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/inst
 import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors";
 import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
 import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
-import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _extends from "@babel/runtime-corejs3/helpers/esm/extends";
+import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
-import React, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';
+import React, { forwardRef, useCallback } from 'react';
 import { VisuallyHidden } from '@react-aria/visually-hidden';
-import PropTypes from 'prop-types';
 import { v4 as uuid } from 'uuid';
 import { Item, Menu } from '../..';
+import { useLocalOrForwardRef } from '../../hooks';
 import { useImageUploadState } from '../../hooks/useImageUploadState';
-import { imageUploadPropTypes } from '../../utils/devUtils/constants/htmlElements';
 import { getPendoID } from '../../utils/devUtils/constants/pendoID';
-import { ariaAttributesBasePropTypes } from '../../utils/docUtils/ariaAttributes';
-import { inputFieldAttributesBasePropTypes } from '../../utils/docUtils/fieldAttributes';
-import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import ImagePreviewButton from './ImagePreviewButton';
 import ImageUploadFieldBase from './ImageUploadFieldBase';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var displayName = 'ImageUploadField';
 var ImageUploadField = /*#__PURE__*/forwardRef(function (props, ref) {
+  var _state$defaultPreview, _state$previewImage;
   var isLoading = props.isLoading,
-    loaderSize = props.loaderSize,
+    _props$loaderSize = props.loaderSize,
+    loaderSize = _props$loaderSize === void 0 ? 10 : _props$loaderSize,
     onRemove = props.onRemove,
-    removeItemText = props.removeItemText,
-    uploadItemText = props.uploadItemText;
-  var inputRef = useRef();
-  var state = useImageUploadState(inputRef, props);
+    _props$previewHeight = props.previewHeight,
+    previewHeight = _props$previewHeight === void 0 ? 50 : _props$previewHeight,
+    _props$previewWidth = props.previewWidth,
+    previewWidth = _props$previewWidth === void 0 ? 50 : _props$previewWidth,
+    _props$removeItemText = props.removeItemText,
+    removeItemText = _props$removeItemText === void 0 ? 'Remove Image' : _props$removeItemText,
+    _props$uploadItemText = props.uploadItemText,
+    uploadItemText = _props$uploadItemText === void 0 ? 'Upload New Image' : _props$uploadItemText;
+
   /* istanbul ignore next */
-  useImperativeHandle(ref, function () {
-    return inputRef.current;
+  var inputRef = useLocalOrForwardRef(ref);
+  // Cast props to the hook's internal interface: defaultPreviewImage narrows to string|null,
+  // previewHeight/previewWidth are treated as strings internally. Spread the destructured
+  // (defaulted) previewHeight/previewWidth so the hook receives the defaults when not provided.
+  var propsWithDefaults = _objectSpread(_objectSpread({}, props), {}, {
+    previewHeight: previewHeight,
+    previewWidth: previewWidth
   });
+  var stateProps = propsWithDefaults;
+  var state = useImageUploadState(inputRef, stateProps);
   var statusId = uuid();
   var onAction = useCallback(function (action) {
-    // eslint-disable-next-line default-case
     switch (action) {
       case 'upload':
         {
@@ -54,8 +63,10 @@ var ImageUploadField = /*#__PURE__*/forwardRef(function (props, ref) {
           }
           break;
         }
+      default:
+        break;
     }
-  }, [state.showFileDialog, props === null || props === void 0 ? void 0 : props.onRemove, state.removePreview]);
+  }, [state.showFileDialog, onRemove, state.removePreview]);
   return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(ImageUploadFieldBase, _extends({
     fileName: state.fileName,
     handleInputChange: state.handleInputChange,
@@ -63,18 +74,16 @@ var ImageUploadField = /*#__PURE__*/forwardRef(function (props, ref) {
     handleOpenMenuChange: state.handleOpenMenuChange,
     isImageType: state.isImageType,
     isMenuOpen: state.isMenuOpen,
-    ref: inputRef,
-    widthHeightSx: state.widthHeightSx
+    ref: inputRef
   }, getPendoID(displayName), props), ___EmotionJSX(ImagePreviewButton, {
-    defaultPreviewImage: state.defaultPreviewImage,
+    defaultPreviewImage: (_state$defaultPreview = state.defaultPreviewImage) !== null && _state$defaultPreview !== void 0 ? _state$defaultPreview : undefined,
     defaultPreviewNode: state.defaultPreviewNode,
     isImageType: state.isImageType,
     isLoading: isLoading,
     loaderSize: loaderSize,
     onPress: state.pressPreviewButton,
-    previewHeight: props === null || props === void 0 ? void 0 : props.previewHeight,
-    previewImage: state.previewImage,
-    previewWidth: props === null || props === void 0 ? void 0 : props.previewWidth,
+    previewImage: (_state$previewImage = state.previewImage) !== null && _state$previewImage !== void 0 ? _state$previewImage : undefined,
+    previewWidth: previewWidth,
     widthHeightSx: state.widthHeightSx,
     "aria-haspopup": state.isMenuOpen
   }), ___EmotionJSX(Menu, {
@@ -93,50 +102,5 @@ var ImageUploadField = /*#__PURE__*/forwardRef(function (props, ref) {
     id: statusId
   }, state.isMenuOpen && 'Menu pop up expanded'));
 });
-ImageUploadField.propTypes = _objectSpread(_objectSpread(_objectSpread({
-  /** Image preview (controlled), used to represent the current image state. */
-  previewImage: PropTypes.string,
-  /** Text that renders in the upload menu item. */
-  uploadItemText: PropTypes.string,
-  /** Text that renders in the remove menu item. */
-  removeItemText: PropTypes.string,
-  /** Default image preview (uncontrolled), used when no previewImage is present. */
-  defaultPreviewImage: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-  /** An array of accepted file types.
-   * (according to the https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types#types ) */
-  fileTypes: PropTypes.arrayOf(PropTypes.oneOf(imageUploadPropTypes)),
-  /** Text to display after the radio group label. Useful for errors or other info. */
-  helperText: PropTypes.node,
-  /** Determines whether the loading indicator is shown. */
-  isLoading: PropTypes.bool,
-  /** Defines a string value that labels the current element. */
-  label: PropTypes.string,
-  /** The handler that is called when the input file is added.
-   *
-   * `(event: InputEvent) => void`
-   * */
-  onChange: PropTypes.func,
-  /** Loading indicator size */
-  loaderSize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  /** The handler that is called when the file is removed.
-   *
-   * `(event: InputEvent) => void`
-   * */
-  onRemove: PropTypes.func,
-  /** Props that will be passed to the Popover Menu. */
-  popoverMenuProps: PropTypes.shape({}),
-  /** Define component height */
-  previewHeight: PropTypes.number,
-  /** Define component height */
-  previewWidth: PropTypes.number
-}, statusPropTypes), ariaAttributesBasePropTypes), inputFieldAttributesBasePropTypes);
-ImageUploadField.defaultProps = {
-  fileTypes: ['image'],
-  loaderSize: 10,
-  previewHeight: 50,
-  previewWidth: 50,
-  uploadItemText: 'Upload New Image',
-  removeItemText: 'Remove Image'
-};
 ImageUploadField.displayName = displayName;
 export default ImageUploadField;

package/lib/components/ImageUploadField/ImageUploadFieldBase.js

@@ -11,16 +11,13 @@ import _defineProperty from "@babel/runtime-corejs3/helpers/esm/defineProperty";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
 function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymbols) { var o = _Object$getOwnPropertySymbols(e); r && (o = _filterInstanceProperty(o).call(o, function (r) { return _Object$getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty(_context2 = ownKeys(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(e, _Object$getOwnPropertyDescriptors(t)) : _forEachInstanceProperty(_context3 = ownKeys(Object(t))).call(_context3, function (r) { _Object$defineProperty(e, r, _Object$getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React, { forwardRef, useRef } from 'react';
 import { useVisuallyHidden } from 'react-aria';
 import omit from 'lodash/omit';
-import PropTypes from 'prop-types';
 import { Box, FieldHelperText, Input, Label, PopoverMenu } from '../..';
 import useField from '../../hooks/useField';
-import { imageUploadPropTypes } from '../../utils/devUtils/constants/htmlElements';
 import statuses from '../../utils/devUtils/constants/statuses';
-import { statusPropTypes } from '../../utils/docUtils/statusProp';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var ImageUploadFieldBase = /*#__PURE__*/forwardRef(function (props, inputRef) {
   var children = props.children,
@@ -34,16 +31,17 @@ var ImageUploadFieldBase = /*#__PURE__*/forwardRef(function (props, inputRef) {
     isMenuOpen = props.isMenuOpen,
     popoverMenuProps = props.popoverMenuProps,
     status = props.status;
-  var _useField = useField(_objectSpread({}, omit(props, ['onRemove']))),
+  var _useField = useField(_objectSpread({}, omit(props, ['onRemove', 'helperText']))),
     fieldContainerProps = _useField.fieldContainerProps,
     fieldControlInputProps = _useField.fieldControlInputProps,
     fieldControlWrapperProps = _useField.fieldControlWrapperProps,
     fieldLabelProps = _useField.fieldLabelProps;
-  var labelRef = useRef();
+  var labelRef = useRef(null);
   var _useVisuallyHidden = useVisuallyHidden(),
     visuallyHiddenProps = _useVisuallyHidden.visuallyHiddenProps;
   var getAcceptableInputTypes = function getAcceptableInputTypes() {
-    return _mapInstanceProperty(fileTypes).call(fileTypes, function (type) {
+    var _context;
+    return _mapInstanceProperty(_context = fileTypes !== null && fileTypes !== void 0 ? fileTypes : []).call(_context, function (type) {
       return _includesInstanceProperty(type).call(type, '/') ? type : "".concat(type, "/*");
     }).join(', ');
   };
@@ -52,7 +50,7 @@ var ImageUploadFieldBase = /*#__PURE__*/forwardRef(function (props, inputRef) {
   }, fieldContainerProps), ___EmotionJSX(Label, _extends({}, fieldLabelProps, {
     onClick: handleLabelClick,
     ref: labelRef,
-    tabIndex: "-1"
+    tabIndex: -1
   })), ___EmotionJSX(PopoverMenu, _extends({
     isOpen: isMenuOpen,
     onOpenChange: handleOpenMenuChange
@@ -72,16 +70,5 @@ var ImageUploadFieldBase = /*#__PURE__*/forwardRef(function (props, inputRef) {
     status: status
   }, helperText));
 });
-ImageUploadFieldBase.propTypes = _objectSpread({
-  fileName: PropTypes.string,
-  fileTypes: PropTypes.arrayOf(PropTypes.oneOf(imageUploadPropTypes)),
-  handleInputChange: PropTypes.func,
-  handleLabelClick: PropTypes.func,
-  handleOpenMenuChange: PropTypes.func,
-  helperText: PropTypes.node,
-  isImageType: PropTypes.bool,
-  isMenuOpen: PropTypes.bool,
-  popoverMenuProps: PropTypes.shape({})
-}, statusPropTypes);
 ImageUploadFieldBase.displayName = 'ImageUploadFieldBase';
 export default ImageUploadFieldBase;

package/lib/components/PanelHeader/PanelHeader.styles.js

@@ -15,7 +15,8 @@ var container = {
   borderBottomColor: 'accent.90',
   borderBottomStyle: 'solid',
   justifyContent: 'center',
-  minHeight: 60
+  minHeight: 60,
+  overflow: 'hidden'
 };
 var emptyData = {
   flexShrink: 0,
@@ -39,6 +40,8 @@ var wrapper = {
 };
 var rightOfData = {
   alignSelf: 'center',
+  flex: '1 1 0',
+  minWidth: 0,
   mr: 'md'
 };
 var iconWrapper = {

package/lib/styles/themes/next-gen/variants/variants.js

@@ -363,6 +363,9 @@ var loader = {
   }
 };
 var breadcrumb = {
+  containerOl: {
+    gap: 'md'
+  },
   link: {
     fontWeight: 2,
     fontSize: 'lg'

package/lib/types/datePicker.js

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

package/lib/types/imageUploadField.js

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

package/lib/types/index.js

@@ -15,6 +15,7 @@ export * from './collapsiblePanel';
 export * from './colorField';
 export * from './copyText';
 export * from './dataTable';
+export * from './datePicker';
 export * from './environmentBreadcrumb';
 export * from './expandableText';
 export * from './fieldHelperText';
@@ -26,6 +27,7 @@ export * from './iconBadge';
 export * from './iconButton';
 export * from './iconButtonToggle';
 export * from './iconWrapper';
+export * from './imageUploadField';
 export * from './input';
 export * from './item';
 export * from './label';

package/lib/utils/devUtils/props/isDateWithinRanges.js

@@ -1,11 +1,10 @@
 import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
 import _someInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/some";
 import { parseDate } from '@internationalized/date';
-
 /**
  * Checks if a given date is within any of the ranges.
- * @param {Date} date - The date to be checked.
- * @param {Array<Array<string>>} ranges - An array of date ranges to compare against.
+ * @param {DateValue} date - The date to be checked.
+ * @param {[string, string][]} ranges - An array of date ranges to compare against.
  * Each range should be an array with two string elements representing the start and end dates.
  * @returns {boolean} - `true` if the date is within any of the unavailable ranges,
  * `false` otherwise.

package/package.json

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