@commercetools-frontend/application-shell 22.20.0 → 22.22.0

package/dist/{index-bcb52bd1.cjs.prod.js → index-dfc86bb9.cjs.prod.js}

@@ -24,7 +24,7 @@ var constants = require('@commercetools-frontend/constants');
 var i18n = require('@commercetools-frontend/i18n');
 var reactNotifications = require('@commercetools-frontend/react-notifications');
 var sentry = require('@commercetools-frontend/sentry');
-var oidc = require('./oidc-cfa56c46.cjs.prod.js');
+var oidc = require('./oidc-72a01b56.cjs.prod.js');
 require('@babel/runtime-corejs3/core-js-stable/url');
 var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 var designSystem = require('@commercetools-uikit/design-system');
@@ -55,6 +55,7 @@ var _possibleConstructorReturn = require('@babel/runtime-corejs3/helpers/possibl
 var _getPrototypeOf = require('@babel/runtime-corejs3/helpers/getPrototypeOf');
 require('@babel/runtime-corejs3/core-js-stable/instance/index-of');
 var _sliceInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/slice');
+var _setTimeout = require('@babel/runtime-corejs3/core-js-stable/set-timeout');
 var _Object$fromEntries = require('@babel/runtime-corejs3/core-js-stable/object/from-entries');
 var _flagsInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/flags');
 var react$2 = require('@apollo/client/react');
@@ -102,6 +103,7 @@ var LoadingSpinner__default = /*#__PURE__*/_interopDefault(LoadingSpinner);
 var history__default = /*#__PURE__*/_interopDefault(history);
 var _Reflect$construct__default = /*#__PURE__*/_interopDefault(_Reflect$construct);
 var _sliceInstanceProperty__default = /*#__PURE__*/_interopDefault(_sliceInstanceProperty);
+var _setTimeout__default = /*#__PURE__*/_interopDefault(_setTimeout);
 var _Object$fromEntries__default = /*#__PURE__*/_interopDefault(_Object$fromEntries);
 var _flagsInstanceProperty__default = /*#__PURE__*/_interopDefault(_flagsInstanceProperty);
 var combineAdapters__default = /*#__PURE__*/_interopDefault(combineAdapters);
@@ -115,9 +117,9 @@ var _JSON$stringify__default = /*#__PURE__*/_interopDefault(_JSON$stringify);
 var _someInstanceProperty__default = /*#__PURE__*/_interopDefault(_someInstanceProperty);
 
 // NOTE: This string will be replaced on build time with the package version.
-var applicationShellVersion = "22.20.0";
+var applicationShellVersion = "22.22.0";
 
-const RequestsInFlightLoader = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./requests-in-flight-loader-7260582b.cjs.prod.js' /* webpackChunkName: "requests-in-flight-loader" */); }));
+const RequestsInFlightLoader = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./requests-in-flight-loader-6e83541c.cjs.prod.js' /* webpackChunkName: "requests-in-flight-loader" */); }));
 
 // Attempt to load the `projectKey` from localStorage
 function selectProjectKeyFromLocalStorage() {
@@ -392,7 +394,7 @@ ProjectSwitcher.displayName = 'ProjectSwitcher';
 // eslint-disable-next-line import/prefer-default-export
 const REQUESTS_IN_FLIGHT_LOADER_DOM_ID = 'loader-for-requests-in-flight';
 
-const UserSettingsMenu = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-settings-menu-daa096fd.cjs.prod.js' /* webpackChunkName: "user-settings-menu" */); }));
+const UserSettingsMenu = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-settings-menu-d592fb2e.cjs.prod.js' /* webpackChunkName: "user-settings-menu" */); }));
 
 var _ref$1 = {
   name: "zjik7",
@@ -585,9 +587,9 @@ FetchUser.propTypes = {
 };
 FetchUser.displayName = 'FetchUser';
 
-const Navbar = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./navbar-91d24894.cjs.prod.js' /* webpackChunkName: "navbar" */); }));
+const Navbar = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./navbar-a138be79.cjs.prod.js' /* webpackChunkName: "navbar" */); }));
 
-const ProjectContainer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./project-container-143e5c11.cjs.prod.js' /* webpackChunkName: "project-container" */); }));
+const ProjectContainer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./project-container-017c69c1.cjs.prod.js' /* webpackChunkName: "project-container" */); }));
 
 const getSelectedDataLocaleForProject = projectLocales => {
   const cachedDataLocale = window.localStorage.getItem(constants.STORAGE_KEYS.SELECTED_DATA_LOCALE);
@@ -699,7 +701,7 @@ var pimIndexerStates = {
   NOT_INDEXED: 'NOT_INDEXED'
 };
 
-const QuickAccess = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./quick-access-4536163d.cjs.prod.js' /* webpackChunkName: "quick-access" */); }));
+const QuickAccess = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./quick-access-6231d22e.cjs.prod.js' /* webpackChunkName: "quick-access" */); }));
 
 const QuickAccessTrigger = props => {
   const _useState = react.useState(false),
@@ -786,7 +788,7 @@ const QuickAccessTrigger = props => {
 QuickAccessTrigger.propTypes = {};
 QuickAccessTrigger.displayName = 'QuickAccessTrigger';
 
-const RedirectToLogout = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-logout-b18f9c37.cjs.prod.js' /* webpackChunkName: "redirect-to-logout" */); }));
+const RedirectToLogout = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-logout-cabd6bba.cjs.prod.js' /* webpackChunkName: "redirect-to-logout" */); }));
 
 const RedirectToProjectCreate = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-project-create-c962f72f.cjs.prod.js' /* webpackChunkName: "redirect-to-project-create" */); }));
 
@@ -822,6 +824,39 @@ const useAllMenuFeatureToggles = () => {
 function ownKeys$7(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$7(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$7(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$7(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
 var AllFeaturesQuery = { kind: "Document", definitions: [{ kind: "OperationDefinition", operation: "query", name: { kind: "Name", value: "AllFeatures" }, variableDefinitions: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "allFeatures" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "reason" }, arguments: [], directives: [] }] } }] } }], loc: { start: 0, end: 72, source: { body: "query AllFeatures {\n  allFeatures {\n    name\n    value\n    reason\n  }\n}\n", name: "GraphQL request", locationOffset: { line: 1, column: 1 } } } };
+const WAIT_FOR_REMOTE_FLAGS_TIMEOUT = 500; // milliseconds
+
+const StatusAwareRenderer = props => {
+  const _useState = react.useState(!props.shouldWaitForRemoteFlags),
+    _useState2 = _slicedToArray(_useState, 2),
+    shouldRender = _useState2[0],
+    setShouldRender = _useState2[1];
+  const _useAdapterStatus = reactBroadcast.useAdapterStatus(),
+    isReady = _useAdapterStatus.isReady;
+  const displayTimeout = react.useRef();
+  if (isReady && !shouldRender) {
+    setShouldRender(true);
+    clearTimeout(displayTimeout.current);
+  }
+  react.useEffect(() => {
+    displayTimeout.current = _setTimeout__default["default"](() => {
+      setShouldRender(true);
+    }, WAIT_FOR_REMOTE_FLAGS_TIMEOUT);
+    return () => {
+      clearTimeout(displayTimeout.current);
+    };
+  }, []);
+  return shouldRender ? jsxRuntime.jsx(jsxRuntime.Fragment, {
+    children: props.children
+  }) : null;
+};
+StatusAwareRenderer.propTypes = {
+  shouldWaitForRemoteFlags: _pt__default["default"].bool,
+  children: _pt__default["default"].node.isRequired
+};
+StatusAwareRenderer.defaultProps = {
+  shouldWaitForRemoteFlags: true
+};
 // This value is hard-coded here because we want to make sure that the
 // app uses our account of LD. The value is meant to be public, so there
 // is no need to be concerned about security.
@@ -901,24 +936,28 @@ const SetupFlopFlipProvider = props => {
     adapterArgs: adapterArgs,
     defaultFlags: defaultFlags,
     shouldDeferAdapterConfiguration: typeof props.shouldDeferAdapterConfiguration === 'boolean' ? props.shouldDeferAdapterConfiguration : !props.user || allMenuFeatureToggles.isLoading,
-    children: props.children
+    children: jsxRuntime.jsx(StatusAwareRenderer, {
+      shouldWaitForRemoteFlags: props.shouldWaitForRemoteFlags,
+      children: props.children
+    })
   });
 };
 SetupFlopFlipProvider.propTypes = {};
 SetupFlopFlipProvider.displayName = 'SetupFlopFlipProvider';
 
+const NewColoursSchemaAnnouncementDialog = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./new-colors-schema-announcement-dialog-661fb5e5.cjs.prod.js'); }));
 const ThemeSwitcher = () => {
   const isRecolouringThemeEnabled = reactBroadcast.useFeatureToggle(constants.featureFlags.RECOLOURING);
   const theme = isRecolouringThemeEnabled ? 'recolouring' : 'default';
-  return jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: jsxRuntime.jsx(designSystem.ThemeProvider, {
+  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [jsxRuntime.jsx(designSystem.ThemeProvider, {
       theme: theme,
       themeOverrides: applicationComponents.themesOverrides[theme]
-    })
+    }), isRecolouringThemeEnabled && jsxRuntime.jsx(NewColoursSchemaAnnouncementDialog, {})]
   });
 };
 
-const VersionTracker = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./version-tracker-cfc94c34.cjs.prod.js' /* webpackChunkName: "version-tracker" */); }));
+const VersionTracker = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./version-tracker-4e5f25fe.cjs.prod.js' /* webpackChunkName: "version-tracker" */); }));
 
 function ownKeys$6(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var _context2, _context3; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context2 = ownKeys$6(Object(t), !0)).call(_context2, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context3 = ownKeys$6(Object(t))).call(_context3, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
@@ -1396,7 +1435,7 @@ const hasCachedAuthenticationState = () => {
   return window.localStorage.getItem(constants.STORAGE_KEYS.IS_AUTHENTICATED) === 'true';
 };
 
-const OidcCallback = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./oidc-callback-81e4d37c.cjs.prod.js' /* webpackChunkName: "oidc-callback" */); }));
+const OidcCallback = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./oidc-callback-0688e093.cjs.prod.js' /* webpackChunkName: "oidc-callback" */); }));
 
 function ownKeys$4(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var _context, _context2; var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$4(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$4(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
@@ -1546,7 +1585,7 @@ const ApplicationShellProvider = props => {
 ApplicationShellProvider.propTypes = {};
 ApplicationShellProvider.displayName = 'ApplicationShellProvider';
 
-const RedirectToLogin = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-login-ad874fb5.cjs.prod.js' /* webpackChunkName: "redirect-to-login" */); }));
+const RedirectToLogin = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-login-4d8f6f3c.cjs.prod.js' /* webpackChunkName: "redirect-to-login" */); }));
 
 const styles = {
   name: "gx7yk8",
@@ -1594,6 +1633,7 @@ const ApplicationShell = props => {
               children: jsxRuntime.jsx(ApplicationShellAuthenticated, {
                 defaultFeatureFlags: props.defaultFeatureFlags,
                 featureFlags: props.featureFlags,
+                shouldWaitForRemoteFlags: props.shouldWaitForRemoteFlags,
                 render: props.render,
                 applicationMessages: props.applicationMessages,
                 onMenuItemClick: props.onMenuItemClick,
@@ -1612,7 +1652,7 @@ ApplicationShell.propTypes = {};
 ApplicationShell.displayName = 'ApplicationShell';
 ApplicationShell.version = applicationShellVersion;
 
-const CustomViewDevHost = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./custom-view-dev-host-f81ab446.cjs.prod.js' /* webpackChunkName: "custom-view-dev-host" */); }));
+const CustomViewDevHost = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./custom-view-dev-host-b588e152.cjs.prod.js' /* webpackChunkName: "custom-view-dev-host" */); }));
 
 function CustomViewFlopFlipProvider(props) {
   var _props$user2;

package/dist/{navbar-0d4b58c1.esm.js → navbar-7645ab1b.esm.js}

@@ -26,7 +26,7 @@ import _styled from '@emotion/styled/base';
 import { css, keyframes, Global } from '@emotion/react';
 import { designTokens as designTokens$1 } from '@commercetools-frontend/application-components';
 import { designTokens } from '@commercetools-uikit/design-system';
-import { N as NAVBAR, D as DIMENSIONS, W as WINDOW_SIZES } from './oidc-ff53dfd3.esm.js';
+import { N as NAVBAR, D as DIMENSIONS, W as WINDOW_SIZES } from './oidc-731e806d.esm.js';
 import _objectWithoutProperties from '@babel/runtime-corejs3/helpers/esm/objectWithoutProperties';
 import _includesInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/includes';
 import _everyInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/every';

package/dist/{navbar-91d24894.cjs.prod.js → navbar-a138be79.cjs.prod.js}

@@ -28,7 +28,7 @@ var _styled = require('@emotion/styled/base');
 var react = require('@emotion/react');
 var applicationComponents = require('@commercetools-frontend/application-components');
 var designSystem = require('@commercetools-uikit/design-system');
-var oidc = require('./oidc-cfa56c46.cjs.prod.js');
+var oidc = require('./oidc-72a01b56.cjs.prod.js');
 var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 var _includesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/includes');
 var _everyInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/every');

package/dist/{navbar-2c01bcc6.cjs.dev.js → navbar-bb30c5fb.cjs.dev.js}

@@ -28,7 +28,7 @@ var _styled = require('@emotion/styled/base');
 var react = require('@emotion/react');
 var applicationComponents = require('@commercetools-frontend/application-components');
 var designSystem = require('@commercetools-uikit/design-system');
-var oidc = require('./oidc-63e926e1.cjs.dev.js');
+var oidc = require('./oidc-527b8b2c.cjs.dev.js');
 var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
 var _includesInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/includes');
 var _everyInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/every');

package/dist/new-colors-schema-announcement-dialog-61de0991.cjs.dev.js

@@ -0,0 +1,82 @@
+'use strict';
+
+var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
+var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
+var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
+var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
+var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
+var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
+var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
+var react = require('react');
+var reactIntl = require('react-intl');
+var applicationComponents = require('@commercetools-frontend/application-components');
+var mcRecolouringAnnouncementSVG = require('@commercetools-frontend/assets/images/mc-recolouring-announcement.svg');
+var Spacings = require('@commercetools-uikit/spacings');
+var Text = require('@commercetools-uikit/text');
+var oidc = require('./oidc-527b8b2c.cjs.dev.js');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+require('@babel/runtime-corejs3/core-js-stable/instance/concat');
+require('@babel/runtime-corejs3/core-js-stable/instance/map');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
+var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
+var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
+var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
+var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
+var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
+var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
+var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
+var mcRecolouringAnnouncementSVG__default = /*#__PURE__*/_interopDefault(mcRecolouringAnnouncementSVG);
+var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
+var Text__default = /*#__PURE__*/_interopDefault(Text);
+
+var messages = reactIntl.defineMessages({
+  title: {
+    id: 'NewColoursSchemaAnnouncementDialog.title',
+    defaultMessage: "We've refreshed our Merchant Center!"
+  },
+  content: {
+    id: 'NewColoursSchemaAnnouncementDialog.content',
+    defaultMessage: "From the new colors to an updated navigation, we've made a few changes to improve your experience within Merchant Center. You will also find that we are taking steps to ensure a consistent look and feel across all of our user tooling, from the Merchant Center to the Frontend Studio. Check out the updates!"
+  }
+});
+
+function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](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__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+const NewColoursSchemaAnnouncementDialog = () => {
+  const intl = reactIntl.useIntl();
+  const _useState = react.useState(window.localStorage.getItem(oidc.STORAGE_KEYS.IS_RECOLOURING_NOTIFICATION_CLOSED) === 'true'),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasUserSeenRecolouringNotificationDialog = _useState2[0],
+    setHasUserSeenRecolouringNotificationDialog = _useState2[1];
+  const handleCloseDialog = () => {
+    window.localStorage.setItem(oidc.STORAGE_KEYS.IS_RECOLOURING_NOTIFICATION_CLOSED, 'true');
+    setHasUserSeenRecolouringNotificationDialog(true);
+  };
+  return !hasUserSeenRecolouringNotificationDialog ? jsxRuntime.jsx(applicationComponents.InfoDialog, {
+    title: intl.formatMessage(messages.title),
+    isOpen: true,
+    onClose: handleCloseDialog,
+    size: "l",
+    children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+      scale: "xl",
+      children: [jsxRuntime.jsx("img", {
+        style: {
+          height: '300px',
+          padding: '16px 16px 0'
+        },
+        src: mcRecolouringAnnouncementSVG__default["default"],
+        alt: "merchant center redesign announcement"
+      }), jsxRuntime.jsx(Text__default["default"].Body, {
+        children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread({}, messages.content))
+      })]
+    })
+  }) : null;
+};
+
+exports["default"] = NewColoursSchemaAnnouncementDialog;

package/dist/new-colors-schema-announcement-dialog-661fb5e5.cjs.prod.js

@@ -0,0 +1,82 @@
+'use strict';
+
+var _Object$keys = require('@babel/runtime-corejs3/core-js-stable/object/keys');
+var _Object$getOwnPropertySymbols = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
+var _filterInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/filter');
+var _Object$getOwnPropertyDescriptor = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor');
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+var _Object$getOwnPropertyDescriptors = require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors');
+var _Object$defineProperties = require('@babel/runtime-corejs3/core-js-stable/object/define-properties');
+var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/object/define-property');
+var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
+var _slicedToArray = require('@babel/runtime-corejs3/helpers/slicedToArray');
+var react = require('react');
+var reactIntl = require('react-intl');
+var applicationComponents = require('@commercetools-frontend/application-components');
+var mcRecolouringAnnouncementSVG = require('@commercetools-frontend/assets/images/mc-recolouring-announcement.svg');
+var Spacings = require('@commercetools-uikit/spacings');
+var Text = require('@commercetools-uikit/text');
+var oidc = require('./oidc-72a01b56.cjs.prod.js');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+require('@babel/runtime-corejs3/core-js-stable/instance/concat');
+require('@babel/runtime-corejs3/core-js-stable/instance/map');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var _Object$keys__default = /*#__PURE__*/_interopDefault(_Object$keys);
+var _Object$getOwnPropertySymbols__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertySymbols);
+var _filterInstanceProperty__default = /*#__PURE__*/_interopDefault(_filterInstanceProperty);
+var _Object$getOwnPropertyDescriptor__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptor);
+var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
+var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_Object$getOwnPropertyDescriptors);
+var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
+var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
+var mcRecolouringAnnouncementSVG__default = /*#__PURE__*/_interopDefault(mcRecolouringAnnouncementSVG);
+var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
+var Text__default = /*#__PURE__*/_interopDefault(Text);
+
+var messages = reactIntl.defineMessages({
+  title: {
+    id: 'NewColoursSchemaAnnouncementDialog.title',
+    defaultMessage: "We've refreshed our Merchant Center!"
+  },
+  content: {
+    id: 'NewColoursSchemaAnnouncementDialog.content',
+    defaultMessage: "From the new colors to an updated navigation, we've made a few changes to improve your experience within Merchant Center. You will also find that we are taking steps to ensure a consistent look and feel across all of our user tooling, from the Merchant Center to the Frontend Studio. Check out the updates!"
+  }
+});
+
+function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Object$getOwnPropertySymbols__default["default"]) { var o = _Object$getOwnPropertySymbols__default["default"](e); r && (o = _filterInstanceProperty__default["default"](o).call(o, function (r) { return _Object$getOwnPropertyDescriptor__default["default"](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__default["default"](_context = ownKeys(Object(t), !0)).call(_context, function (r) { _defineProperty(e, r, t[r]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](e, _Object$getOwnPropertyDescriptors__default["default"](t)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
+const NewColoursSchemaAnnouncementDialog = () => {
+  const intl = reactIntl.useIntl();
+  const _useState = react.useState(window.localStorage.getItem(oidc.STORAGE_KEYS.IS_RECOLOURING_NOTIFICATION_CLOSED) === 'true'),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasUserSeenRecolouringNotificationDialog = _useState2[0],
+    setHasUserSeenRecolouringNotificationDialog = _useState2[1];
+  const handleCloseDialog = () => {
+    window.localStorage.setItem(oidc.STORAGE_KEYS.IS_RECOLOURING_NOTIFICATION_CLOSED, 'true');
+    setHasUserSeenRecolouringNotificationDialog(true);
+  };
+  return !hasUserSeenRecolouringNotificationDialog ? jsxRuntime.jsx(applicationComponents.InfoDialog, {
+    title: intl.formatMessage(messages.title),
+    isOpen: true,
+    onClose: handleCloseDialog,
+    size: "l",
+    children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+      scale: "xl",
+      children: [jsxRuntime.jsx("img", {
+        style: {
+          height: '300px',
+          padding: '16px 16px 0'
+        },
+        src: mcRecolouringAnnouncementSVG__default["default"],
+        alt: "merchant center redesign announcement"
+      }), jsxRuntime.jsx(Text__default["default"].Body, {
+        children: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread({}, messages.content))
+      })]
+    })
+  }) : null;
+};
+
+exports["default"] = NewColoursSchemaAnnouncementDialog;

package/dist/new-colors-schema-announcement-dialog-d3c05dce.esm.js

@@ -0,0 +1,66 @@
+import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
+import _Object$getOwnPropertySymbols from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
+import _filterInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/filter';
+import _Object$getOwnPropertyDescriptor from '@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor';
+import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/for-each';
+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 _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import { useState } from 'react';
+import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
+import { InfoDialog } from '@commercetools-frontend/application-components';
+import mcRecolouringAnnouncementSVG from '@commercetools-frontend/assets/images/mc-recolouring-announcement.svg';
+import Spacings from '@commercetools-uikit/spacings';
+import Text from '@commercetools-uikit/text';
+import { c as STORAGE_KEYS } from './oidc-731e806d.esm.js';
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
+import '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import '@babel/runtime-corejs3/core-js-stable/instance/map';
+
+var messages = defineMessages({
+  title: {
+    id: 'NewColoursSchemaAnnouncementDialog.title',
+    defaultMessage: "We've refreshed our Merchant Center!"
+  },
+  content: {
+    id: 'NewColoursSchemaAnnouncementDialog.content',
+    defaultMessage: "From the new colors to an updated navigation, we've made a few changes to improve your experience within Merchant Center. You will also find that we are taking steps to ensure a consistent look and feel across all of our user tooling, from the Merchant Center to the Frontend Studio. Check out the updates!"
+  }
+});
+
+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; }
+const NewColoursSchemaAnnouncementDialog = () => {
+  const intl = useIntl();
+  const _useState = useState(window.localStorage.getItem(STORAGE_KEYS.IS_RECOLOURING_NOTIFICATION_CLOSED) === 'true'),
+    _useState2 = _slicedToArray(_useState, 2),
+    hasUserSeenRecolouringNotificationDialog = _useState2[0],
+    setHasUserSeenRecolouringNotificationDialog = _useState2[1];
+  const handleCloseDialog = () => {
+    window.localStorage.setItem(STORAGE_KEYS.IS_RECOLOURING_NOTIFICATION_CLOSED, 'true');
+    setHasUserSeenRecolouringNotificationDialog(true);
+  };
+  return !hasUserSeenRecolouringNotificationDialog ? jsx(InfoDialog, {
+    title: intl.formatMessage(messages.title),
+    isOpen: true,
+    onClose: handleCloseDialog,
+    size: "l",
+    children: jsxs(Spacings.Stack, {
+      scale: "xl",
+      children: [jsx("img", {
+        style: {
+          height: '300px',
+          padding: '16px 16px 0'
+        },
+        src: mcRecolouringAnnouncementSVG,
+        alt: "merchant center redesign announcement"
+      }), jsx(Text.Body, {
+        children: jsx(FormattedMessage, _objectSpread({}, messages.content))
+      })]
+    })
+  }) : null;
+};
+
+export { NewColoursSchemaAnnouncementDialog as default };

package/dist/{oidc-63e926e1.cjs.dev.js → oidc-527b8b2c.cjs.dev.js}

@@ -13,6 +13,9 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
 const DIMENSIONS = {
   header: '56px'
 };
+const STORAGE_KEYS = {
+  IS_RECOLOURING_NOTIFICATION_CLOSED: 'isRecolouringNotificationClosed'
+};
 const NAVBAR = {
   expanderHeight: '50px',
   expanderSize: '40px',
@@ -110,6 +113,7 @@ exports.DIMENSIONS = DIMENSIONS;
 exports.NAVBAR = NAVBAR;
 exports.OIDC_CLAIMS = OIDC_CLAIMS;
 exports.OIDC_RESPONSE_TYPES = OIDC_RESPONSE_TYPES;
+exports.STORAGE_KEYS = STORAGE_KEYS;
 exports.SUSPENSION_REASONS = SUSPENSION_REASONS;
 exports.WINDOW_SIZES = WINDOW_SIZES;
 exports.buildOidcScope = buildOidcScope;

package/dist/{oidc-cfa56c46.cjs.prod.js → oidc-72a01b56.cjs.prod.js}

@@ -13,6 +13,9 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
 const DIMENSIONS = {
   header: '56px'
 };
+const STORAGE_KEYS = {
+  IS_RECOLOURING_NOTIFICATION_CLOSED: 'isRecolouringNotificationClosed'
+};
 const NAVBAR = {
   expanderHeight: '50px',
   expanderSize: '40px',
@@ -110,6 +113,7 @@ exports.DIMENSIONS = DIMENSIONS;
 exports.NAVBAR = NAVBAR;
 exports.OIDC_CLAIMS = OIDC_CLAIMS;
 exports.OIDC_RESPONSE_TYPES = OIDC_RESPONSE_TYPES;
+exports.STORAGE_KEYS = STORAGE_KEYS;
 exports.SUSPENSION_REASONS = SUSPENSION_REASONS;
 exports.WINDOW_SIZES = WINDOW_SIZES;
 exports.buildOidcScope = buildOidcScope;

package/dist/{oidc-ff53dfd3.esm.js → oidc-731e806d.esm.js}

@@ -5,6 +5,9 @@ import _forEachInstanceProperty from '@babel/runtime-corejs3/core-js-stable/inst
 const DIMENSIONS = {
   header: '56px'
 };
+const STORAGE_KEYS = {
+  IS_RECOLOURING_NOTIFICATION_CLOSED: 'isRecolouringNotificationClosed'
+};
 const NAVBAR = {
   expanderHeight: '50px',
   expanderSize: '40px',
@@ -97,4 +100,4 @@ const buildOidcScope = options => {
   ...claims].join(' ');
 };
 
-export { CONTAINERS as C, DIMENSIONS as D, NAVBAR as N, OIDC_CLAIMS as O, SUSPENSION_REASONS as S, WINDOW_SIZES as W, OIDC_RESPONSE_TYPES as a, buildOidcScope as b };
+export { CONTAINERS as C, DIMENSIONS as D, NAVBAR as N, OIDC_CLAIMS as O, SUSPENSION_REASONS as S, WINDOW_SIZES as W, OIDC_RESPONSE_TYPES as a, buildOidcScope as b, STORAGE_KEYS as c };

package/dist/{oidc-callback-81e4d37c.cjs.prod.js → oidc-callback-0688e093.cjs.prod.js}

@@ -22,7 +22,7 @@ var icons = require('@commercetools-uikit/icons');
 var notifications = require('@commercetools-uikit/notifications');
 var Spacings = require('@commercetools-uikit/spacings');
 var Text = require('@commercetools-uikit/text');
-var dist_commercetoolsFrontendApplicationShell = require('./index-bcb52bd1.cjs.prod.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-dfc86bb9.cjs.prod.js');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 require('@babel/runtime-corejs3/core-js-stable/object/keys');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
@@ -55,7 +55,7 @@ require('redux-logger');
 require('@babel/runtime-corejs3/core-js-stable/instance/find');
 require('@babel/runtime-corejs3/core-js-stable/array/is-array');
 require('@emotion/react');
-require('./oidc-cfa56c46.cjs.prod.js');
+require('./oidc-72a01b56.cjs.prod.js');
 require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 require('@babel/runtime-corejs3/core-js-stable/instance/map');
 require('react-intl');
@@ -75,6 +75,7 @@ require('@babel/runtime-corejs3/helpers/createClass');
 require('@babel/runtime-corejs3/helpers/inherits');
 require('@babel/runtime-corejs3/helpers/possibleConstructorReturn');
 require('@babel/runtime-corejs3/helpers/getPrototypeOf');
+require('@babel/runtime-corejs3/core-js-stable/set-timeout');
 require('@babel/runtime-corejs3/core-js-stable/object/from-entries');
 require('@babel/runtime-corejs3/core-js-stable/instance/flags');
 require('@apollo/client/react');

package/dist/{oidc-callback-82606c7b.esm.js → oidc-callback-4463eeb9.esm.js}

@@ -20,7 +20,7 @@ import { AngleLeftIcon } from '@commercetools-uikit/icons';
 import { ContentNotification } from '@commercetools-uikit/notifications';
 import Spacings from '@commercetools-uikit/spacings';
 import Text from '@commercetools-uikit/text';
-import { C as ConfigureIntlProvider } from './index-c52c0886.esm.js';
+import { C as ConfigureIntlProvider } from './index-4f6bae3a.esm.js';
 import { jsx, jsxs } from '@emotion/react/jsx-runtime';
 import '@babel/runtime-corejs3/core-js-stable/object/keys';
 import '@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols';
@@ -53,7 +53,7 @@ import 'redux-logger';
 import '@babel/runtime-corejs3/core-js-stable/instance/find';
 import '@babel/runtime-corejs3/core-js-stable/array/is-array';
 import '@emotion/react';
-import './oidc-ff53dfd3.esm.js';
+import './oidc-731e806d.esm.js';
 import '@babel/runtime-corejs3/core-js-stable/instance/concat';
 import '@babel/runtime-corejs3/core-js-stable/instance/map';
 import 'react-intl';
@@ -73,6 +73,7 @@ import '@babel/runtime-corejs3/helpers/createClass';
 import '@babel/runtime-corejs3/helpers/inherits';
 import '@babel/runtime-corejs3/helpers/possibleConstructorReturn';
 import '@babel/runtime-corejs3/helpers/getPrototypeOf';
+import '@babel/runtime-corejs3/core-js-stable/set-timeout';
 import '@babel/runtime-corejs3/core-js-stable/object/from-entries';
 import '@babel/runtime-corejs3/core-js-stable/instance/flags';
 import '@apollo/client/react';

package/dist/{oidc-callback-b07b3a65.cjs.dev.js → oidc-callback-b8c22ca0.cjs.dev.js}

@@ -22,7 +22,7 @@ var icons = require('@commercetools-uikit/icons');
 var notifications = require('@commercetools-uikit/notifications');
 var Spacings = require('@commercetools-uikit/spacings');
 var Text = require('@commercetools-uikit/text');
-var dist_commercetoolsFrontendApplicationShell = require('./index-0f623820.cjs.dev.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-5d3ef139.cjs.dev.js');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 require('@babel/runtime-corejs3/core-js-stable/object/keys');
 require('@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols');
@@ -55,7 +55,7 @@ require('redux-logger');
 require('@babel/runtime-corejs3/core-js-stable/instance/find');
 require('@babel/runtime-corejs3/core-js-stable/array/is-array');
 require('@emotion/react');
-require('./oidc-63e926e1.cjs.dev.js');
+require('./oidc-527b8b2c.cjs.dev.js');
 require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 require('@babel/runtime-corejs3/core-js-stable/instance/map');
 require('react-intl');
@@ -75,6 +75,7 @@ require('@babel/runtime-corejs3/helpers/createClass');
 require('@babel/runtime-corejs3/helpers/inherits');
 require('@babel/runtime-corejs3/helpers/possibleConstructorReturn');
 require('@babel/runtime-corejs3/helpers/getPrototypeOf');
+require('@babel/runtime-corejs3/core-js-stable/set-timeout');
 require('@babel/runtime-corejs3/core-js-stable/object/from-entries');
 require('@babel/runtime-corejs3/core-js-stable/instance/flags');
 require('@apollo/client/react');