@shopgate/pwa-ui-ios 7.32.0-beta.9 → 7.32.1-beta.1

package/AppBar/components/Title/index.js

@@ -1,7 +1,8 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import PropTypes from 'prop-types';
 import { Typography } from '@shopgate/engage/components';
 import { makeStyles } from '@shopgate/engage/styles';
+import htmlToText from '@shopgate/pwa-common/helpers/html/htmlToText';
 import { jsx as _jsx } from "react/jsx-runtime";
 const useStyles = makeStyles()({
   root: {
@@ -26,7 +27,10 @@ const AppBarTitle = ({
     classes,
     cx
   } = useStyles();
-  if (!title) {
+  // Titles can contain HTML entities (e.g. product names). They are decoded to plain text, since
+  // titles might originate from untrusted sources like URL parameters and must not render as HTML.
+  const text = useMemo(() => htmlToText(title), [title]);
+  if (!text) {
     return null;
   }
   return /*#__PURE__*/_jsx(Typography, {
@@ -40,10 +44,8 @@ const AppBarTitle = ({
     "aria-level": "1",
     "aria-live": "polite",
     tabIndex: -1,
-    "data-test-id": `title: ${title}`,
-    dangerouslySetInnerHTML: {
-      __html: title
-    }
+    "data-test-id": `title: ${text}`,
+    children: text
   });
 };
 export default AppBarTitle;

package/BaseDialog/components/Title/index.js

@@ -6,7 +6,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const useStyles = makeStyles()(theme => ({
   title: {
     textAlign: 'center',
-    fontWeight: theme.typography.fontWeightBold
+    fontWeight: theme.typography.fontWeightBold,
+    color: theme.palette.common.black,
+    paddingBottom: theme.spacing(1)
   }
 }));
 

package/BaseDialog/index.js

@@ -18,7 +18,10 @@ const useStyles = makeStyles()({
     maxHeight: `calc(100vh - ${outerGap * 2}px)`,
     borderRadius: 14,
     background: 'rgba(255, 255, 255, 0.82)',
-    backdropFilter: 'blur(20px)'
+    backdropFilter: 'blur(20px)',
+    '& input, & textarea': {
+      color: 'inherit'
+    }
   },
   content: {
     padding: '16px',

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@shopgate/pwa-ui-ios",
-  "version": "7.32.0-beta.9",
+  "version": "7.32.1-beta.1",
   "description": "Shopgate's iOS UI components.",
   "main": "index.js",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@shopgate/pwa-common": "7.32.0-beta.9",
+    "@shopgate/pwa-common": "7.32.1-beta.1",
     "react": "^17.0.2"
   },
   "peerDependencies": {

package/BaseDialog/components/Buttons/spec.js

@@ -1,29 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import { Button } from '@shopgate/engage/components/v2';
-import Buttons from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-const actions = [{
-  label: 'action0',
-  action: jest.fn()
-}, {
-  label: 'action1',
-  action: jest.fn()
-}, {
-  label: 'action2',
-  action: jest.fn()
-}];
-describe('<Buttons />', () => {
-  it('should not render if no actions are passed', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Buttons, {}));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.instance()).toEqual(null);
-  });
-  it('should render buttons', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Buttons, {
-      actions: actions
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(Button).length).toBe(actions.length);
-  });
-});

package/BaseDialog/components/Content/spec.js

@@ -1,18 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import Content from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<Content />', () => {
-  it('should not render if no content is passed', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Content, {}));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.instance()).toEqual(null);
-  });
-  it('should render content components', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Content, {
-      content: "Hello World"
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('[id="basicDialogDesc"]').length).toBe(1);
-  });
-});

package/BaseDialog/components/Title/spec.js

@@ -1,18 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import Title from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-describe('<Title />', () => {
-  it('should not render without a title', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Title, {}));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.instance()).toEqual(null);
-  });
-  it('should render with a title', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(Title, {
-      title: "Some test title"
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find('[id="basicDialogTitle"]').length).toBe(1);
-  });
-});

package/BaseDialog/spec.js

@@ -1,44 +0,0 @@
-import React from 'react';
-import { shallow } from 'enzyme';
-import Title from "./components/Title";
-import Content from "./components/Content";
-import Buttons from "./components/Buttons";
-import BasicDialog from "./index";
-import { jsx as _jsx } from "react/jsx-runtime";
-const props = {
-  title: 'Hello World',
-  children: /*#__PURE__*/_jsx("div", {
-    children: "Hello World"
-  }),
-  actions: [{
-    label: 'action0',
-    action: jest.fn()
-  }, {
-    label: 'action1',
-    action: jest.fn()
-  }, {
-    label: 'action2',
-    action: jest.fn()
-  }]
-};
-jest.mock('@shopgate/engage/a11y/components');
-describe('<BasicDialog />', () => {
-  it('should render with minimal props', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(BasicDialog, {
-      actions: []
-    }));
-    expect(wrapper).toMatchSnapshot();
-  });
-  it('should render as expected', () => {
-    const wrapper = shallow(/*#__PURE__*/_jsx(BasicDialog, {
-      ...props
-    }));
-    expect(wrapper).toMatchSnapshot();
-    expect(wrapper.find(Title).length).toBe(1);
-    expect(wrapper.find(Title).props().title).toEqual(props.title);
-    expect(wrapper.find(Content).length).toBe(1);
-    expect(wrapper.find(Content).props().content).toEqual(props.children);
-    expect(wrapper.find(Buttons).length).toBe(1);
-    expect(wrapper.find(Buttons).props().actions).toEqual(props.actions);
-  });
-});

package/tsconfig.build.json

@@ -1,16 +0,0 @@
-{
-  "extends": "@shopgate/engage/tsconfig.build.json",
-  "compilerOptions": {
-    "outDir": "./dist",
-    "rootDir": "."
-  },
-  "include": ["**/*.ts", "**/*.tsx"],
-  "exclude": [
-    "dist",
-    "node_modules",
-    "**/*.spec.*",
-    "**/__tests__/**",
-    "**/__snapshots__/**",
-    "coverage"
-  ]
-}

package/tsconfig.json

@@ -1,3 +0,0 @@
-{
-  "extends": "@shopgate/engage/tsconfig.json",
-}