@pingux/astro 1.28.0 → 1.28.1

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.28.1](https://gitlab.corp.pingidentity.com/ux/pingux/compare/@pingux/astro@1.28.0...@pingux/astro@1.28.1) (2022-09-22)
+
+
+### Bug Fixes
+
+* Change DataTable prop type definitions for width and height ([e295973](https://gitlab.corp.pingidentity.com/ux/pingux/commit/e29597388e30eec017532a262bf79a37e147f87d))
+* Hotfix to address React Spectrum build error happening for some users ([9dccf35](https://gitlab.corp.pingidentity.com/ux/pingux/commit/9dccf35dd2a91e2517c975812649592bef51ef43))
+
+
+
+
+
 # [1.28.0](https://gitlab.corp.pingidentity.com/ux/pingux/compare/@pingux/astro@1.27.0...@pingux/astro@1.28.0) (2022-09-22)
 
 

package/lib/cjs/components/DataTable/DataTable.js

@@ -46,8 +46,6 @@ var _virtualizer = require("@react-aria/virtualizer");
 
 var _table = require("@react-stately/table");
 
-var _utils2 = require("@react-spectrum/utils");
-
 var _layout = require("@react-stately/layout");
 
 var _table2 = require("@react-aria/table");
@@ -106,11 +104,9 @@ var ROW_HEIGHTS = {
 */
 
 var DataTable = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-  var onAction = props.onAction;
-
-  var _useStyleProps = (0, _utils2.useStyleProps)(props),
-      styleProps = _useStyleProps.styleProps;
-
+  var width = props.width,
+      height = props.height,
+      onAction = props.onAction;
   var direction = 'ltr'; // useLocale override
 
   var scale = 'large'; // useProvider override
@@ -243,7 +239,9 @@ var DataTable = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     style: {
       whiteSpace: props.overflowMode === 'wrap' ? 'normal' : 'initial'
     }
-  }, gridProps, styleProps, {
+  }, gridProps, {
+    width: width,
+    height: height,
     layout: layout,
     collection: state.collection,
     focusedKey: state.selectionManager.focusedKey,
@@ -256,6 +254,30 @@ var DataTable = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     getColumnWidth: columnState.getColumnWidth
   })));
 });
+DataTable.propTypes = {
+  /**
+   * Sets the amount of vertical padding within each cell.
+   * density: 'compact' | 'regular' | 'spacious'
+   * @default 'regular'
+   */
+  density: _propTypes["default"].string,
+
+  /**
+   * Sets the overflow behavior for the cell contents.
+   * overflowMode: 'wrap' | 'truncate'
+   * @default 'truncate'
+   */
+  overflowMode: _propTypes["default"].string,
+
+  /** Handler that is called when a user performs an action on a row. */
+  onAction: _propTypes["default"].func,
+  width: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  height: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number])
+};
+DataTable.defaultProps = {
+  width: '100%',
+  height: 565
+};
 
 function TableHeader(_ref) {
   var children = _ref.children,
@@ -423,24 +445,6 @@ function CenteredWrapper(_ref6) {
   }, children));
 }
 
-DataTable.propTypes = {
-  /**
-   * Sets the amount of vertical padding within each cell.
-   * density: 'compact' | 'regular' | 'spacious'
-   * @default 'regular'
-   */
-  density: _propTypes["default"].string,
-
-  /**
-   * Sets the overflow behavior for the cell contents.
-   * overflowMode: 'wrap' | 'truncate'
-   * @default 'truncate'
-   */
-  overflowMode: _propTypes["default"].string,
-
-  /** Handler that is called when a user performs an action on a row. */
-  onAction: _propTypes["default"].func
-};
 TableCell.propTypes = {
   cell: _propTypes["default"].shape({
     column: _propTypes["default"].shape({

package/lib/cjs/index.js

@@ -1804,7 +1804,7 @@ _forEachInstanceProperty(_context69 = _Object$keys(_DataTable)).call(_context69,
   });
 });
 
-var _table = require("@react-spectrum/table");
+var _table = require("@react-stately/table");
 
 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); }
 

package/lib/cjs/styles/forms/index.js

@@ -56,7 +56,7 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 
 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; }
 
-// See https://rebassjs.org/forms/ for the intended structure.
+// See ThemeUI docs on variants and themes for intended structure
 // Variants should be defined in the approprate file.
 var _default = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, checkbox), {}, {
   comboBox: _comboBox["default"]

package/lib/cjs/styles/forms/label.js

@@ -79,7 +79,7 @@ label.radio = _objectSpread(_objectSpread({}, _text.text.base), {}, {
   cursor: 'pointer',
   alignItems: 'center',
   mb: 'xs'
-}); // NOTE: Rebass label adds 'flex' after other styles, so we have to use !important to override it
+}); // NOTE: ThemeUI label adds 'flex' after other styles, so we have to use !important to override it
 
 label.checkbox = _objectSpread(_objectSpread({}, _text.text.base), {}, {
   display: 'inline-flex !important',

package/lib/cjs/styles/forms/select.js

@@ -58,7 +58,7 @@ select.currentValue = {
   overflow: 'hidden',
   whiteSpace: 'nowrap',
   textOverflow: 'ellipsis',
-  // rebass adds display: flex after other styles and ellipsis goes away
+  // ThemeUI adds display: flex after other styles and ellipsis goes away
   display: 'inline !important'
 };
 select.listBoxPopup = _objectSpread(_objectSpread({}, _input.input), {}, {

package/lib/components/DataTable/DataTable.js

@@ -23,7 +23,6 @@ import { FocusRing, useFocusRing } from '@react-aria/focus';
 import { VisuallyHidden } from '@react-aria/visually-hidden';
 import { layoutInfoToStyle, VirtualizerItem } from '@react-aria/virtualizer';
 import { useTableColumnResizeState, useTableState } from '@react-stately/table';
-import { useStyleProps } from '@react-spectrum/utils';
 import { TableLayout } from '@react-stately/layout';
 import { useTable, useTableCell, useTableColumnHeader, useTableHeaderRow, useTableRow, useTableRowGroup } from '@react-aria/table';
 import PropTypes from 'prop-types';
@@ -60,11 +59,9 @@ var ROW_HEIGHTS = {
 */
 
 var DataTable = /*#__PURE__*/forwardRef(function (props, ref) {
-  var onAction = props.onAction;
-
-  var _useStyleProps = useStyleProps(props),
-      styleProps = _useStyleProps.styleProps;
-
+  var width = props.width,
+      height = props.height,
+      onAction = props.onAction;
   var direction = 'ltr'; // useLocale override
 
   var scale = 'large'; // useProvider override
@@ -197,7 +194,9 @@ var DataTable = /*#__PURE__*/forwardRef(function (props, ref) {
     style: {
       whiteSpace: props.overflowMode === 'wrap' ? 'normal' : 'initial'
     }
-  }, gridProps, styleProps, {
+  }, gridProps, {
+    width: width,
+    height: height,
     layout: layout,
     collection: state.collection,
     focusedKey: state.selectionManager.focusedKey,
@@ -210,6 +209,30 @@ var DataTable = /*#__PURE__*/forwardRef(function (props, ref) {
     getColumnWidth: columnState.getColumnWidth
   })));
 });
+DataTable.propTypes = {
+  /**
+   * Sets the amount of vertical padding within each cell.
+   * density: 'compact' | 'regular' | 'spacious'
+   * @default 'regular'
+   */
+  density: PropTypes.string,
+
+  /**
+   * Sets the overflow behavior for the cell contents.
+   * overflowMode: 'wrap' | 'truncate'
+   * @default 'truncate'
+   */
+  overflowMode: PropTypes.string,
+
+  /** Handler that is called when a user performs an action on a row. */
+  onAction: PropTypes.func,
+  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  height: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
+};
+DataTable.defaultProps = {
+  width: '100%',
+  height: 565
+};
 
 function TableHeader(_ref) {
   var children = _ref.children,
@@ -378,24 +401,6 @@ function CenteredWrapper(_ref6) {
   }, children));
 }
 
-DataTable.propTypes = {
-  /**
-   * Sets the amount of vertical padding within each cell.
-   * density: 'compact' | 'regular' | 'spacious'
-   * @default 'regular'
-   */
-  density: PropTypes.string,
-
-  /**
-   * Sets the overflow behavior for the cell contents.
-   * overflowMode: 'wrap' | 'truncate'
-   * @default 'truncate'
-   */
-  overflowMode: PropTypes.string,
-
-  /** Handler that is called when a user performs an action on a row. */
-  onAction: PropTypes.func
-};
 TableCell.propTypes = {
   cell: PropTypes.shape({
     column: PropTypes.shape({

package/lib/index.js

@@ -154,4 +154,4 @@ export { OverlayProvider, useOverlayPosition, useOverlayTrigger } from '@react-a
 export { useOverlayTriggerState } from '@react-stately/overlays';
 export { default as DataTable } from './components/DataTable';
 export * from './components/DataTable';
-export { Cell as DataTableCell, Column as DataTableColumn, Row as DataTableRow, TableBody as DataTableBody, TableHeader as DataTableHeader } from '@react-spectrum/table';
+export { Cell as DataTableCell, Column as DataTableColumn, Row as DataTableRow, TableBody as DataTableBody, TableHeader as DataTableHeader } from '@react-stately/table';

package/lib/styles/forms/index.js

@@ -21,7 +21,7 @@ import search from './search';
 import * as select from './select';
 import * as switchable from './switch'; // 'switch' is a reserved keyword
 
-import * as textarea from './textarea'; // See https://rebassjs.org/forms/ for the intended structure.
+import * as textarea from './textarea'; // See ThemeUI docs on variants and themes for intended structure
 // Variants should be defined in the approprate file.
 
 export default _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, checkbox), {}, {

package/lib/styles/forms/label.js

@@ -59,7 +59,7 @@ label.radio = _objectSpread(_objectSpread({}, text.base), {}, {
   cursor: 'pointer',
   alignItems: 'center',
   mb: 'xs'
-}); // NOTE: Rebass label adds 'flex' after other styles, so we have to use !important to override it
+}); // NOTE: ThemeUI label adds 'flex' after other styles, so we have to use !important to override it
 
 label.checkbox = _objectSpread(_objectSpread({}, text.base), {}, {
   display: 'inline-flex !important',

package/lib/styles/forms/select.js

@@ -37,7 +37,7 @@ select.currentValue = {
   overflow: 'hidden',
   whiteSpace: 'nowrap',
   textOverflow: 'ellipsis',
-  // rebass adds display: flex after other styles and ellipsis goes away
+  // ThemeUI adds display: flex after other styles and ellipsis goes away
   display: 'inline !important'
 };
 select.listBoxPopup = _objectSpread(_objectSpread({}, input), {}, {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "1.28.0",
+  "version": "1.28.1",
   "description": "PingUX themeable React component library",
   "repository": {
     "type": "git",
@@ -66,10 +66,6 @@
     "@react-aria/utils": "^3.12.0",
     "@react-aria/virtualizer": "^3.3.2",
     "@react-aria/visually-hidden": "3.2.1",
-    "@react-spectrum/provider": "^3.2.1",
-    "@react-spectrum/table": "^3.3.0",
-    "@react-spectrum/tooltip": "^3.2.1",
-    "@react-spectrum/utils": "3.6.1",
     "@react-stately/collections": "~3.3.8",
     "@react-stately/color": "^3.0.0-beta.2",
     "@react-stately/combobox": "^3.0.0",
@@ -92,11 +88,9 @@
     "@react-stately/tree": "^3.1.2",
     "@react-stately/utils": "~3.4.1",
     "@react-stately/virtualizer": "^3.2.1",
-    "@rebass/forms": "^4.0.6",
     "@styled-system/prop-types": "^5.1.5",
     "@styled-system/props": "^5.1.5",
     "@styled-system/theme-get": "^5.1.2",
-    "@tippyjs/react": "4.2.0",
     "chroma-js": "^2.1.0",
     "classnames": "^2.2.6",
     "emotion-normalize": "^11.0.1",
@@ -109,12 +103,10 @@
     "react-calendar": "^3.4.0",
     "react-color": "^2.19.3",
     "react-dropzone": "^11.4.2",
-    "rebass": "^4.0.7",
     "recharts": "^2.1.4",
     "regenerator-runtime": "^0.13.7",
     "styled-system": "^5.1.5",
     "theme-ui": "^0.10.0",
-    "tippy.js": "6.2.7",
     "uuid": "^8.3.2"
   },
   "devDependencies": {