@commercetools-frontend/application-shell 22.18.0 → 22.19.0

package/dist/commercetools-frontend-application-shell.cjs.dev.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var dist_commercetoolsFrontendApplicationShell = require('./index-f4019b48.cjs.dev.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-fe871c79.cjs.dev.js');
 var index = require('./index-37a25e51.cjs.dev.js');
 var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var ssr = require('@commercetools-frontend/application-config/ssr');
@@ -72,6 +72,7 @@ require('lodash/upperFirst');
 require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
 require('@commercetools-uikit/design-system/materials/resets.css');
 require('@commercetools-frontend/permissions');
+require('@flopflip/memory-adapter');
 require('@babel/runtime-corejs3/core-js-stable/json/stringify');
 require('@babel/runtime-corejs3/core-js-stable/instance/some');
 require('@commercetools-frontend/actions-global');

package/dist/commercetools-frontend-application-shell.cjs.prod.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var dist_commercetoolsFrontendApplicationShell = require('./index-e9dcdd6b.cjs.prod.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-e452a65f.cjs.prod.js');
 var index = require('./index-6cd618cc.cjs.prod.js');
 var applicationShellConnectors = require('@commercetools-frontend/application-shell-connectors');
 var ssr = require('@commercetools-frontend/application-config/ssr');
@@ -72,6 +72,7 @@ require('lodash/upperFirst');
 require('@babel/runtime-corejs3/core-js-stable/instance/starts-with');
 require('@commercetools-uikit/design-system/materials/resets.css');
 require('@commercetools-frontend/permissions');
+require('@flopflip/memory-adapter');
 require('@babel/runtime-corejs3/core-js-stable/json/stringify');
 require('@babel/runtime-corejs3/core-js-stable/instance/some');
 require('@commercetools-frontend/actions-global');

package/dist/commercetools-frontend-application-shell.esm.js

@@ -1,4 +1,4 @@
-export { g as ApplicationPageTitle, A as ApplicationShell, f as ApplicationShellProvider, C as ConfigureIntlProvider, h as CustomViewShell, I as InjectReducers, S as SetupFlopFlipProvider, i as SuspendedRoute, s as setupGlobalErrorListener, u as useRoutesCreator, d as version } from './index-cb9692b6.esm.js';
+export { g as ApplicationPageTitle, A as ApplicationShell, f as ApplicationShellProvider, C as ConfigureIntlProvider, h as CustomViewShell, I as InjectReducers, S as SetupFlopFlipProvider, i as SuspendedRoute, s as setupGlobalErrorListener, u as useRoutesCreator, d as version } from './index-fe5ba32e.esm.js';
 export { R as RouteCatchAll, a as applyDefaultMiddlewares } from './index-89e5711a.esm.js';
 export { buildApiUrl, createApolloClient, createApolloContextForProxyForwardTo, createHttpClientOptions, executeHttpClientRequest, getMcApiUrl, selectProjectKeyFromUrl, selectUserId, useMcLazyQuery, useMcMutation, useMcQuery } from '@commercetools-frontend/application-shell-connectors';
 export { entryPointUriPathToPermissionKeys, entryPointUriPathToResourceAccesses } from '@commercetools-frontend/application-config/ssr';
@@ -68,6 +68,7 @@ import 'lodash/upperFirst';
 import '@babel/runtime-corejs3/core-js-stable/instance/starts-with';
 import '@commercetools-uikit/design-system/materials/resets.css';
 import '@commercetools-frontend/permissions';
+import '@flopflip/memory-adapter';
 import '@babel/runtime-corejs3/core-js-stable/json/stringify';
 import '@babel/runtime-corejs3/core-js-stable/instance/some';
 import '@commercetools-frontend/actions-global';

package/dist/{custom-view-dev-host-ca22b6ea.cjs.prod.js → custom-view-dev-host-07deb1be.cjs.prod.js}

@@ -12,7 +12,7 @@ var Constraints = require('@commercetools-uikit/constraints');
 var PrimaryButton = require('@commercetools-uikit/primary-button');
 var Spacings = require('@commercetools-uikit/spacings');
 var Text = require('@commercetools-uikit/text');
-var dist_commercetoolsFrontendApplicationShell = require('./index-e9dcdd6b.cjs.prod.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-e452a65f.cjs.prod.js');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 require('./index-6cd618cc.cjs.prod.js');
 require('@babel/runtime-corejs3/core-js-stable/object/keys');
@@ -81,6 +81,7 @@ require('lodash/upperFirst');
 require('@commercetools-uikit/design-system/materials/resets.css');
 require('@commercetools-frontend/application-config/ssr');
 require('@commercetools-frontend/permissions');
+require('@flopflip/memory-adapter');
 require('@babel/runtime-corejs3/core-js-stable/json/stringify');
 require('@babel/runtime-corejs3/core-js-stable/instance/some');
 require('@commercetools-frontend/actions-global');

package/dist/{custom-view-dev-host-7f4b9f06.cjs.dev.js → custom-view-dev-host-86bf92ba.cjs.dev.js}

@@ -12,7 +12,7 @@ var Constraints = require('@commercetools-uikit/constraints');
 var PrimaryButton = require('@commercetools-uikit/primary-button');
 var Spacings = require('@commercetools-uikit/spacings');
 var Text = require('@commercetools-uikit/text');
-var dist_commercetoolsFrontendApplicationShell = require('./index-f4019b48.cjs.dev.js');
+var dist_commercetoolsFrontendApplicationShell = require('./index-fe871c79.cjs.dev.js');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 require('./index-37a25e51.cjs.dev.js');
 require('@babel/runtime-corejs3/core-js-stable/object/keys');
@@ -81,6 +81,7 @@ require('lodash/upperFirst');
 require('@commercetools-uikit/design-system/materials/resets.css');
 require('@commercetools-frontend/application-config/ssr');
 require('@commercetools-frontend/permissions');
+require('@flopflip/memory-adapter');
 require('@babel/runtime-corejs3/core-js-stable/json/stringify');
 require('@babel/runtime-corejs3/core-js-stable/instance/some');
 require('@commercetools-frontend/actions-global');

package/dist/{custom-view-dev-host-b4ef2628.esm.js → custom-view-dev-host-aa75f95a.esm.js}

@@ -10,7 +10,7 @@ import Constraints from '@commercetools-uikit/constraints';
 import PrimaryButton from '@commercetools-uikit/primary-button';
 import Spacings from '@commercetools-uikit/spacings';
 import Text from '@commercetools-uikit/text';
-import { A as ApplicationShell } from './index-cb9692b6.esm.js';
+import { A as ApplicationShell } from './index-fe5ba32e.esm.js';
 import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
 import './index-89e5711a.esm.js';
 import '@babel/runtime-corejs3/core-js-stable/object/keys';
@@ -79,6 +79,7 @@ import 'lodash/upperFirst';
 import '@commercetools-uikit/design-system/materials/resets.css';
 import '@commercetools-frontend/application-config/ssr';
 import '@commercetools-frontend/permissions';
+import '@flopflip/memory-adapter';
 import '@babel/runtime-corejs3/core-js-stable/json/stringify';
 import '@babel/runtime-corejs3/core-js-stable/instance/some';
 import '@commercetools-frontend/actions-global';

package/dist/declarations/src/components/custom-view-flop-flip-provider/custom-view-flop-flip-provider.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+import { TFlags } from '@flopflip/types';
+import { TFetchLoggedInUserQuery } from '../../types/generated/mc';
+type TCustomViewFlopFlipProviderProps = {
+    user?: TFetchLoggedInUserQuery['user'];
+    flags?: TFlags;
+    children: ReactNode;
+};
+declare function CustomViewFlopFlipProvider(props: TCustomViewFlopFlipProviderProps): import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
+export default CustomViewFlopFlipProvider;

package/dist/declarations/src/components/custom-view-flop-flip-provider/index.d.ts

@@ -0,0 +1 @@
+export { default } from './custom-view-flop-flip-provider';

package/dist/declarations/src/components/custom-view-shell/custom-view-shell.styles.d.ts

@@ -6,4 +6,11 @@ export declare const customViewsThemesOverrides: {
         paddingForMainPageHeader: string;
         paddingForTabularPageHeader: string;
     };
+    recolouring: {
+        marginForCustomViewsSelectorAsTabular: string;
+        marginForPageContent: string;
+        paddingForDetailPageHeader: string;
+        paddingForMainPageHeader: string;
+        paddingForTabularPageHeader: string;
+    };
 };

package/dist/declarations/src/components/custom-view-shell-authenticated/custom-view-shell-authenticated.d.ts

@@ -1,4 +1,5 @@
 import { type ReactNode } from 'react';
+import { TFlags } from '@flopflip/types';
 import { type ApplicationWindow, type CustomViewData } from '@commercetools-frontend/constants';
 import { type TAsyncLocaleDataProps } from '@commercetools-frontend/i18n';
 type TCustomViewShellAuthenticatedProps = {
@@ -6,6 +7,7 @@ type TCustomViewShellAuthenticatedProps = {
     environment: ApplicationWindow['app'];
     messages: TAsyncLocaleDataProps['applicationMessages'];
     projectKey?: string;
+    flags?: TFlags;
     customViewConfig: CustomViewData;
     children: ReactNode;
 };

package/dist/{error-apologizer-84dc825c.cjs.prod.js → error-apologizer-3a9b55fd.cjs.dev.js}

@@ -11,7 +11,9 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var reactIntl = require('react-intl');
 var applicationComponents = require('@commercetools-frontend/application-components');
+var UnexpectedErrorSVGRebranding = require('@commercetools-frontend/assets/images/unexpected-error-rebranding.svg');
 var UnexpectedErrorSVG = require('@commercetools-frontend/assets/images/unexpected-error.svg');
+var designSystem = require('@commercetools-uikit/design-system');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -24,6 +26,7 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
 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 UnexpectedErrorSVGRebranding__default = /*#__PURE__*/_interopDefault(UnexpectedErrorSVGRebranding);
 var UnexpectedErrorSVG__default = /*#__PURE__*/_interopDefault(UnexpectedErrorSVG);
 
 var messages = reactIntl.defineMessages({
@@ -41,8 +44,10 @@ function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Objec
 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 ErrorApologizer = () => {
   const intl = reactIntl.useIntl();
+  const _useTheme = designSystem.useTheme(),
+    themedValue = _useTheme.themedValue;
   return jsxRuntime.jsx(applicationComponents.MaintenancePageLayout, {
-    imageSrc: UnexpectedErrorSVG__default["default"],
+    imageSrc: themedValue(UnexpectedErrorSVG__default["default"], UnexpectedErrorSVGRebranding__default["default"]),
     title: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread({}, messages.title)),
     label: intl.formatMessage(messages.title),
     paragraph1: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread({}, messages.notifiedTeam))

package/dist/{error-apologizer-f6793491.cjs.dev.js → error-apologizer-7bc04be1.cjs.prod.js}

@@ -11,7 +11,9 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var reactIntl = require('react-intl');
 var applicationComponents = require('@commercetools-frontend/application-components');
+var UnexpectedErrorSVGRebranding = require('@commercetools-frontend/assets/images/unexpected-error-rebranding.svg');
 var UnexpectedErrorSVG = require('@commercetools-frontend/assets/images/unexpected-error.svg');
+var designSystem = require('@commercetools-uikit/design-system');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -24,6 +26,7 @@ var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachIns
 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 UnexpectedErrorSVGRebranding__default = /*#__PURE__*/_interopDefault(UnexpectedErrorSVGRebranding);
 var UnexpectedErrorSVG__default = /*#__PURE__*/_interopDefault(UnexpectedErrorSVG);
 
 var messages = reactIntl.defineMessages({
@@ -41,8 +44,10 @@ function ownKeys(e, r) { var t = _Object$keys__default["default"](e); if (_Objec
 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 ErrorApologizer = () => {
   const intl = reactIntl.useIntl();
+  const _useTheme = designSystem.useTheme(),
+    themedValue = _useTheme.themedValue;
   return jsxRuntime.jsx(applicationComponents.MaintenancePageLayout, {
-    imageSrc: UnexpectedErrorSVG__default["default"],
+    imageSrc: themedValue(UnexpectedErrorSVG__default["default"], UnexpectedErrorSVGRebranding__default["default"]),
     title: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread({}, messages.title)),
     label: intl.formatMessage(messages.title),
     paragraph1: jsxRuntime.jsx(reactIntl.FormattedMessage, _objectSpread({}, messages.notifiedTeam))

package/dist/{error-apologizer-76f087f4.esm.js → error-apologizer-9bed285b.esm.js}

@@ -9,7 +9,9 @@ import _Object$defineProperty from '@babel/runtime-corejs3/core-js-stable/object
 import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
 import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
 import { MaintenancePageLayout } from '@commercetools-frontend/application-components';
+import UnexpectedErrorSVGRebranding from '@commercetools-frontend/assets/images/unexpected-error-rebranding.svg';
 import UnexpectedErrorSVG from '@commercetools-frontend/assets/images/unexpected-error.svg';
+import { useTheme } from '@commercetools-uikit/design-system';
 import { jsx } from '@emotion/react/jsx-runtime';
 
 var messages = defineMessages({
@@ -27,8 +29,10 @@ 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) { _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 ErrorApologizer = () => {
   const intl = useIntl();
+  const _useTheme = useTheme(),
+    themedValue = _useTheme.themedValue;
   return jsx(MaintenancePageLayout, {
-    imageSrc: UnexpectedErrorSVG,
+    imageSrc: themedValue(UnexpectedErrorSVG, UnexpectedErrorSVGRebranding),
     title: jsx(FormattedMessage, _objectSpread({}, messages.title)),
     label: intl.formatMessage(messages.title),
     paragraph1: jsx(FormattedMessage, _objectSpread({}, messages.notifiedTeam))

package/dist/{index-e9dcdd6b.cjs.prod.js → index-e452a65f.cjs.prod.js}

@@ -69,6 +69,7 @@ var _startsWithInstanceProperty = require('@babel/runtime-corejs3/core-js-stable
 require('@commercetools-uikit/design-system/materials/resets.css');
 var ssr = require('@commercetools-frontend/application-config/ssr');
 var permissions = require('@commercetools-frontend/permissions');
+var memoryAdapter = require('@flopflip/memory-adapter');
 var _JSON$stringify = require('@babel/runtime-corejs3/core-js-stable/json/stringify');
 var _someInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/some');
 var actionsGlobal = require('@commercetools-frontend/actions-global');
@@ -109,13 +110,14 @@ var ldAdapter__default = /*#__PURE__*/_interopDefault(ldAdapter);
 var _reduceInstanceProperty__default = /*#__PURE__*/_interopDefault(_reduceInstanceProperty);
 var upperFirst__default = /*#__PURE__*/_interopDefault(upperFirst);
 var _startsWithInstanceProperty__default = /*#__PURE__*/_interopDefault(_startsWithInstanceProperty);
+var memoryAdapter__default = /*#__PURE__*/_interopDefault(memoryAdapter);
 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.18.0";
+var applicationShellVersion = "22.19.0";
 
-const RequestsInFlightLoader = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./requests-in-flight-loader-6538e2bb.cjs.prod.js' /* webpackChunkName: "requests-in-flight-loader" */); }));
+const RequestsInFlightLoader = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./requests-in-flight-loader-b424edc1.cjs.prod.js' /* webpackChunkName: "requests-in-flight-loader" */); }));
 
 // Attempt to load the `projectKey` from localStorage
 function selectProjectKeyFromLocalStorage() {
@@ -390,7 +392,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-1314b25d.cjs.prod.js' /* webpackChunkName: "user-settings-menu" */); }));
+const UserSettingsMenu = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./user-settings-menu-daa096fd.cjs.prod.js' /* webpackChunkName: "user-settings-menu" */); }));
 
 var _ref$1 = {
   name: "zjik7",
@@ -527,7 +529,7 @@ const ConfigureIntlProvider = props => {
 ConfigureIntlProvider.propTypes = {};
 ConfigureIntlProvider.displayName = 'ConfigureIntlProvider';
 
-const ErrorApologizer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./error-apologizer-84dc825c.cjs.prod.js' /* webpackChunkName: "error-apologizer" */); }));
+const ErrorApologizer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./error-apologizer-7bc04be1.cjs.prod.js' /* webpackChunkName: "error-apologizer" */); }));
 
 var ProjectQuery = { kind: "Document", definitions: [{ kind: "OperationDefinition", operation: "query", name: { kind: "Name", value: "FetchProject" }, variableDefinitions: [{ kind: "VariableDefinition", variable: { kind: "Variable", name: { kind: "Name", value: "projectKey" } }, type: { kind: "NamedType", name: { kind: "Name", value: "String" } }, directives: [] }], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "project" }, arguments: [{ kind: "Argument", name: { kind: "Name", value: "key" }, value: { kind: "Variable", name: { kind: "Name", value: "projectKey" } } }], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "key" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "version" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "countries" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "currencies" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "languages" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "initialized" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "expiry" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "isActive" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "daysLeft" }, arguments: [], directives: [] }] } }, { kind: "Field", name: { kind: "Name", value: "suspension" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "isActive" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "reason" }, arguments: [], directives: [] }] } }, { kind: "Field", name: { kind: "Name", value: "isProductionProject" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "allAppliedPermissions" }, 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: "allAppliedActionRights" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "group" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }] } }, { kind: "Field", name: { kind: "Name", value: "allAppliedDataFences" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "InlineFragment", typeCondition: { kind: "NamedType", name: { kind: "Name", value: "StoreDataFence" } }, directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "type" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "group" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "__typename" }, arguments: [], directives: [] }] } }] } }, { kind: "Field", name: { kind: "Name", value: "allPermissionsForAllApplications" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "allAppliedPermissions" }, 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: "allAppliedActionRights" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "group" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }] } }, { kind: "Field", name: { kind: "Name", value: "allAppliedMenuVisibilities" }, 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: "allAppliedDataFences" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "InlineFragment", typeCondition: { kind: "NamedType", name: { kind: "Name", value: "StoreDataFence" } }, directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "type" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "value" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "group" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "__typename" }, arguments: [], directives: [] }] } }] } }] } }, { kind: "Field", name: { kind: "Name", value: "owner" }, arguments: [], directives: [], selectionSet: { kind: "SelectionSet", selections: [{ kind: "Field", name: { kind: "Name", value: "id" }, arguments: [], directives: [] }, { kind: "Field", name: { kind: "Name", value: "name" }, arguments: [], directives: [] }] } }, { kind: "Field", name: { kind: "Name", value: "sampleDataImportDataset" }, arguments: [], directives: [] }] } }] } }], loc: { start: 0, end: 1049, source: { body: "query FetchProject($projectKey: String) {\n  project(key: $projectKey) {\n    key\n    version\n    name\n    countries\n    currencies\n    languages\n    initialized\n    expiry {\n      isActive\n      daysLeft\n    }\n    suspension {\n      isActive\n      reason\n    }\n    isProductionProject\n    allAppliedPermissions {\n      name\n      value\n    }\n    allAppliedActionRights {\n      group\n      name\n      value\n    }\n    allAppliedDataFences {\n      ... on StoreDataFence {\n        type\n        name\n        value\n        group\n        __typename\n      }\n    }\n    allPermissionsForAllApplications {\n      allAppliedPermissions {\n        name\n        value\n      }\n      allAppliedActionRights {\n        group\n        name\n        value\n      }\n      allAppliedMenuVisibilities {\n        name\n        value\n      }\n      allAppliedDataFences {\n        ... on StoreDataFence {\n          type\n          name\n          value\n          group\n          __typename\n        }\n      }\n    }\n    owner {\n      id\n      name\n    }\n    sampleDataImportDataset\n  }\n}\n", name: "GraphQL request", locationOffset: { line: 1, column: 1 } } } };
 const FetchProject = props => {
@@ -583,9 +585,9 @@ FetchUser.propTypes = {
 };
 FetchUser.displayName = 'FetchUser';
 
-const Navbar = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./navbar-7861442e.cjs.prod.js' /* webpackChunkName: "navbar" */); }));
+const Navbar = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./navbar-681a53df.cjs.prod.js' /* webpackChunkName: "navbar" */); }));
 
-const ProjectContainer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./project-container-fdb07759.cjs.prod.js' /* webpackChunkName: "project-container" */); }));
+const ProjectContainer = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./project-container-554de6c1.cjs.prod.js' /* webpackChunkName: "project-container" */); }));
 
 const getSelectedDataLocaleForProject = projectLocales => {
   const cachedDataLocale = window.localStorage.getItem(constants.STORAGE_KEYS.SELECTED_DATA_LOCALE);
@@ -697,7 +699,7 @@ var pimIndexerStates = {
   NOT_INDEXED: 'NOT_INDEXED'
 };
 
-const QuickAccess = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./quick-access-76e2b7b2.cjs.prod.js' /* webpackChunkName: "quick-access" */); }));
+const QuickAccess = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./quick-access-e5dc862b.cjs.prod.js' /* webpackChunkName: "quick-access" */); }));
 
 const QuickAccessTrigger = props => {
   const _useState = react.useState(false),
@@ -784,7 +786,7 @@ const QuickAccessTrigger = props => {
 QuickAccessTrigger.propTypes = {};
 QuickAccessTrigger.displayName = 'QuickAccessTrigger';
 
-const RedirectToLogout = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-logout-f5c85702.cjs.prod.js' /* webpackChunkName: "redirect-to-logout" */); }));
+const RedirectToLogout = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./redirect-to-logout-ca90976f.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" */); }));
 
@@ -903,15 +905,17 @@ SetupFlopFlipProvider.propTypes = {};
 SetupFlopFlipProvider.displayName = 'SetupFlopFlipProvider';
 
 const ThemeSwitcher = () => {
+  const isRecolouringThemeEnabled = reactBroadcast.useFeatureToggle(constants.featureFlags.RECOLOURING);
+  const theme = isRecolouringThemeEnabled ? 'recolouring' : 'default';
   return jsxRuntime.jsx(jsxRuntime.Fragment, {
     children: jsxRuntime.jsx(designSystem.ThemeProvider, {
-      theme: "default",
-      themeOverrides: applicationComponents.themesOverrides.default
+      theme: theme,
+      themeOverrides: applicationComponents.themesOverrides[theme]
     })
   });
 };
 
-const VersionTracker = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./version-tracker-c96362fe.cjs.prod.js' /* webpackChunkName: "version-tracker" */); }));
+const VersionTracker = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./version-tracker-b283cce0.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; }
@@ -1389,7 +1393,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-976ae406.cjs.prod.js' /* webpackChunkName: "oidc-callback" */); }));
+const OidcCallback = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./oidc-callback-6eda6b00.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; }
@@ -1605,7 +1609,26 @@ ApplicationShell.propTypes = {};
 ApplicationShell.displayName = 'ApplicationShell';
 ApplicationShell.version = applicationShellVersion;
 
-const CustomViewDevHost = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./custom-view-dev-host-ca22b6ea.cjs.prod.js' /* webpackChunkName: "custom-view-dev-host" */); }));
+const CustomViewDevHost = /*#__PURE__*/react.lazy(() => Promise.resolve().then(function () { return require('./custom-view-dev-host-07deb1be.cjs.prod.js' /* webpackChunkName: "custom-view-dev-host" */); }));
+
+function CustomViewFlopFlipProvider(props) {
+  var _props$user2;
+  const adapterArgs = react.useMemo(() => {
+    var _props$user;
+    return {
+      user: {
+        key: (_props$user = props.user) === null || _props$user === void 0 ? void 0 : _props$user.id
+      }
+    };
+  }, [(_props$user2 = props.user) === null || _props$user2 === void 0 ? void 0 : _props$user2.id]);
+  return jsxRuntime.jsx(reactBroadcast.ConfigureFlopFlip, {
+    adapter: memoryAdapter__default["default"],
+    defaultFlags: _flagsInstanceProperty__default["default"](props),
+    adapterArgs: adapterArgs,
+    children: props.children
+  });
+}
+CustomViewFlopFlipProvider.propTypes = {};
 
 function ownKeys$2(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$2(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$2(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$2(Object(t))).call(_context2, function (r) { _Object$defineProperty__default["default"](e, r, _Object$getOwnPropertyDescriptor__default["default"](t, r)); }); } return e; }
@@ -1668,8 +1691,12 @@ function CustomViewShellAuthenticated(props) {
                       project: project,
                       projectDataLocale: props.dataLocale,
                       environment: props.environment,
-                      children: jsxRuntime.jsx(CustomViewWithPermissionCheck, {
-                        children: props.children
+                      children: jsxRuntime.jsx(CustomViewFlopFlipProvider, {
+                        flags: _flagsInstanceProperty__default["default"](props),
+                        user: user,
+                        children: jsxRuntime.jsx(CustomViewWithPermissionCheck, {
+                          children: props.children
+                        })
                       })
                     });
                   }
@@ -1699,6 +1726,13 @@ const customViewsThemesOverrides = {
     paddingForDetailPageHeader: "0 0 ".concat(designSystem.designTokens.spacing40, " 0"),
     paddingForMainPageHeader: '0',
     paddingForTabularPageHeader: '0'
+  },
+  recolouring: {
+    marginForCustomViewsSelectorAsTabular: '0',
+    marginForPageContent: "".concat(designSystem.designTokens.spacing50, " 0"),
+    paddingForDetailPageHeader: "0 0 ".concat(designSystem.designTokens.spacing40, " 0"),
+    paddingForMainPageHeader: '0',
+    paddingForTabularPageHeader: '0'
   }
 };
 
@@ -1745,15 +1779,22 @@ function StrictModeEnablement(props) {
     });
   }
 }
+StrictModeEnablement.propTypes = {};
+function CustomViewThemeProvider() {
+  const theme = reactBroadcast.useFeatureToggle('mcRecolouring') ? 'recolouring' : 'default';
+  const customViewThemeOverrides = _objectSpread$1(_objectSpread$1({}, applicationComponents.themesOverrides[theme]), customViewsThemesOverrides[theme]);
+  return jsxRuntime.jsx(designSystem.ThemeProvider, {
+    theme: theme,
+    themeOverrides: customViewThemeOverrides
+  });
+}
 
 /*
   During e2e tests, the Custom View template is built in production mode but still runs on localhost.
   Checking for local production mode is necessary for applying the development host URL,
   creating an environment for testing interaction with the Custom View template.
 */
-StrictModeEnablement.propTypes = {};
 const isLocalProdMode = window.app.env === 'development';
-const customViewThemeOverrides = _objectSpread$1(_objectSpread$1({}, applicationComponents.themesOverrides.default), customViewsThemesOverrides.default);
 function CustomViewShell(props) {
   var _window$app$__DEVELOP;
   const _useState = react.useState(),
@@ -1822,10 +1863,7 @@ function CustomViewShell(props) {
   }
   const hostUrl = isLocalProdMode ? (_window$app$__DEVELOP = window.app.__DEVELOPMENT__) === null || _window$app$__DEVELOP === void 0 ? void 0 : _window$app$__DEVELOP.customViewHostUrl : hostContext.hostUrl;
   return jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [jsxRuntime.jsx(GlobalStyles, {}), jsxRuntime.jsx(designSystem.ThemeProvider, {
-      theme: "default",
-      themeOverrides: customViewThemeOverrides
-    }), jsxRuntime.jsx(ApplicationShellProvider, {
+    children: [jsxRuntime.jsx(GlobalStyles, {}), jsxRuntime.jsx(ApplicationShellProvider, {
       environment: window.app,
       applicationMessages: props.applicationMessages,
       apolloClient: props.apolloClient,
@@ -1841,8 +1879,9 @@ function CustomViewShell(props) {
               environment: window.app,
               messages: props.applicationMessages,
               projectKey: hostContext.projectKey,
+              flags: hostContext.featureFlags,
               customViewConfig: hostContext.customViewConfig,
-              children: [jsxRuntime.jsx(applicationComponents.PortalsContainer
+              children: [jsxRuntime.jsx(CustomViewThemeProvider, {}), jsxRuntime.jsx(applicationComponents.PortalsContainer
               // @ts-ignore
               , {
                 ref: layoutRefs