@pingux/astro 2.219.0 → 2.220.0

package/lib/cjs/components/DatePicker/DatePicker.styles.js

@@ -19,7 +19,9 @@ function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymb
 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) { (0, _defineProperty2["default"])(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; }
 var inSlotContainer = _objectSpread(_objectSpread({}, _Input.input.fieldControlWrapper), {}, {
   position: 'relative',
-  width: 'fit-content'
+  // Override the parent fieldContainer's '> .is-default { width: 100% }' rule
+  // because it has higher specificity.
+  width: 'fit-content !important'
 });
 var inputField = _objectSpread(_objectSpread({}, _Input.input), {}, {
   width: 'auto',

package/lib/cjs/components/DatePicker/DatePicker.test.js

@@ -229,9 +229,9 @@ test('should be able to select dates', /*#__PURE__*/(0, _asyncToGenerator2["defa
         year = inputButtons[0];
         month = inputButtons[1];
         day = inputButtons[2];
-        expect(month).toHaveTextContent(8);
-        expect(day).toHaveTextContent(1);
-        expect(year).toHaveTextContent(2022);
+        expect(month).toHaveTextContent('8');
+        expect(day).toHaveTextContent('1');
+        expect(year).toHaveTextContent('2022');
         expect(_testWrapper.screen.queryByTestId('date-field')).toHaveValue('2022-08-01');
       case 18:
       case "end":
@@ -382,7 +382,7 @@ test('date picker with controlled value to change default value and clear any se
         _context6.next = 16;
         return _userEvent["default"].click(changeButton);
       case 16:
-        expect(day).toHaveTextContent(10);
+        expect(day).toHaveTextContent('10');
         _context6.next = 19;
         return _userEvent["default"].click(clearButton);
       case 19:

package/lib/cjs/components/DatePicker/DateSegment.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { DateSegmentProps } from '../../types';
+/**
+ * Each editable segment of date.
+ */
+declare const DateSegment: React.ForwardRefExoticComponent<DateSegmentProps & React.RefAttributes<HTMLElement>>;
+export default DateSegment;

package/lib/cjs/components/DatePicker/DateSegment.js

@@ -14,20 +14,20 @@ var _padStart = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-s
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _datepicker = require("@react-aria/datepicker");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _index = require("../../index");
 var _react2 = require("@emotion/react");
 function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 /**
  * Each editable segment of date.
- */var DateSegment = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+ */
+var DateSegment = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var isLocalEnUS = props.isLocalEnUS,
     segment = props.segment,
     state = props.state,
     handlePaste = props.handlePaste,
     segments = props.segments,
     segmentIndex = props.segmentIndex;
-  var segmentRef = (0, _react.useRef)();
+  var segmentRef = (0, _react.useRef)(null);
   // istanbul ignore next
   (0, _react.useImperativeHandle)(ref, function () {
     return segmentRef.current;
@@ -66,36 +66,25 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var
     }
     return null;
   }, [focusManager, segment, isPlaceholder]);
+  var displayText = text;
+  if (text === '/') {
+    displayText = '-';
+  } else {
+    var padLength = 0;
+    if (isLocalEnUS) {
+      if (type === 'year') {
+        padLength = 4;
+      } else {
+        padLength = 2;
+      }
+    }
+    displayText = (0, _padStart["default"])(text).call(text, padLength, '0');
+  }
   return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({}, segmentProps, {
     ref: segmentRef,
     variant: "forms.datePicker.segment",
     onKeyUp: handleKeyEvents,
     onPaste: handlePaste
-  }), text === '/' ? '-' : (0, _padStart["default"])(text).call(text, isLocalEnUS && (type === 'year' ? 4 : 2), 0));
+  }), displayText);
 });
-DateSegment.propTypes = {
-  /** slot for input that indicates each date segment */
-  segment: _propTypes["default"].shape({
-    isPlaceholder: _propTypes["default"].bool,
-    text: _propTypes["default"].string,
-    placeholder: _propTypes["default"].string,
-    value: _propTypes["default"].number,
-    type: _propTypes["default"].string
-  }),
-  /** index value of each segment */
-  segmentIndex: _propTypes["default"].number,
-  /** An array of segments */
-  segments: _propTypes["default"].arrayOf(_propTypes["default"].shape({
-    text: _propTypes["default"].string
-  })),
-  /** state returned by useDateField */
-  state: _propTypes["default"].shape({}),
-  /**
-   * Handler that is called when a paste event is called.
-   * (e: PasteEvent) => void
-   */
-  handlePaste: _propTypes["default"].func,
-  /** checks if the current locale is en-US */
-  isLocalEnUS: _propTypes["default"].bool
-};
 var _default = exports["default"] = DateSegment;

package/lib/cjs/components/DatePicker/index.d.ts

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

package/lib/cjs/components/Icon/NoticeIcon.d.ts

@@ -1,7 +1,22 @@
 import React from 'react';
 import { IconProps, Status } from '../../types';
 export declare const noticeIcons: {
-    [x: number]: {
+    default: {
+        icon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        testid: string;
+        name: string;
+    };
+    error: {
+        icon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        testid: string;
+        name: string;
+    };
+    success: {
+        icon: import("@pingux/mdi-react").MdiReactIconComponentType;
+        testid: string;
+        name: string;
+    };
+    warning: {
         icon: import("@pingux/mdi-react").MdiReactIconComponentType;
         testid: string;
         name: string;

package/lib/cjs/components/IconButton/IconButton.styles.d.ts

@@ -194,7 +194,45 @@ declare const _default: {
         };
     };
     datePicker: {
-        containedIcon: any;
+        containedIcon: {
+            position: string;
+            right: number;
+            width: number;
+            height: number;
+            top: string;
+            transform: string;
+            justifyContent: string;
+            appearance: string;
+            alignItems: string;
+            alignSelf: string;
+            display: string;
+            flexGrow: number;
+            flexShrink: number;
+            borderRadius: string;
+            cursor: string;
+            bg: string;
+            p: string;
+            path: {
+                fill: string;
+            };
+            outline: string;
+            '&.is-focused': {
+                outline: string;
+                outlineColor: string;
+                outlineOffset: string;
+            };
+            '&.is-hovered': {
+                bg: string;
+                boxShadow: string;
+            };
+            '&.is-pressed': {
+                path: {
+                    fill: string;
+                };
+                bg: string;
+                boxShadow: string;
+            };
+        };
     };
     hintButton: {
         bg: string;

package/lib/cjs/components/ImageUploadField/ImagePreviewButton.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+interface ImagePreviewButtonProps {
+    defaultPreviewImage?: string;
+    defaultPreviewNode?: React.ReactNode;
+    isImageType?: boolean;
+    isLoading?: boolean;
+    isMenuOpen?: boolean;
+    loaderSize?: string | number;
+    onPress?: () => void;
+    previewImage?: string;
+    previewWidth?: number;
+    widthHeightSx: {
+        height: number | string;
+        width: number | string;
+    };
+}
+declare const ImagePreviewButton: React.ForwardRefExoticComponent<ImagePreviewButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default ImagePreviewButton;

package/lib/cjs/components/ImageUploadField/ImagePreviewButton.js

@@ -14,7 +14,6 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-c
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _interactions = require("@react-aria/interactions");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _hooks = require("../../hooks");
 var _index = require("../../index");
 var _Loader = _interopRequireDefault(require("../Loader"));
@@ -32,15 +31,11 @@ var ImagePreviewButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, re
     previewWidth = props.previewWidth,
     widthHeightSx = props.widthHeightSx,
     others = (0, _objectWithoutProperties2["default"])(props, _excluded);
-  var buttonRef = (0, _react.useRef)();
-  /* istanbul ignore next */
-  (0, _react.useImperativeHandle)(ref, function () {
-    return buttonRef.current;
-  });
+  var buttonRef = (0, _hooks.useLocalOrForwardRef)(ref);
   var _useFocusRing = (0, _reactAria.useFocusRing)(),
     focusProps = _useFocusRing.focusProps,
     isFocusVisible = _useFocusRing.isFocusVisible;
-  var _useHover = (0, _interactions.useHover)(props),
+  var _useHover = (0, _interactions.useHover)({}),
     hoverProps = _useHover.hoverProps,
     isHovered = _useHover.isHovered;
   var _useGetTheme = (0, _hooks.useGetTheme)(),
@@ -98,7 +93,7 @@ var ImagePreviewButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, re
     variant: "imageUpload.hoveredPreview.shaded"
   }));
   return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
-    tabindex: 0,
+    tabIndex: 0,
     sx: widthHeightSx
   }, hoverProps), (0, _react2.jsx)(_index.Button, (0, _extends2["default"])({
     ref: buttonRef,
@@ -108,19 +103,5 @@ var ImagePreviewButton = /*#__PURE__*/(0, _react.forwardRef)(function (props, re
     "aria-label": "Image preview"
   }, (0, _reactAria.mergeProps)(focusProps, others)), previewImage && isImageType ? imagePreview : noImagePreview, isLoading && loadingPreview, (isHovered || isFocusVisible) && !isLoading && hoveredPreview));
 });
-ImagePreviewButton.propTypes = {
-  defaultPreviewImage: _propTypes["default"].string,
-  defaultPreviewNode: _propTypes["default"].node,
-  isImageType: _propTypes["default"].bool,
-  isLoading: _propTypes["default"].bool,
-  isMenuOpen: _propTypes["default"].bool,
-  loaderSize: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  previewImage: _propTypes["default"].string,
-  previewWidth: _propTypes["default"].number,
-  widthHeightSx: _propTypes["default"].shape({
-    height: _propTypes["default"].number,
-    width: _propTypes["default"].number
-  })
-};
 ImagePreviewButton.displayName = 'ImagePreviewButton';
 var _default = exports["default"] = ImagePreviewButton;

package/lib/cjs/components/ImageUploadField/ImageUploadField.d.ts

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

package/lib/cjs/components/ImageUploadField/ImageUploadField.js

@@ -15,19 +15,15 @@ _Object$defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 var _react = _interopRequireWildcard(require("react"));
 var _visuallyHidden = require("@react-aria/visually-hidden");
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _uuid = require("uuid");
 var _ = require("../..");
+var _hooks = require("../../hooks");
 var _useImageUploadState = require("../../hooks/useImageUploadState");
-var _htmlElements = require("../../utils/devUtils/constants/htmlElements");
 var _pendoID = require("../../utils/devUtils/constants/pendoID");
-var _ariaAttributes = require("../../utils/docUtils/ariaAttributes");
-var _fieldAttributes = require("../../utils/docUtils/fieldAttributes");
-var _statusProp = require("../../utils/docUtils/statusProp");
 var _ImagePreviewButton = _interopRequireDefault(require("./ImagePreviewButton"));
 var _ImageUploadFieldBase = _interopRequireDefault(require("./ImageUploadFieldBase"));
 var _react2 = require("@emotion/react");
@@ -36,20 +32,33 @@ function ownKeys(e, r) { var t = _Object$keys(e); if (_Object$getOwnPropertySymb
 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) { (0, _defineProperty2["default"])(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; }
 var displayName = 'ImageUploadField';
 var ImageUploadField = /*#__PURE__*/(0, _react.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 = (0, _react.useRef)();
-  var state = (0, _useImageUploadState.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 */
-  (0, _react.useImperativeHandle)(ref, function () {
-    return inputRef.current;
+  var inputRef = (0, _hooks.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 = (0, _useImageUploadState.useImageUploadState)(inputRef, stateProps);
   var statusId = (0, _uuid.v4)();
   var onAction = (0, _react.useCallback)(function (action) {
-    // eslint-disable-next-line default-case
     switch (action) {
       case 'upload':
         {
@@ -64,8 +73,10 @@ var ImageUploadField = /*#__PURE__*/(0, _react.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 (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_ImageUploadFieldBase["default"], (0, _extends2["default"])({
     fileName: state.fileName,
     handleInputChange: state.handleInputChange,
@@ -73,18 +84,16 @@ var ImageUploadField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     handleOpenMenuChange: state.handleOpenMenuChange,
     isImageType: state.isImageType,
     isMenuOpen: state.isMenuOpen,
-    ref: inputRef,
-    widthHeightSx: state.widthHeightSx
+    ref: inputRef
   }, (0, _pendoID.getPendoID)(displayName), props), (0, _react2.jsx)(_ImagePreviewButton["default"], {
-    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
   }), (0, _react2.jsx)(_.Menu, {
@@ -103,50 +112,5 @@ var ImageUploadField = /*#__PURE__*/(0, _react.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["default"].string,
-  /** Text that renders in the upload menu item. */
-  uploadItemText: _propTypes["default"].string,
-  /** Text that renders in the remove menu item. */
-  removeItemText: _propTypes["default"].string,
-  /** Default image preview (uncontrolled), used when no previewImage is present. */
-  defaultPreviewImage: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].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["default"].arrayOf(_propTypes["default"].oneOf(_htmlElements.imageUploadPropTypes)),
-  /** Text to display after the radio group label. Useful for errors or other info. */
-  helperText: _propTypes["default"].node,
-  /** Determines whether the loading indicator is shown. */
-  isLoading: _propTypes["default"].bool,
-  /** Defines a string value that labels the current element. */
-  label: _propTypes["default"].string,
-  /** The handler that is called when the input file is added.
-   *
-   * `(event: InputEvent) => void`
-   * */
-  onChange: _propTypes["default"].func,
-  /** Loading indicator size */
-  loaderSize: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  /** The handler that is called when the file is removed.
-   *
-   * `(event: InputEvent) => void`
-   * */
-  onRemove: _propTypes["default"].func,
-  /** Props that will be passed to the Popover Menu. */
-  popoverMenuProps: _propTypes["default"].shape({}),
-  /** Define component height */
-  previewHeight: _propTypes["default"].number,
-  /** Define component height */
-  previewWidth: _propTypes["default"].number
-}, _statusProp.statusPropTypes), _ariaAttributes.ariaAttributesBasePropTypes), _fieldAttributes.inputFieldAttributesBasePropTypes);
-ImageUploadField.defaultProps = {
-  fileTypes: ['image'],
-  loaderSize: 10,
-  previewHeight: 50,
-  previewWidth: 50,
-  uploadItemText: 'Upload New Image',
-  removeItemText: 'Remove Image'
-};
 ImageUploadField.displayName = displayName;
 var _default = exports["default"] = ImageUploadField;

package/lib/cjs/components/ImageUploadField/ImageUploadFieldBase.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { PopoverMenuProps, Status } from '../../types';
+interface ImageUploadFieldBaseProps {
+    children?: React.ReactNode;
+    fileName?: string;
+    fileTypes?: string[];
+    handleInputChange: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    handleLabelClick: (event: React.MouseEvent) => void;
+    handleOpenMenuChange: (isOpen: boolean) => void;
+    helperText?: React.ReactNode;
+    isImageType?: boolean;
+    isMenuOpen?: boolean;
+    popoverMenuProps?: Partial<PopoverMenuProps>;
+    status?: Status;
+}
+declare const ImageUploadFieldBase: React.ForwardRefExoticComponent<ImageUploadFieldBaseProps & React.RefAttributes<HTMLInputElement>>;
+export default ImageUploadFieldBase;

package/lib/cjs/components/ImageUploadField/ImageUploadFieldBase.js

@@ -22,16 +22,13 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
 var _react = _interopRequireWildcard(require("react"));
 var _reactAria = require("react-aria");
 var _omit = _interopRequireDefault(require("lodash/omit"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
 var _ = require("../..");
 var _useField2 = _interopRequireDefault(require("../../hooks/useField"));
-var _htmlElements = require("../../utils/devUtils/constants/htmlElements");
 var _statuses = _interopRequireDefault(require("../../utils/devUtils/constants/statuses"));
-var _statusProp = require("../../utils/docUtils/statusProp");
 var _react2 = require("@emotion/react");
 function _interopRequireWildcard(e, t) { if ("function" == typeof _WeakMap) var r = new _WeakMap(), n = new _WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = _Object$defineProperty) && _Object$getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 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) { (0, _defineProperty2["default"])(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) { (0, _defineProperty2["default"])(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; }
 var ImageUploadFieldBase = /*#__PURE__*/(0, _react.forwardRef)(function (props, inputRef) {
   var children = props.children,
     fileName = props.fileName,
@@ -44,16 +41,17 @@ var ImageUploadFieldBase = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     isMenuOpen = props.isMenuOpen,
     popoverMenuProps = props.popoverMenuProps,
     status = props.status;
-  var _useField = (0, _useField2["default"])(_objectSpread({}, (0, _omit["default"])(props, ['onRemove']))),
+  var _useField = (0, _useField2["default"])(_objectSpread({}, (0, _omit["default"])(props, ['onRemove', 'helperText']))),
     fieldContainerProps = _useField.fieldContainerProps,
     fieldControlInputProps = _useField.fieldControlInputProps,
     fieldControlWrapperProps = _useField.fieldControlWrapperProps,
     fieldLabelProps = _useField.fieldLabelProps;
-  var labelRef = (0, _react.useRef)();
+  var labelRef = (0, _react.useRef)(null);
   var _useVisuallyHidden = (0, _reactAria.useVisuallyHidden)(),
     visuallyHiddenProps = _useVisuallyHidden.visuallyHiddenProps;
   var getAcceptableInputTypes = function getAcceptableInputTypes() {
-    return (0, _map["default"])(fileTypes).call(fileTypes, function (type) {
+    var _context;
+    return (0, _map["default"])(_context = fileTypes !== null && fileTypes !== void 0 ? fileTypes : []).call(_context, function (type) {
       return (0, _includes["default"])(type).call(type, '/') ? type : "".concat(type, "/*");
     }).join(', ');
   };
@@ -62,7 +60,7 @@ var ImageUploadFieldBase = /*#__PURE__*/(0, _react.forwardRef)(function (props,
   }, fieldContainerProps), (0, _react2.jsx)(_.Label, (0, _extends2["default"])({}, fieldLabelProps, {
     onClick: handleLabelClick,
     ref: labelRef,
-    tabIndex: "-1"
+    tabIndex: -1
   })), (0, _react2.jsx)(_.PopoverMenu, (0, _extends2["default"])({
     isOpen: isMenuOpen,
     onOpenChange: handleOpenMenuChange
@@ -82,16 +80,5 @@ var ImageUploadFieldBase = /*#__PURE__*/(0, _react.forwardRef)(function (props,
     status: status
   }, helperText));
 });
-ImageUploadFieldBase.propTypes = _objectSpread({
-  fileName: _propTypes["default"].string,
-  fileTypes: _propTypes["default"].arrayOf(_propTypes["default"].oneOf(_htmlElements.imageUploadPropTypes)),
-  handleInputChange: _propTypes["default"].func,
-  handleLabelClick: _propTypes["default"].func,
-  handleOpenMenuChange: _propTypes["default"].func,
-  helperText: _propTypes["default"].node,
-  isImageType: _propTypes["default"].bool,
-  isMenuOpen: _propTypes["default"].bool,
-  popoverMenuProps: _propTypes["default"].shape({})
-}, _statusProp.statusPropTypes);
 ImageUploadFieldBase.displayName = 'ImageUploadFieldBase';
 var _default = exports["default"] = ImageUploadFieldBase;

package/lib/cjs/components/ImageUploadField/imageUpload.d.ts

@@ -0,0 +1,53 @@
+declare const _default: {
+    hoveredPreview: {
+        wrapper: {
+            display: string;
+            alignItems: string;
+            justifyContent: string;
+            position: string;
+        };
+        shaded: {
+            opacity: number;
+            backgroundColor: string;
+            width: string;
+            height: string;
+            position: string;
+            borderRadius: number;
+        };
+    };
+    button: {
+        display: string;
+        alignItems: string;
+        justifyContent: string;
+        padding: number;
+        backgroundColor: string;
+        border: string;
+        borderColor: string;
+        '&.is-focused': {
+            borderColor: string;
+            outline: string;
+            outlineColor: string;
+            outlineOffset: string;
+        };
+        fontSize: string;
+        fontWeight: number;
+        color: string;
+        fontFamily: string;
+        overflowWrap: import("../..").overflowWrap;
+        maxWidth: string;
+        wordWrap: import("../..").wordWrap;
+        wordBreak: import("../..").wordBreak;
+        cursor: string;
+        height: string;
+        lineHeight: string;
+        minWidth: string;
+        outline: string;
+        borderRadius: string;
+        flexShrink: number;
+        whiteSpace: string;
+    };
+    noImagePreview: {
+        fill: string;
+    };
+};
+export default _default;

package/lib/cjs/components/ImageUploadField/index.d.ts

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

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

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

package/lib/cjs/components/SwitchField/switchFieldAttributes.d.ts

@@ -82,7 +82,12 @@ export declare const switchFieldArgTypes: {
     status: {
         control: {
             type: string;
-            options: any;
+            options: {
+                readonly DEFAULT: "default";
+                readonly ERROR: "error";
+                readonly SUCCESS: "success";
+                readonly WARNING: "warning";
+            };
         };
         description: string;
     };
@@ -90,5 +95,5 @@ export declare const switchFieldArgTypes: {
 export declare const switchFieldArgs: {
     label: string;
     value: string;
-    status: any;
+    status: "default";
 };