@shopgate/pwa-ui-shared 7.32.0-beta.5 → 7.32.0-beta.7

package/Card/index.js

@@ -1,40 +1,19 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { makeStyles } from '@shopgate/engage/styles';
-import { jsx as _jsx } from "react/jsx-runtime";
-const useStyles = makeStyles()(theme => ({
-  root: {
-    boxShadow: '0 4px 8px rgba(0,0,0,0.16)',
-    margin: '5px 5px 10px',
-    borderRadius: 10,
-    background: theme.palette.background.surface,
-    overflow: 'hidden',
-    position: 'relative'
-  }
-}));
+import React, { useEffect } from 'react';
+import { logger } from '@shopgate/engage/core/helpers';
+import { Card } from '@shopgate/engage/components';
 
 /**
- * Renders the card component.
- * @param {Object} props The component properties.
+ * @deprecated Use `import { Card } from '@shopgate/engage/components'` instead.
+ * @param {Object} props The component props.
  * @returns {JSX}
  */
-const Card = ({
-  className,
-  children,
-  id
-}) => {
-  const {
-    classes,
-    cx
-  } = useStyles();
-  return /*#__PURE__*/_jsx("div", {
-    className: cx('ui-shared__card', classes.root, className),
-    id: id,
-    children: children
+import { jsx as _jsx } from "react/jsx-runtime";
+const DeprecatedCard = props => {
+  useEffect(() => {
+    logger.warn('===== Card deprecated =====\n' + 'The Card component ' + '(@shopgate/pwa-ui-shared/Card) is deprecated.\n' + 'Please use: import { Card } from \'@shopgate/engage/components\'.\n' + '===================================');
+  }, []);
+  return /*#__PURE__*/_jsx(Card, {
+    ...props
   });
 };
-Card.defaultProps = {
-  className: '',
-  id: null
-};
-export default Card;
+export default DeprecatedCard;

package/CardList/components/Item/index.js

@@ -1,42 +1,48 @@
-import React, { Children } from 'react';
+import React from 'react';
 import PropTypes from 'prop-types';
-import ListItem from '@shopgate/pwa-common/components/List/components/Item';
 import { makeStyles } from '@shopgate/engage/styles';
 import { jsx as _jsx } from "react/jsx-runtime";
-const useStyles = makeStyles()(theme => ({
-  root: {
-    background: theme.palette.background.surface,
-    marginBottom: theme.spacing(0.5),
+const useStyles = makeStyles()({
+  item: {
+    display: 'block',
     position: 'relative'
+  },
+  unselected: {
+    zIndex: 1
+  },
+  selected: {
+    zIndex: 2
   }
-}));
+});
 
 /**
- * The Card List Item component implemented as class so that ref prop is available.
- * @param {Object} props The component props.
- * @return {JSX}
+ * The ListItem component.
+ * @returns {JSX}
  */
-const Item = ({
+const ListItem = ({
   children,
   className,
-  isSelected
+  isSelected,
+  role
 }) => {
   const {
     classes,
     cx
   } = useStyles();
-  if (!Children.count(children)) {
+  if (!React.Children.count(children)) {
     return null;
   }
-  return /*#__PURE__*/_jsx(ListItem, {
-    className: cx(classes.root, className),
-    isSelected: isSelected,
+  return /*#__PURE__*/_jsx("li", {
+    className: cx(classes.item, className, 'common__list__list-item', isSelected ? classes.selected : classes.unselected),
+    "data-test-id": "listItem",
+    role: role,
     children: children
   });
 };
-Item.defaultProps = {
-  children: null,
+ListItem.defaultProps = {
   className: null,
-  isSelected: false
+  children: null,
+  isSelected: false,
+  role: null
 };
-export default Item;
+export default ListItem;

package/Dialog/components/PipelineErrorDialog/index.js

@@ -33,7 +33,8 @@ const PipelineErrorDialog = ({
   params,
   message
 }) => {
-  const [devMode, setDevMode] = useState(false);
+  // May be opened directly in developer detail mode (e.g. via long-pressing an error toast).
+  const [devMode, setDevMode] = useState(!!params.openWithDetails);
   const tapTimeoutRef = useRef(null);
   const tapCounterRef = useRef(0);
   const handleTapTimeout = useCallback(() => {

package/Dialog/components/PipelineErrorDialog/spec.js

@@ -1,5 +1,7 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
 import PipelineErrorDialog from "./index";
 import { jsx as _jsx } from "react/jsx-runtime";
 jest.mock('@shopgate/engage/a11y/components');
@@ -51,6 +53,20 @@ describe('<PipelineErrorDialog />', () => {
     clickElement.simulate('click');
     expect(wrapper.text()).not.toContain(devMarker);
   });
+  it('should open directly in developer detail mode when params.openWithDetails is set', () => {
+    render(/*#__PURE__*/_jsx(PipelineErrorDialog, {
+      actions: [],
+      params: {
+        ...defaultParams,
+        openWithDetails: true
+      }
+    }));
+
+    // Developer detail view is shown immediately, without any tapping.
+    expect(screen.getByText('Pipeline:')).toBeInTheDocument();
+    expect(screen.getByText('Code:')).toBeInTheDocument();
+    expect(screen.getByText(/fakePipeline/)).toBeInTheDocument();
+  });
   it('should not switch modes if tapped too slow', () => {
     jest.useFakeTimers();
     const wrapper = mount(/*#__PURE__*/_jsx(PipelineErrorDialog, {

package/RatingStars/index.js

@@ -15,7 +15,7 @@ const ICON_SIZES = {
 const useStyles = makeStyles()(theme => ({
   container: {
     position: 'relative',
-    display: 'inline-block',
+    display: 'inline-flex',
     verticalAlign: 'middle',
     maxWidth: '100%'
   },

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@shopgate/pwa-ui-shared",
-  "version": "7.32.0-beta.5",
+  "version": "7.32.0-beta.7",
   "description": "Shopgate's shared UI components.",
   "main": "index.js",
   "license": "Apache-2.0",
   "dependencies": {
-    "@shopgate/pwa-ui-ios": "7.32.0-beta.5",
-    "@shopgate/pwa-ui-material": "7.32.0-beta.5"
+    "@shopgate/pwa-ui-ios": "7.32.0-beta.7",
+    "@shopgate/pwa-ui-material": "7.32.0-beta.7"
   },
   "devDependencies": {
-    "@shopgate/pwa-common": "7.32.0-beta.5",
-    "@shopgate/pwa-common-commerce": "7.32.0-beta.5",
+    "@shopgate/pwa-common": "7.32.0-beta.7",
+    "@shopgate/pwa-common-commerce": "7.32.0-beta.7",
     "classnames": "2.5.1",
     "react": "^17.0.2"
   },