@commercetools-frontend/mc-html-template 21.3.3 → 21.5.0

package/dist/commercetools-frontend-mc-html-template.esm.js

@@ -0,0 +1,227 @@
+import _asyncToGenerator from '@babel/runtime-corejs3/helpers/esm/asyncToGenerator';
+import _regeneratorRuntime from '@babel/runtime-corejs3/regenerator';
+import fs from 'fs';
+import { processConfig } from '@commercetools-frontend/application-config';
+import _slicedToArray from '@babel/runtime-corejs3/helpers/esm/slicedToArray';
+import _defineProperty from '@babel/runtime-corejs3/helpers/esm/defineProperty';
+import _toConsumableArray from '@babel/runtime-corejs3/helpers/esm/toConsumableArray';
+import _Array$isArray from '@babel/runtime-corejs3/core-js-stable/array/is-array';
+import _reduceInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/reduce';
+import _Object$assign from '@babel/runtime-corejs3/core-js-stable/object/assign';
+import _Object$keys from '@babel/runtime-corejs3/core-js-stable/object/keys';
+import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
+import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
+import _Object$entries from '@babel/runtime-corejs3/core-js-stable/object/entries';
+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 { HTTP_SECURITY_HEADERS } from '@commercetools-frontend/constants';
+import crypto from 'crypto';
+import serialize from 'serialize-javascript';
+export { g as generateTemplate } from './generate-template-e252c441.esm.js';
+
+function createAssetHash(content) {
+  var sha256Hash = crypto.createHash('sha256').update(content).digest('base64');
+  /**
+   * NOTE:
+   *   We prefix the hash function type as the browser
+   *   needs it when validating the contents of a script against
+   *   CSP headers sent.
+   *   For more information head to: developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src#Sources
+   */
+
+  return "sha256-".concat(sha256Hash);
+}
+
+var sanitizeAppEnvironment = function sanitizeAppEnvironment(env) {
+  return serialize(env, {
+    isJSON: true
+  });
+};
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context11, _context12; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context11 = ownKeys(Object(source), !0)).call(_context11, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context12 = ownKeys(Object(source))).call(_context12, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var htmlScripts$1 = {
+  "dataLayer": "window.dataLayer=[{\"gtm.start\":(new Date).getTime(),event:\"gtm.js\"}];",
+  "loadingScreen": "window.onAppLoaded=function(){const e=document.querySelector(\"#app-loader\");e&&e.parentNode.removeChild(e)},setTimeout(function(){const e=document.querySelector(\".loading-screen\");e&&e.classList.remove(\"loading-screen--hidden\")},250),setTimeout(function(){const e=document.querySelector(\".long-loading-notice\");e&&e.classList.remove(\"long-loading-notice--hidden\")},2e3);",
+  "publicPath": "window.__dynamicImportHandler__=function(n){return window.app.cdnUrl.replace(/\\/$/,\"\")+\"/\"+n.replace(/^(\\.\\/)?/,\"\")},window.__dynamicImportPreload__=function(n){return n.map(n=>window.app.cdnUrl.replace(/\\/$/,\"\")+\"/\"+n)};"
+};
+
+var toArray = function toArray(value) {
+  return _Array$isArray(value) ? value : [value];
+};
+
+var mergeCspDirectives = function mergeCspDirectives() {
+  for (var _len = arguments.length, directives = new Array(_len), _key = 0; _key < _len; _key++) {
+    directives[_key] = arguments[_key];
+  }
+
+  return _reduceInstanceProperty(directives).call(directives, function (mergedCsp, csp) {
+    var _context;
+
+    return _Object$assign(mergedCsp, _reduceInstanceProperty(_context = _Object$keys(csp)).call(_context, function (acc, directiveKey) {
+      var _context2;
+
+      return _Object$assign(acc, _defineProperty({}, directiveKey, _concatInstanceProperty(_context2 = []).call(_context2, _toConsumableArray(toArray(mergedCsp[directiveKey] ? mergedCsp[directiveKey] : [])), _toConsumableArray(toArray(csp[directiveKey])))));
+    }, {}));
+  }, {});
+};
+
+var toHeaderString = function toHeaderString() {
+  var _context3;
+
+  var directives = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return _mapInstanceProperty(_context3 = _Object$entries(directives)).call(_context3, function (_ref) {
+    var _context4;
+
+    var _ref2 = _slicedToArray(_ref, 2),
+        directive = _ref2[0],
+        value = _ref2[1];
+
+    return _concatInstanceProperty(_context4 = "".concat(directive, " ")).call(_context4, _Array$isArray(value) ? value.join(' ') : value);
+  }).join('; ');
+};
+
+var toStructuredHeaderString = function toStructuredHeaderString() {
+  var _context5;
+
+  var directives = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  return _mapInstanceProperty(_context5 = _Object$entries(directives)).call(_context5, function (_ref3) {
+    var _context6;
+
+    var _ref4 = _slicedToArray(_ref3, 2),
+        directive = _ref4[0],
+        value = _ref4[1];
+
+    return _concatInstanceProperty(_context6 = "".concat(directive, "=")).call(_context6, _Array$isArray(value) ? value.join(' ') : value);
+  }).join(', ');
+};
+
+var processHeaders = function processHeaders(applicationConfig) {
+  var _context7, _context8, _context9, _applicationConfig$he, _applicationConfig$he2, _applicationConfig$he3, _context10, _applicationConfig$he4, _applicationConfig$he5;
+
+  var isMcDevEnv = applicationConfig.env.env === 'development'; // List hashes for injected inline scripts.
+  // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src
+
+  var htmlScriptsHashes = [createAssetHash(htmlScripts$1.loadingScreen), createAssetHash("window.app = ".concat(sanitizeAppEnvironment(applicationConfig.env), ";")), createAssetHash(htmlScripts$1.publicPath), createAssetHash(htmlScripts$1.dataLayer)]; // // List hashes for injected inline styles.
+  // // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src
+  // const htmlStylesHashes = [createAssetHash(htmlStyles.loadingScreen)];
+
+  /**
+   * Content Security Policy (CSP)
+   * https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy
+   */
+
+  var cspDirectives = _Object$assign({
+    'default-src': "'none'",
+    'script-src': _concatInstanceProperty(_context7 = ["'self'", 'www.googletagmanager.com/gtm.js', 'www.google-analytics.com/analytics.js']).call(_context7, isMcDevEnv ? // Allow webpack to load source maps on runtime when errors occur
+    // using script tags
+    ['localhost:*', "'unsafe-inline'"] : _mapInstanceProperty(htmlScriptsHashes).call(htmlScriptsHashes, function (assetHash) {
+      return "'".concat(assetHash, "'");
+    })),
+    'connect-src': _concatInstanceProperty(_context8 = ["'self'", 'app.launchdarkly.com', 'clientstream.launchdarkly.com', 'events.launchdarkly.com', 'app.getsentry.com', // Match all attempts to load from any subdomain of `sentry.io`
+    '*.sentry.io', 'www.google-analytics.com']).call(_context8, isMcDevEnv ? ['ws:', 'localhost:8080', 'webpack-internal:'] : []),
+    'img-src': ['*', 'data:'],
+    'style-src': _concatInstanceProperty(_context9 = ["'self'", 'fonts.googleapis.com', 'data:']).call(_context9, // TODO: investigate what needs to be done to avoid unsafe-inline styles
+    // https://github.com/commercetools/merchant-center-frontend/pull/5223#discussion_r210367636
+    ["'unsafe-inline'"] // TODO: enable this once we can avoid unsafe-inline
+    // htmlStylesHashes.map(assetHash => `'${assetHash}'`)
+    ),
+    'font-src': ["'self'", 'fonts.gstatic.com', 'data:']
+  }, isMcDevEnv ? {
+    // NOTE: use this instead of `upgrade-insecure-requests` for local
+    // development to avoid `http://localhost` requests to be redirected
+    // to https.
+    'block-all-mixed-content': ''
+  } : {
+    // NOTE: prefer this over `block-all-mixed-content`.
+    // https://youtu.be/j-0Bj40juMI?t=11m47s
+    'upgrade-insecure-requests': ''
+  } // NOTE: we might want to define further policies in the future, for example
+  // - `require-sri-for style script` (at the moment not possible because
+  //   GTM and Intercom scripts are apparently not meant for this)
+  ); // Recursively merge the directives
+
+
+  var mergedCsp = mergeCspDirectives(cspDirectives, (_applicationConfig$he = (_applicationConfig$he2 = applicationConfig.headers) === null || _applicationConfig$he2 === void 0 ? void 0 : _applicationConfig$he2.csp) !== null && _applicationConfig$he !== void 0 ? _applicationConfig$he : {});
+  return _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, HTTP_SECURITY_HEADERS), {}, {
+    // The `Content-Security-Policy` header is always generated
+    // based on the Custom Application config.
+    'Content-Security-Policy': toHeaderString(mergedCsp)
+  }, ((_applicationConfig$he3 = applicationConfig.headers) === null || _applicationConfig$he3 === void 0 ? void 0 : _applicationConfig$he3.strictTransportSecurity) && {
+    'Strict-Transport-Security': _concatInstanceProperty(_context10 = [HTTP_SECURITY_HEADERS['Strict-Transport-Security']]).call(_context10, _toConsumableArray(applicationConfig.headers.strictTransportSecurity)).join('; ')
+  }), ((_applicationConfig$he4 = applicationConfig.headers) === null || _applicationConfig$he4 === void 0 ? void 0 : _applicationConfig$he4.featurePolicies) && {
+    'Feature-Policy': toHeaderString(applicationConfig.headers.featurePolicies)
+  }), ((_applicationConfig$he5 = applicationConfig.headers) === null || _applicationConfig$he5 === void 0 ? void 0 : _applicationConfig$he5.permissionsPolicies) && {
+    'Permissions-Policy': toStructuredHeaderString(applicationConfig.headers.permissionsPolicies)
+  });
+};
+
+var htmlScripts = {
+  "dataLayer": "window.dataLayer=[{\"gtm.start\":(new Date).getTime(),event:\"gtm.js\"}];",
+  "loadingScreen": "window.onAppLoaded=function(){const e=document.querySelector(\"#app-loader\");e&&e.parentNode.removeChild(e)},setTimeout(function(){const e=document.querySelector(\".loading-screen\");e&&e.classList.remove(\"loading-screen--hidden\")},250),setTimeout(function(){const e=document.querySelector(\".long-loading-notice\");e&&e.classList.remove(\"long-loading-notice--hidden\")},2e3);",
+  "publicPath": "window.__dynamicImportHandler__=function(n){return window.app.cdnUrl.replace(/\\/$/,\"\")+\"/\"+n.replace(/^(\\.\\/)?/,\"\")},window.__dynamicImportPreload__=function(n){return n.map(n=>window.app.cdnUrl.replace(/\\/$/,\"\")+\"/\"+n)};"
+}; // https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
+
+var htmlStyles = {
+  "loadingScreen": ".loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;width:100vw}.loading-screen--hidden{display:none}.loading-screen>*+*{margin:24px 0 0}.loading-spinner{width:32px;height:32px}.long-loading-notice{color:#999;font-family:'Open Sans',sans-serif;font-size:12px}.long-loading-notice--hidden{visibility:hidden}.loading-spinner-circle{fill:#213c45;opacity:.2}@keyframes loading-spinner-animation{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.loading-spinner-pointer{transform-origin:20px 20px 0;animation:loading-spinner-animation .5s infinite linear}"
+};
+
+var trimTrailingSlash = function trimTrailingSlash(value) {
+  return value.replace(/\/$/, '');
+};
+
+var getGtmTrackingScript = function getGtmTrackingScript(gtmId) {
+  if (!gtmId) return '';
+  var url = "https://www.googletagmanager.com/gtm.js?id=".concat(gtmId);
+  return "\n<script async type=\"text/javascript\" src=\"".concat(url, "\" referrerpolicy=\"no-referrer\"></script>\n  ");
+};
+
+var replaceHtmlPlaceholders = function replaceHtmlPlaceholders(indexHtmlContent, options) {
+  var _options$headers$Cont, _options$headers;
+
+  return indexHtmlContent.replace(new RegExp('__CSP__', 'g'), (_options$headers$Cont = (_options$headers = options.headers) === null || _options$headers === void 0 ? void 0 : _options$headers['Content-Security-Policy']) !== null && _options$headers$Cont !== void 0 ? _options$headers$Cont : '').replace(new RegExp('__CDN_URL__', 'g'), options.env.cdnUrl ? // Ensure there is a trailing slash
+  "".concat(trimTrailingSlash(options.env.cdnUrl), "/") : '').replace(new RegExp('__MC_API_URL__', 'g'), trimTrailingSlash(options.env.mcApiUrl)).replace(new RegExp('__APPLICATION_ENVIRONMENT__', 'g'), sanitizeAppEnvironment(options.env)).replace(new RegExp('__GTM_SCRIPT__', 'g'), getGtmTrackingScript(options.env.trackingGtm)).replace(new RegExp('__DATALAYER_JS__', 'g'), "<script>".concat(htmlScripts.dataLayer, "</script>")).replace(new RegExp('__LOADING_SCREEN_JS__', 'g'), "<script>".concat(htmlScripts.loadingScreen, "</script>")).replace(new RegExp('__LOADING_SCREEN_CSS__', 'g'), "<style>".concat(htmlStyles.loadingScreen, "</style>"));
+};
+
+function compileHtml(_x) {
+  return _compileHtml.apply(this, arguments);
+}
+
+function _compileHtml() {
+  _compileHtml = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(indexHtmlTemplatePath) {
+    var applicationConfig, compiledHeaders, indexHtmlTemplateContent, indexHtmlContent;
+    return _regeneratorRuntime.wrap(function _callee$(_context) {
+      while (1) {
+        switch (_context.prev = _context.next) {
+          case 0:
+            applicationConfig = processConfig();
+            compiledHeaders = processHeaders(applicationConfig);
+            indexHtmlTemplateContent = fs.readFileSync(indexHtmlTemplatePath, 'utf8');
+            indexHtmlContent = replaceHtmlPlaceholders(indexHtmlTemplateContent, {
+              env: applicationConfig.env,
+              headers: compiledHeaders
+            });
+            return _context.abrupt("return", {
+              env: applicationConfig.env,
+              headers: compiledHeaders,
+              indexHtmlContent: indexHtmlContent
+            });
+
+          case 5:
+          case "end":
+            return _context.stop();
+        }
+      }
+    }, _callee);
+  }));
+  return _compileHtml.apply(this, arguments);
+}
+
+export { compileHtml, processHeaders, replaceHtmlPlaceholders };

package/dist/declarations/src/compile-html.d.ts

@@ -0,0 +1,8 @@
+import { type ApplicationRuntimeConfig } from '@commercetools-frontend/application-config';
+declare type TCompileHtmlResult = {
+    env: ApplicationRuntimeConfig['env'];
+    headers: Record<string, string | undefined>;
+    indexHtmlContent: string;
+};
+declare function compileHtml(indexHtmlTemplatePath: string): Promise<TCompileHtmlResult>;
+export default compileHtml;

package/dist/declarations/src/generate-template.d.ts

@@ -0,0 +1,6 @@
+declare type TGenerateTemplateOptions = {
+    cssImports?: string[];
+    scriptImports?: string[];
+};
+declare function generateTemplate({ cssImports, scriptImports, }: TGenerateTemplateOptions): string;
+export default generateTemplate;

package/dist/declarations/src/index.d.ts

@@ -0,0 +1,4 @@
+export { default as compileHtml } from './compile-html';
+export { default as generateTemplate } from './generate-template';
+export { default as processHeaders } from './process-headers';
+export { default as replaceHtmlPlaceholders } from './replace-html-placeholders';

package/dist/declarations/src/load-html-docs.d.ts

@@ -0,0 +1,3 @@
+declare type HtmlDocs = { application: string };
+declare const htmlDocs: HtmlDocs;
+export default htmlDocs;

package/dist/declarations/src/load-html-scripts.d.ts

@@ -0,0 +1,7 @@
+declare type HtmlScripts = {
+  dataLayer: string;
+  loadingScreen: string;
+  publicPath: string;
+};
+declare const htmlScripts: HtmlScripts;
+export default htmlScripts;

package/dist/declarations/src/load-html-styles.d.ts

@@ -0,0 +1,5 @@
+declare type HtmlStyles = {
+  loadingScreen: string;
+};
+declare const htmlStyles: HtmlStyles;
+export default htmlStyles;

package/dist/declarations/src/process-headers.d.ts

@@ -0,0 +1,3 @@
+import type { ApplicationRuntimeConfig } from '@commercetools-frontend/application-config';
+declare const processHeaders: (applicationConfig: ApplicationRuntimeConfig) => Record<string, string | undefined>;
+export default processHeaders;

package/dist/declarations/src/replace-html-placeholders.d.ts

@@ -0,0 +1,7 @@
+import type { ApplicationRuntimeConfig } from '@commercetools-frontend/application-config';
+declare type TReplaceHtmlPlaceholdersOptions = {
+    env: ApplicationRuntimeConfig['env'];
+    headers: Record<string, string | undefined>;
+};
+declare const replaceHtmlPlaceholders: (indexHtmlContent: string, options: TReplaceHtmlPlaceholdersOptions) => string;
+export default replaceHtmlPlaceholders;

package/dist/declarations/src/utils/create-asset-hash.d.ts

@@ -0,0 +1,2 @@
+declare function createAssetHash(content: string): string;
+export default createAssetHash;

package/dist/declarations/src/utils/sanitize-app-environment.d.ts

@@ -0,0 +1,3 @@
+import type { ApplicationRuntimeConfig } from '@commercetools-frontend/application-config';
+declare const sanitizeAppEnvironment: (env: ApplicationRuntimeConfig['env']) => string;
+export default sanitizeAppEnvironment;

package/dist/declarations/src/webpack-html-template.d.ts

@@ -0,0 +1,3 @@
+import type { TemplateParameter } from 'html-webpack-plugin';
+declare function webpackHtmlTemplate(templateParams: TemplateParameter): string;
+export default webpackHtmlTemplate;

package/dist/generate-template-211c0b41.cjs.dev.js

@@ -0,0 +1,16 @@
+'use strict';
+
+// https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
+var htmlDocs = {
+  "application": "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\">\n    <meta name=\"referrer\" content=\"no-referrer\">\n\n    <meta http-equiv=\"Content-Security-Policy\" content=\"__CSP__\">\n\n    <!-- Preconnects -->\n    <link rel=\"preconnect\" href=\"__CDN_URL__\">\n    <link rel=\"preconnect\" href=\"__MC_API_URL__\">\n\n    <!-- Fav and touch icons -->\n    <link rel=\"shortcut icon\" type=\"image/png\" href=\"__CDN_URL__favicon.png\">\n    <!-- Standard iPhone -->\n    <link rel=\"apple-touch-icon\" sizes=\"57x57\" href=\"__CDN_URL__favicon_57x57px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"57x57\" href=\"__CDN_URL__favicon_57x57px.png\">\n    <!-- Standard iPad -->\n    <link rel=\"apple-touch-icon\" sizes=\"72x72\" href=\"__CDN_URL__favicon_72x72px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"72x72\" href=\"__CDN_URL__favicon_72x72px.png\">\n    <!-- Retina iPad -->\n    <link rel=\"apple-touch-icon\" sizes=\"144x144\" href=\"__CDN_URL__favicon_144x144px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"144x144\" href=\"__CDN_URL__favicon_144x144px.png\">\n\n    <!-- Fonts -->\n    <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i' rel='stylesheet' type='text/css'>\n\n    __APPLICATION_CSS_IMPORTS__\n\n    <title>Merchant Center</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n\n    <div id=\"app-loader\">\n      <!-- Loading screen styles -->\n      __LOADING_SCREEN_CSS__\n\n      <div class=\"loading-screen loading-screen--hidden\">\n        <svg class=\"loading-spinner\" viewBox=\"0 0 40 40\">\n          <path class=\"loading-spinner-circle\" d=\"M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946, 14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z\"></path>\n          <path class=\"loading-spinner-pointer\" d=\"M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z\"></path>\n        </svg>\n        <svg width=\"200\" height=\"29\" xmlns=\"http://www.w3.org/2000/svg\">\n          <g fill=\"none\" fill-rule=\"evenodd\">\n            <path d=\"M38.342 20.486c1.102 0 1.738-.073 3.133-.367l.343 2.35c-1.077.293-2.276.44-3.476.44-5.358 0-6.9-3.353-6.9-7.268.049-3.818 2.35-7.048 6.876-7.048 1.2 0 2.227.147 3.475.465l-.465 2.325c-1.321-.294-2.104-.342-2.936-.342-2.839.048-4.234 2.153-4.283 4.6 0 2.422.906 4.845 4.233 4.845M49.304 20.51c2.814-.024 3.72-2.3 3.72-4.77-.024-2.253-.98-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.126 4.771 3.769 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.689 7.096-6.387 7.12-4.601-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM73.896 22.615v-8.81c0-2.226-.832-2.838-2.227-2.838-.954 0-2.031.539-3.01 1.346.05.294.073.88.073 1.052v9.25h-2.74v-8.907c0-2.227-.661-2.766-2.056-2.766-.88 0-2.104.588-3.157 1.371v10.302h-2.716V8.838h2.716v1.174c.832-.66 2.154-1.419 3.597-1.443 1.91-.024 3.01.636 3.623 1.664 1.125-1.052 2.79-1.64 4.062-1.664 4.478-.074 4.55 3.523 4.55 5.04v9.006h-2.715M95.427 22.615v-8.81c0-2.226-.831-2.838-2.226-2.838-.955 0-2.032.539-3.01 1.346.049.294.073.88.073 1.052v9.25h-2.74v-8.907c0-2.227-.662-2.766-2.057-2.766-.88 0-2.104.588-3.157 1.371v10.302h-2.716V8.838h2.716v1.174c.833-.66 2.154-1.419 3.598-1.443 1.908-.024 3.01.636 3.622 1.664 1.126-1.052 2.79-1.64 4.062-1.664 4.478-.074 4.551 3.523 4.551 5.04v9.006h-2.716M103.035 14.124h6.044c-.098-2.79-1.492-3.353-2.789-3.353-2.056-.024-3.01 1.37-3.255 3.353zm7.782 5.97l.416 2.227c-1.224.416-2.912.612-4.233.612-5.433 0-6.755-3.646-6.755-7.292s1.616-7.023 6.167-7.023c2.814 0 5.163 1.737 5.188 6.166l-.025 1.444h-8.662c.049 2.692 1.493 4.331 4.209 4.331 1.076 0 2.202-.122 3.695-.465zM121.582 11.358a7.379 7.379 0 0 0-1.762-.195c-1.689-.025-2.57.808-3.206 1.468v9.984h-2.716V8.838h2.716v1.223a4.503 4.503 0 0 1 3.182-1.395 6.356 6.356 0 0 1 2.275.368l-.489 2.324M129.533 20.486c1.102 0 1.738-.073 3.132-.367l.344 2.35c-1.077.293-2.276.44-3.476.44-5.359 0-6.9-3.353-6.9-7.268.049-3.818 2.349-7.048 6.876-7.048 1.2 0 2.227.147 3.475.465l-.465 2.325c-1.322-.294-2.105-.342-2.936-.342-2.839.048-4.234 2.153-4.284 4.6 0 2.422.907 4.845 4.234 4.845M136.898 14.124h6.045c-.098-2.79-1.493-3.353-2.79-3.353-2.056-.024-3.01 1.37-3.255 3.353zm7.782 5.97l.416 2.227c-1.224.416-2.912.612-4.234.612-5.432 0-6.754-3.646-6.754-7.292s1.616-7.023 6.167-7.023c2.815 0 5.164 1.737 5.188 6.166l-.024 1.444h-8.663c.049 2.692 1.493 4.331 4.209 4.331 1.076 0 2.202-.122 3.695-.465zM154.662 11.09h-3.744v6.68c0 1.394.171 2.374 1.59 2.569.784.074 1.591 0 2.374-.098l.171 2.35c-.807.146-1.957.17-2.422.17-3.206-.121-4.405-1.761-4.405-4.33v-7.342h-1.982V9.205l1.982-.22V5.779h2.692v3.06h3.744v2.25M162.565 20.51c2.815-.024 3.72-2.3 3.72-4.77-.024-2.253-.979-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.127 4.771 3.77 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.689 7.096-6.387 7.12-4.6-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM177.197 20.51c2.814-.024 3.72-2.3 3.72-4.77-.025-2.253-.98-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.126 4.771 3.769 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.69 7.096-6.387 7.12-4.601-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM185.71 22.615h2.619V3.919h-2.619zM191.094 19.948c1.542.391 2.985.587 3.89.587 1.078 0 2.179-.22 2.252-1.517.074-1.37-1.346-1.787-2.96-2.472-1.836-.758-3.818-1.786-3.77-4.331.05-1.273.808-3.769 4.87-3.646 1.224.024 2.692.22 3.915.538l-.464 2.251c-1.444-.342-2.52-.49-3.573-.513-1.175 0-2.08.367-2.129 1.468-.024.93.71 1.42 2.52 2.153 1.836.759 4.43 1.738 4.308 4.625-.074 1.835-1.273 3.842-4.968 3.793-1.175-.024-3.059-.171-4.453-.66l.562-2.276\" fill=\"#27373C\"/>\n            <path d=\"M.349 22.312a.601.601 0 0 0-.002 1.091l11.663 5.46c.156.074.325.112.493.113V16.787c-.173 0-.346.037-.508.112L.35 22.312\" fill=\"#E3712C\"/>\n            <path d=\"M12.503 16.787v12.19c.18.003.361-.035.528-.113l11.63-5.444a.6.6 0 0 0-.002-1.09L13.011 16.9a1.2 1.2 0 0 0-.508-.113\" fill=\"#EBA13B\"/>\n            <path d=\"M0 6.363a.596.596 0 0 0 .347.546l11.663 5.46a1.194 1.194 0 0 0 .93.039l.327-.152c1.203-.56.406-.187 11.394-5.33a.6.6 0 0 0-.002-1.091L13.011.405a1.205 1.205 0 0 0-1.016 0L.35 5.818A.603.603 0 0 0 0 6.363\" fill=\"#23A486\"/>\n            <path d=\"M12.503 13.168v3.62c-.173 0-.346.036-.508.111L.35 22.312a.601.601 0 0 0-.348.545L0 6.77v-.407c0 .234.134.447.346.546l11.664 5.46a1.194 1.194 0 0 0 .93.039l-.02.009c-.362.167-.417.334-.417.75\" fill=\"#CCCCC7\"/>\n          </g>\n        </svg>\n        <p class=\"long-loading-notice long-loading-notice--hidden\">Sorry, this is taking an unusually long time.</p>\n      </div>\n    </div>\n    <div id=\"app\"></div>\n\n    <!-- Loading screen handling -->\n    __LOADING_SCREEN_JS__\n\n    <!-- Application globals -->\n    <script>window.app = __APPLICATION_ENVIRONMENT__;</script>\n\n    <!-- Tracking scripts (load before application bundles) -->\n    __DATALAYER_JS__\n    __GTM_SCRIPT__\n\n    <!-- Main application chunks -->\n    __APPLICATION_SCRIPT_IMPORTS__\n  </body>\n</html>"
+};
+
+function generateTemplate(_ref) {
+  var _ref$cssImports = _ref.cssImports,
+      cssImports = _ref$cssImports === void 0 ? [] : _ref$cssImports,
+      _ref$scriptImports = _ref.scriptImports,
+      scriptImports = _ref$scriptImports === void 0 ? [] : _ref$scriptImports;
+  return htmlDocs.application.replace(new RegExp('__APPLICATION_CSS_IMPORTS__', 'g'), cssImports.join('\n')).replace(new RegExp('__APPLICATION_SCRIPT_IMPORTS__', 'g'), scriptImports.join('\n'));
+}
+
+exports.generateTemplate = generateTemplate;

package/dist/generate-template-600664a1.cjs.prod.js

@@ -0,0 +1,16 @@
+'use strict';
+
+// https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
+var htmlDocs = {
+  "application": "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\">\n    <meta name=\"referrer\" content=\"no-referrer\">\n\n    <meta http-equiv=\"Content-Security-Policy\" content=\"__CSP__\">\n\n    <!-- Preconnects -->\n    <link rel=\"preconnect\" href=\"__CDN_URL__\">\n    <link rel=\"preconnect\" href=\"__MC_API_URL__\">\n\n    <!-- Fav and touch icons -->\n    <link rel=\"shortcut icon\" type=\"image/png\" href=\"__CDN_URL__favicon.png\">\n    <!-- Standard iPhone -->\n    <link rel=\"apple-touch-icon\" sizes=\"57x57\" href=\"__CDN_URL__favicon_57x57px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"57x57\" href=\"__CDN_URL__favicon_57x57px.png\">\n    <!-- Standard iPad -->\n    <link rel=\"apple-touch-icon\" sizes=\"72x72\" href=\"__CDN_URL__favicon_72x72px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"72x72\" href=\"__CDN_URL__favicon_72x72px.png\">\n    <!-- Retina iPad -->\n    <link rel=\"apple-touch-icon\" sizes=\"144x144\" href=\"__CDN_URL__favicon_144x144px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"144x144\" href=\"__CDN_URL__favicon_144x144px.png\">\n\n    <!-- Fonts -->\n    <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i' rel='stylesheet' type='text/css'>\n\n    __APPLICATION_CSS_IMPORTS__\n\n    <title>Merchant Center</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n\n    <div id=\"app-loader\">\n      <!-- Loading screen styles -->\n      __LOADING_SCREEN_CSS__\n\n      <div class=\"loading-screen loading-screen--hidden\">\n        <svg class=\"loading-spinner\" viewBox=\"0 0 40 40\">\n          <path class=\"loading-spinner-circle\" d=\"M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946, 14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z\"></path>\n          <path class=\"loading-spinner-pointer\" d=\"M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z\"></path>\n        </svg>\n        <svg width=\"200\" height=\"29\" xmlns=\"http://www.w3.org/2000/svg\">\n          <g fill=\"none\" fill-rule=\"evenodd\">\n            <path d=\"M38.342 20.486c1.102 0 1.738-.073 3.133-.367l.343 2.35c-1.077.293-2.276.44-3.476.44-5.358 0-6.9-3.353-6.9-7.268.049-3.818 2.35-7.048 6.876-7.048 1.2 0 2.227.147 3.475.465l-.465 2.325c-1.321-.294-2.104-.342-2.936-.342-2.839.048-4.234 2.153-4.283 4.6 0 2.422.906 4.845 4.233 4.845M49.304 20.51c2.814-.024 3.72-2.3 3.72-4.77-.024-2.253-.98-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.126 4.771 3.769 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.689 7.096-6.387 7.12-4.601-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM73.896 22.615v-8.81c0-2.226-.832-2.838-2.227-2.838-.954 0-2.031.539-3.01 1.346.05.294.073.88.073 1.052v9.25h-2.74v-8.907c0-2.227-.661-2.766-2.056-2.766-.88 0-2.104.588-3.157 1.371v10.302h-2.716V8.838h2.716v1.174c.832-.66 2.154-1.419 3.597-1.443 1.91-.024 3.01.636 3.623 1.664 1.125-1.052 2.79-1.64 4.062-1.664 4.478-.074 4.55 3.523 4.55 5.04v9.006h-2.715M95.427 22.615v-8.81c0-2.226-.831-2.838-2.226-2.838-.955 0-2.032.539-3.01 1.346.049.294.073.88.073 1.052v9.25h-2.74v-8.907c0-2.227-.662-2.766-2.057-2.766-.88 0-2.104.588-3.157 1.371v10.302h-2.716V8.838h2.716v1.174c.833-.66 2.154-1.419 3.598-1.443 1.908-.024 3.01.636 3.622 1.664 1.126-1.052 2.79-1.64 4.062-1.664 4.478-.074 4.551 3.523 4.551 5.04v9.006h-2.716M103.035 14.124h6.044c-.098-2.79-1.492-3.353-2.789-3.353-2.056-.024-3.01 1.37-3.255 3.353zm7.782 5.97l.416 2.227c-1.224.416-2.912.612-4.233.612-5.433 0-6.755-3.646-6.755-7.292s1.616-7.023 6.167-7.023c2.814 0 5.163 1.737 5.188 6.166l-.025 1.444h-8.662c.049 2.692 1.493 4.331 4.209 4.331 1.076 0 2.202-.122 3.695-.465zM121.582 11.358a7.379 7.379 0 0 0-1.762-.195c-1.689-.025-2.57.808-3.206 1.468v9.984h-2.716V8.838h2.716v1.223a4.503 4.503 0 0 1 3.182-1.395 6.356 6.356 0 0 1 2.275.368l-.489 2.324M129.533 20.486c1.102 0 1.738-.073 3.132-.367l.344 2.35c-1.077.293-2.276.44-3.476.44-5.359 0-6.9-3.353-6.9-7.268.049-3.818 2.349-7.048 6.876-7.048 1.2 0 2.227.147 3.475.465l-.465 2.325c-1.322-.294-2.105-.342-2.936-.342-2.839.048-4.234 2.153-4.284 4.6 0 2.422.907 4.845 4.234 4.845M136.898 14.124h6.045c-.098-2.79-1.493-3.353-2.79-3.353-2.056-.024-3.01 1.37-3.255 3.353zm7.782 5.97l.416 2.227c-1.224.416-2.912.612-4.234.612-5.432 0-6.754-3.646-6.754-7.292s1.616-7.023 6.167-7.023c2.815 0 5.164 1.737 5.188 6.166l-.024 1.444h-8.663c.049 2.692 1.493 4.331 4.209 4.331 1.076 0 2.202-.122 3.695-.465zM154.662 11.09h-3.744v6.68c0 1.394.171 2.374 1.59 2.569.784.074 1.591 0 2.374-.098l.171 2.35c-.807.146-1.957.17-2.422.17-3.206-.121-4.405-1.761-4.405-4.33v-7.342h-1.982V9.205l1.982-.22V5.779h2.692v3.06h3.744v2.25M162.565 20.51c2.815-.024 3.72-2.3 3.72-4.77-.024-2.253-.979-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.127 4.771 3.77 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.689 7.096-6.387 7.12-4.6-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM177.197 20.51c2.814-.024 3.72-2.3 3.72-4.77-.025-2.253-.98-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.126 4.771 3.769 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.69 7.096-6.387 7.12-4.601-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM185.71 22.615h2.619V3.919h-2.619zM191.094 19.948c1.542.391 2.985.587 3.89.587 1.078 0 2.179-.22 2.252-1.517.074-1.37-1.346-1.787-2.96-2.472-1.836-.758-3.818-1.786-3.77-4.331.05-1.273.808-3.769 4.87-3.646 1.224.024 2.692.22 3.915.538l-.464 2.251c-1.444-.342-2.52-.49-3.573-.513-1.175 0-2.08.367-2.129 1.468-.024.93.71 1.42 2.52 2.153 1.836.759 4.43 1.738 4.308 4.625-.074 1.835-1.273 3.842-4.968 3.793-1.175-.024-3.059-.171-4.453-.66l.562-2.276\" fill=\"#27373C\"/>\n            <path d=\"M.349 22.312a.601.601 0 0 0-.002 1.091l11.663 5.46c.156.074.325.112.493.113V16.787c-.173 0-.346.037-.508.112L.35 22.312\" fill=\"#E3712C\"/>\n            <path d=\"M12.503 16.787v12.19c.18.003.361-.035.528-.113l11.63-5.444a.6.6 0 0 0-.002-1.09L13.011 16.9a1.2 1.2 0 0 0-.508-.113\" fill=\"#EBA13B\"/>\n            <path d=\"M0 6.363a.596.596 0 0 0 .347.546l11.663 5.46a1.194 1.194 0 0 0 .93.039l.327-.152c1.203-.56.406-.187 11.394-5.33a.6.6 0 0 0-.002-1.091L13.011.405a1.205 1.205 0 0 0-1.016 0L.35 5.818A.603.603 0 0 0 0 6.363\" fill=\"#23A486\"/>\n            <path d=\"M12.503 13.168v3.62c-.173 0-.346.036-.508.111L.35 22.312a.601.601 0 0 0-.348.545L0 6.77v-.407c0 .234.134.447.346.546l11.664 5.46a1.194 1.194 0 0 0 .93.039l-.02.009c-.362.167-.417.334-.417.75\" fill=\"#CCCCC7\"/>\n          </g>\n        </svg>\n        <p class=\"long-loading-notice long-loading-notice--hidden\">Sorry, this is taking an unusually long time.</p>\n      </div>\n    </div>\n    <div id=\"app\"></div>\n\n    <!-- Loading screen handling -->\n    __LOADING_SCREEN_JS__\n\n    <!-- Application globals -->\n    <script>window.app = __APPLICATION_ENVIRONMENT__;</script>\n\n    <!-- Tracking scripts (load before application bundles) -->\n    __DATALAYER_JS__\n    __GTM_SCRIPT__\n\n    <!-- Main application chunks -->\n    __APPLICATION_SCRIPT_IMPORTS__\n  </body>\n</html>"
+};
+
+function generateTemplate(_ref) {
+  var _ref$cssImports = _ref.cssImports,
+      cssImports = _ref$cssImports === void 0 ? [] : _ref$cssImports,
+      _ref$scriptImports = _ref.scriptImports,
+      scriptImports = _ref$scriptImports === void 0 ? [] : _ref$scriptImports;
+  return htmlDocs.application.replace(new RegExp('__APPLICATION_CSS_IMPORTS__', 'g'), cssImports.join('\n')).replace(new RegExp('__APPLICATION_SCRIPT_IMPORTS__', 'g'), scriptImports.join('\n'));
+}
+
+exports.generateTemplate = generateTemplate;

package/dist/generate-template-e252c441.esm.js

@@ -0,0 +1,14 @@
+// https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros
+var htmlDocs = {
+  "application": "<!DOCTYPE html>\n<html lang=\"en\">\n  <head>\n    <meta charset=\"utf-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no\">\n    <meta name=\"referrer\" content=\"no-referrer\">\n\n    <meta http-equiv=\"Content-Security-Policy\" content=\"__CSP__\">\n\n    <!-- Preconnects -->\n    <link rel=\"preconnect\" href=\"__CDN_URL__\">\n    <link rel=\"preconnect\" href=\"__MC_API_URL__\">\n\n    <!-- Fav and touch icons -->\n    <link rel=\"shortcut icon\" type=\"image/png\" href=\"__CDN_URL__favicon.png\">\n    <!-- Standard iPhone -->\n    <link rel=\"apple-touch-icon\" sizes=\"57x57\" href=\"__CDN_URL__favicon_57x57px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"57x57\" href=\"__CDN_URL__favicon_57x57px.png\">\n    <!-- Standard iPad -->\n    <link rel=\"apple-touch-icon\" sizes=\"72x72\" href=\"__CDN_URL__favicon_72x72px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"72x72\" href=\"__CDN_URL__favicon_72x72px.png\">\n    <!-- Retina iPad -->\n    <link rel=\"apple-touch-icon\" sizes=\"144x144\" href=\"__CDN_URL__favicon_144x144px.png\">\n    <link rel=\"apple-touch-icon-precomposed\" sizes=\"144x144\" href=\"__CDN_URL__favicon_144x144px.png\">\n\n    <!-- Fonts -->\n    <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i' rel='stylesheet' type='text/css'>\n\n    __APPLICATION_CSS_IMPORTS__\n\n    <title>Merchant Center</title>\n  </head>\n  <body>\n    <noscript>You need to enable JavaScript to run this app.</noscript>\n\n    <div id=\"app-loader\">\n      <!-- Loading screen styles -->\n      __LOADING_SCREEN_CSS__\n\n      <div class=\"loading-screen loading-screen--hidden\">\n        <svg class=\"loading-spinner\" viewBox=\"0 0 40 40\">\n          <path class=\"loading-spinner-circle\" d=\"M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946, 14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z\"></path>\n          <path class=\"loading-spinner-pointer\" d=\"M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z\"></path>\n        </svg>\n        <svg width=\"200\" height=\"29\" xmlns=\"http://www.w3.org/2000/svg\">\n          <g fill=\"none\" fill-rule=\"evenodd\">\n            <path d=\"M38.342 20.486c1.102 0 1.738-.073 3.133-.367l.343 2.35c-1.077.293-2.276.44-3.476.44-5.358 0-6.9-3.353-6.9-7.268.049-3.818 2.35-7.048 6.876-7.048 1.2 0 2.227.147 3.475.465l-.465 2.325c-1.321-.294-2.104-.342-2.936-.342-2.839.048-4.234 2.153-4.283 4.6 0 2.422.906 4.845 4.233 4.845M49.304 20.51c2.814-.024 3.72-2.3 3.72-4.77-.024-2.253-.98-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.126 4.771 3.769 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.689 7.096-6.387 7.12-4.601-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM73.896 22.615v-8.81c0-2.226-.832-2.838-2.227-2.838-.954 0-2.031.539-3.01 1.346.05.294.073.88.073 1.052v9.25h-2.74v-8.907c0-2.227-.661-2.766-2.056-2.766-.88 0-2.104.588-3.157 1.371v10.302h-2.716V8.838h2.716v1.174c.832-.66 2.154-1.419 3.597-1.443 1.91-.024 3.01.636 3.623 1.664 1.125-1.052 2.79-1.64 4.062-1.664 4.478-.074 4.55 3.523 4.55 5.04v9.006h-2.715M95.427 22.615v-8.81c0-2.226-.831-2.838-2.226-2.838-.955 0-2.032.539-3.01 1.346.049.294.073.88.073 1.052v9.25h-2.74v-8.907c0-2.227-.662-2.766-2.057-2.766-.88 0-2.104.588-3.157 1.371v10.302h-2.716V8.838h2.716v1.174c.833-.66 2.154-1.419 3.598-1.443 1.908-.024 3.01.636 3.622 1.664 1.126-1.052 2.79-1.64 4.062-1.664 4.478-.074 4.551 3.523 4.551 5.04v9.006h-2.716M103.035 14.124h6.044c-.098-2.79-1.492-3.353-2.789-3.353-2.056-.024-3.01 1.37-3.255 3.353zm7.782 5.97l.416 2.227c-1.224.416-2.912.612-4.233.612-5.433 0-6.755-3.646-6.755-7.292s1.616-7.023 6.167-7.023c2.814 0 5.163 1.737 5.188 6.166l-.025 1.444h-8.662c.049 2.692 1.493 4.331 4.209 4.331 1.076 0 2.202-.122 3.695-.465zM121.582 11.358a7.379 7.379 0 0 0-1.762-.195c-1.689-.025-2.57.808-3.206 1.468v9.984h-2.716V8.838h2.716v1.223a4.503 4.503 0 0 1 3.182-1.395 6.356 6.356 0 0 1 2.275.368l-.489 2.324M129.533 20.486c1.102 0 1.738-.073 3.132-.367l.344 2.35c-1.077.293-2.276.44-3.476.44-5.359 0-6.9-3.353-6.9-7.268.049-3.818 2.349-7.048 6.876-7.048 1.2 0 2.227.147 3.475.465l-.465 2.325c-1.322-.294-2.105-.342-2.936-.342-2.839.048-4.234 2.153-4.284 4.6 0 2.422.907 4.845 4.234 4.845M136.898 14.124h6.045c-.098-2.79-1.493-3.353-2.79-3.353-2.056-.024-3.01 1.37-3.255 3.353zm7.782 5.97l.416 2.227c-1.224.416-2.912.612-4.234.612-5.432 0-6.754-3.646-6.754-7.292s1.616-7.023 6.167-7.023c2.815 0 5.164 1.737 5.188 6.166l-.024 1.444h-8.663c.049 2.692 1.493 4.331 4.209 4.331 1.076 0 2.202-.122 3.695-.465zM154.662 11.09h-3.744v6.68c0 1.394.171 2.374 1.59 2.569.784.074 1.591 0 2.374-.098l.171 2.35c-.807.146-1.957.17-2.422.17-3.206-.121-4.405-1.761-4.405-4.33v-7.342h-1.982V9.205l1.982-.22V5.779h2.692v3.06h3.744v2.25M162.565 20.51c2.815-.024 3.72-2.3 3.72-4.77-.024-2.253-.979-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.127 4.771 3.77 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.689 7.096-6.387 7.12-4.6-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM177.197 20.51c2.814-.024 3.72-2.3 3.72-4.77-.025-2.253-.98-4.798-3.744-4.798-2.692.025-3.745 2.521-3.745 4.797 0 2.569 1.126 4.771 3.769 4.771zm0-11.917c4.405.025 6.363 3.304 6.363 7.146 0 3.744-1.69 7.096-6.387 7.12-4.601-.048-6.363-3.376-6.363-7.12 0-3.842 1.982-7.097 6.387-7.146zM185.71 22.615h2.619V3.919h-2.619zM191.094 19.948c1.542.391 2.985.587 3.89.587 1.078 0 2.179-.22 2.252-1.517.074-1.37-1.346-1.787-2.96-2.472-1.836-.758-3.818-1.786-3.77-4.331.05-1.273.808-3.769 4.87-3.646 1.224.024 2.692.22 3.915.538l-.464 2.251c-1.444-.342-2.52-.49-3.573-.513-1.175 0-2.08.367-2.129 1.468-.024.93.71 1.42 2.52 2.153 1.836.759 4.43 1.738 4.308 4.625-.074 1.835-1.273 3.842-4.968 3.793-1.175-.024-3.059-.171-4.453-.66l.562-2.276\" fill=\"#27373C\"/>\n            <path d=\"M.349 22.312a.601.601 0 0 0-.002 1.091l11.663 5.46c.156.074.325.112.493.113V16.787c-.173 0-.346.037-.508.112L.35 22.312\" fill=\"#E3712C\"/>\n            <path d=\"M12.503 16.787v12.19c.18.003.361-.035.528-.113l11.63-5.444a.6.6 0 0 0-.002-1.09L13.011 16.9a1.2 1.2 0 0 0-.508-.113\" fill=\"#EBA13B\"/>\n            <path d=\"M0 6.363a.596.596 0 0 0 .347.546l11.663 5.46a1.194 1.194 0 0 0 .93.039l.327-.152c1.203-.56.406-.187 11.394-5.33a.6.6 0 0 0-.002-1.091L13.011.405a1.205 1.205 0 0 0-1.016 0L.35 5.818A.603.603 0 0 0 0 6.363\" fill=\"#23A486\"/>\n            <path d=\"M12.503 13.168v3.62c-.173 0-.346.036-.508.111L.35 22.312a.601.601 0 0 0-.348.545L0 6.77v-.407c0 .234.134.447.346.546l11.664 5.46a1.194 1.194 0 0 0 .93.039l-.02.009c-.362.167-.417.334-.417.75\" fill=\"#CCCCC7\"/>\n          </g>\n        </svg>\n        <p class=\"long-loading-notice long-loading-notice--hidden\">Sorry, this is taking an unusually long time.</p>\n      </div>\n    </div>\n    <div id=\"app\"></div>\n\n    <!-- Loading screen handling -->\n    __LOADING_SCREEN_JS__\n\n    <!-- Application globals -->\n    <script>window.app = __APPLICATION_ENVIRONMENT__;</script>\n\n    <!-- Tracking scripts (load before application bundles) -->\n    __DATALAYER_JS__\n    __GTM_SCRIPT__\n\n    <!-- Main application chunks -->\n    __APPLICATION_SCRIPT_IMPORTS__\n  </body>\n</html>"
+};
+
+function generateTemplate(_ref) {
+  var _ref$cssImports = _ref.cssImports,
+      cssImports = _ref$cssImports === void 0 ? [] : _ref$cssImports,
+      _ref$scriptImports = _ref.scriptImports,
+      scriptImports = _ref$scriptImports === void 0 ? [] : _ref$scriptImports;
+  return htmlDocs.application.replace(new RegExp('__APPLICATION_CSS_IMPORTS__', 'g'), cssImports.join('\n')).replace(new RegExp('__APPLICATION_SCRIPT_IMPORTS__', 'g'), scriptImports.join('\n'));
+}
+
+export { generateTemplate as g };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercetools-frontend/mc-html-template",
-  "version": "21.3.3",
+  "version": "21.5.0",
   "description": "Everything related to render the index.html for a MC application",
   "bugs": "https://github.com/commercetools/merchant-center-application-kit/issues",
   "repository": {
@@ -14,59 +14,34 @@
   "publishConfig": {
     "access": "public"
   },
-  "main": "./build/index.js",
+  "main": "dist/commercetools-frontend-mc-html-template.cjs.js",
+  "module": "dist/commercetools-frontend-mc-html-template.esm.js",
+  "preconstruct": {
+    "entrypoints": ["./index.ts", "./webpack-html-template.ts"]
+  },
   "files": [
-    "build",
-    "html-scripts",
-    "html-styles",
+    "dist",
+    "webpack-html-template",
     "webpack.js",
     "package.json",
     "LICENSE",
     "README.md"
   ],
-  "scripts": {
-    "build": "rimraf build && babel src --out-dir build",
-    "build:bundles:watch": "yarn build -w"
-  },
   "dependencies": {
-    "@babel/runtime": "^7.17.8",
-    "@babel/runtime-corejs3": "^7.17.8",
-    "@commercetools-frontend/application-config": "21.3.3",
-    "@commercetools-frontend/constants": "21.3.0",
-    "core-js": "^3.21.1",
+    "@babel/runtime": "^7.17.9",
+    "@babel/runtime-corejs3": "^7.17.9",
+    "@commercetools-frontend/application-config": "21.5.0",
+    "@commercetools-frontend/constants": "21.3.4",
     "serialize-javascript": "6.0.0",
-    "uglify-js": "3.15.3",
+    "uglify-js": "3.15.4",
     "uglifycss": "0.0.29"
   },
   "devDependencies": {
-    "@babel/plugin-transform-runtime": "^7.17.0",
-    "@babel/preset-env": "^7.16.11",
-    "rimraf": "3.0.2"
+    "@tsconfig/node14": "^1.0.1",
+    "@types/serialize-javascript": "^5.0.2",
+    "html-webpack-plugin": "5.5.0"
   },
   "engines": {
     "node": ">=14"
-  },
-  "babel": {
-    "presets": [
-      [
-        "@babel/preset-env",
-        {
-          "targets": {
-            "node": "14"
-          },
-          "modules": "commonjs",
-          "useBuiltIns": "usage",
-          "corejs": 3
-        }
-      ]
-    ],
-    "plugins": [
-      [
-        "@babel/plugin-transform-runtime",
-        {
-          "corejs": 3
-        }
-      ]
-    ]
   }
 }

package/webpack-html-template/dist/commercetools-frontend-mc-html-template-webpack-html-template.cjs.d.ts

@@ -0,0 +1,2 @@
+export * from "../../dist/declarations/src/webpack-html-template";
+export { default } from "../../dist/declarations/src/webpack-html-template";

package/webpack-html-template/dist/commercetools-frontend-mc-html-template-webpack-html-template.cjs.dev.js

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+var _indexOfInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/index-of');
+var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
+var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
+var generateTemplate = require('../../dist/generate-template-211c0b41.cjs.dev.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
+var _indexOfInstanceProperty__default = /*#__PURE__*/_interopDefault(_indexOfInstanceProperty);
+var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
+var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
+
+function webpackHtmlTemplate(templateParams) {
+  var _context, _context2, _context3;
+
+  var cssVendorChunks = [];
+  var cssAppChunks = [];
+
+  _forEachInstanceProperty__default["default"](_context = templateParams.htmlWebpackPlugin.files.css).call(_context, function (file) {
+    if (_indexOfInstanceProperty__default["default"](file).call(file, 'vendor') === -1) {
+      cssAppChunks.push(file);
+    } else {
+      cssVendorChunks.push(file);
+    }
+  });
+
+  var cssChunks = _mapInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](cssVendorChunks).call(cssVendorChunks, cssAppChunks)).call(_context2, function (fileName) {
+    return fileName.replace(/^\//, '');
+  });
+
+  var scriptChunks = _mapInstanceProperty__default["default"](_context3 = templateParams.htmlWebpackPlugin.files.js).call(_context3, function (fileName) {
+    return (// Trim leading slash, the CDN_URL will ensure to have a trailing slash
+      // (see `replaceHtmlPlaceholders`)
+      fileName.replace(/^\//, '')
+    );
+  });
+
+  var cssImports = _mapInstanceProperty__default["default"](cssChunks).call(cssChunks, function (chunkPath) {
+    return "<link href=\"__CDN_URL__".concat(chunkPath, "\" rel='stylesheet' type='text/css'>");
+  });
+
+  var scriptImports = _mapInstanceProperty__default["default"](scriptChunks).call(scriptChunks, function (chunkPath) {
+    return "<script src=\"__CDN_URL__".concat(chunkPath, "\"></script>");
+  });
+
+  return generateTemplate.generateTemplate({
+    cssImports: cssImports,
+    scriptImports: scriptImports
+  });
+}
+
+exports["default"] = webpackHtmlTemplate;

package/webpack-html-template/dist/commercetools-frontend-mc-html-template-webpack-html-template.cjs.js

@@ -0,0 +1,7 @@
+'use strict';
+
+if (process.env.NODE_ENV === "production") {
+  module.exports = require("./commercetools-frontend-mc-html-template-webpack-html-template.cjs.prod.js");
+} else {
+  module.exports = require("./commercetools-frontend-mc-html-template-webpack-html-template.cjs.dev.js");
+}

package/webpack-html-template/dist/commercetools-frontend-mc-html-template-webpack-html-template.cjs.prod.js

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _forEachInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/for-each');
+var _indexOfInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/index-of');
+var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
+var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
+var generateTemplate = require('../../dist/generate-template-600664a1.cjs.prod.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var _forEachInstanceProperty__default = /*#__PURE__*/_interopDefault(_forEachInstanceProperty);
+var _indexOfInstanceProperty__default = /*#__PURE__*/_interopDefault(_indexOfInstanceProperty);
+var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
+var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
+
+function webpackHtmlTemplate(templateParams) {
+  var _context, _context2, _context3;
+
+  var cssVendorChunks = [];
+  var cssAppChunks = [];
+
+  _forEachInstanceProperty__default["default"](_context = templateParams.htmlWebpackPlugin.files.css).call(_context, function (file) {
+    if (_indexOfInstanceProperty__default["default"](file).call(file, 'vendor') === -1) {
+      cssAppChunks.push(file);
+    } else {
+      cssVendorChunks.push(file);
+    }
+  });
+
+  var cssChunks = _mapInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](cssVendorChunks).call(cssVendorChunks, cssAppChunks)).call(_context2, function (fileName) {
+    return fileName.replace(/^\//, '');
+  });
+
+  var scriptChunks = _mapInstanceProperty__default["default"](_context3 = templateParams.htmlWebpackPlugin.files.js).call(_context3, function (fileName) {
+    return (// Trim leading slash, the CDN_URL will ensure to have a trailing slash
+      // (see `replaceHtmlPlaceholders`)
+      fileName.replace(/^\//, '')
+    );
+  });
+
+  var cssImports = _mapInstanceProperty__default["default"](cssChunks).call(cssChunks, function (chunkPath) {
+    return "<link href=\"__CDN_URL__".concat(chunkPath, "\" rel='stylesheet' type='text/css'>");
+  });
+
+  var scriptImports = _mapInstanceProperty__default["default"](scriptChunks).call(scriptChunks, function (chunkPath) {
+    return "<script src=\"__CDN_URL__".concat(chunkPath, "\"></script>");
+  });
+
+  return generateTemplate.generateTemplate({
+    cssImports: cssImports,
+    scriptImports: scriptImports
+  });
+}
+
+exports["default"] = webpackHtmlTemplate;