[Release] Stage to Main

libs/blocks/faas-config/faas-config.js

 console.log('Error loading script: ', error); 
 console.log('DEFAULT'); 
 console.log('Could not load additonal Form Template options from FaaS.', err); 
 console.log('Error loading script: ', error); 
@@ -136,13 +136,13 @@ const CopyBtn = () => {
       }
       if (input.id === 'pjs36' && !/^[A-Za-z0-9]*$/.test(input.value)) {
         inputValidation = false;
-        setErrorMessage('Campagin ID allows only letters and numbers');
+        setErrorMessage('Campaign ID allows only letters and numbers');
         input.focus();
         return;
       }
       if (input.name === 'v' && !/^[A-Za-z0-9]*$/.test(input.value)) {
         inputValidation = false;
-        setErrorMessage('Campagin ID allows only letters and numbers');
+        setErrorMessage('Campaign ID allows only letters and numbers');
         input.focus();
       }
     });
@@ -278,7 +278,7 @@ const RequiredPanel = () => {
       values=${values}
       title="Multiple Campaign Ids"
       >
-        <${FormInput} name="v" label="Campagin ID" />
+        <${FormInput} name="v" label="Campaign ID" />
         <${FormInput} name="l" label="Description" />
       <//>
     `);
@@ -359,15 +359,15 @@ const RequiredPanel = () => {
             values=${context.state.q103}
             title="Multiple Campaign Ids"
             >
-              <${FormInput} name="v" label="Campagin ID" />
+              <${FormInput} name="v" label="Campaign ID" />
               <${FormInput} name="l" label="Description" />
             <//>`;
           setField103(internalCampIDs);
           setFieldMultiCampStyle(html`<${Input} label="Multi Campaign Radio Styling" prop="multicampaignradiostyle" type="checkbox" />`);
         }
       });
       if (formId !== '63') {
-        setFieldpjs36(html`<${Input} label="Internal Campagin ID" prop="pjs36" placeholder="ex) 70114000002XYvIAAW" />`);
+        setFieldpjs36(html`<${Input} label="Internal Campaign ID" prop="pjs36" placeholder="ex) 70114000002XYvIAAW" />`);
       }
       // eslint-disable-next-line no-use-before-define
     }).catch((err) => {
@@ -404,7 +404,7 @@ const RequiredPanel = () => {
 };
 const OptionalPanel = () => html`
   <${Input} label="Form Title" prop="title" />
-  <${Input} label="Onsite Campagin ID" prop="pjs39" />
+  <${Input} label="Onsite Campaign ID" prop="pjs39" />
   <${Input} label="Hide Prepopulated Fields" prop="hidePrepopulated" type="checkbox" />
   <${Input} label="Auto Submit" prop="as" type="checkbox" />
   <${Input} label="Auto Response" prop="ar" type="checkbox" />

libs/blocks/global-navigation/global-navigation.js

@@ -42,6 +42,14 @@ import {
 
 import { replaceKey, replaceKeyArray } from '../../features/placeholders.js';
 
+function getHelpChildren() {
+  const { unavHelpChildren } = getConfig();
+  return unavHelpChildren || [
+    { type: 'Support' },
+    { type: 'Community' },
+  ];
+}
+
 export const CONFIG = {
   icons: isDarkMode() ? darkIcons : icons,
   delays: {
@@ -97,13 +105,7 @@ export const CONFIG = {
       },
       help: {
         name: 'help',
-        attributes: {
-          children: [
-            { type: 'Support' },
-            { type: 'Community' },
-            // { type: 'Jarvis', appid: window.adobeid?.client_id },
-          ],
-        },
+        attributes: { children: getHelpChildren() },
       },
     },
   },

libs/blocks/home/home.css

@@ -1,7 +1,3 @@
-header {
-  display: none;
-}
-
 .home {
   display: grid;
   position: relative;

libs/blocks/merch-card/merch-card.js

@@ -420,7 +420,7 @@ const addStartingAt = async (styles, merchCard) => {
   if (styles.includes('starting-at')) {
     const { replaceKey } = await import('../../features/placeholders.js');
     await replaceKey('starting-at', getConfig()).then((key) => {
-      const startingAt = createTag('div', { slot: 'starting-at' }, key);
+      const startingAt = createTag('div', { class: 'starting-at' }, key);
       const price = merchCard.querySelector('span[is="inline-price"]');
       if (price) {
         price.parentNode.prepend(startingAt);

libs/deps/mas/merch-offer-select.js

@@ -246,4 +246,3 @@ import{html as h,LitElement as g}from"../lit-all.min.js";import{css as u,html as
                     ></sp-tooltip>
                 </sp-overlay>
             </div>`}render(){return this.configuration||!this.price?"":this.type==="subscription-option"?this.asSubscriptionOption:this.asRadioOption}get price(){return this.querySelector('span[is="inline-price"]:not([data-template="strikethrough"])')}get cta(){return this.querySelector('a[is="checkout-link"]')}get prices(){return this.querySelectorAll('span[is="inline-price"]')}get customerSegment(){return this.price?.value?.[0].customerSegment}get marketSegment(){return this.price?.value?.[0].marketSegments[0]}async initOffer(){if(!this.price)return;this.prices.forEach(t=>t.setAttribute("slot","price")),await this.updateComplete,await Promise.all([...this.prices].map(t=>t.onceSettled()));let{value:[e]}=this.price;this.planType=e.planType,await this.updateComplete,this.dispatchEvent(new CustomEvent(o,{bubbles:!0}))}};customElements.define(x,c);
-//# sourceMappingURL=merch-offer-select.js.map

libs/features/mas/README.md

@@ -17,12 +17,11 @@ Refer to the corresponding README.md under any of the packages:
 * commerce - contains generic commerce-related logic, 'price' and 'checkout-link' web components
 * web-components - merch-card, merch-offer-selector and other web components
 
-# Consumption of artifacts in Milo
-Please run 'npm run build'
-```
-npm run build
+### Generate docs
+
+```sh
+node run build:docs
 ```
-Copy required artifacts folder to milo/libs/deps/mas.
 
 #### Troubleshooting
 Please reach out to us in `#tacocat-friends` for any questions.

libs/features/mas/build-docs.mjs

@@ -0,0 +1,85 @@
+// build-docs.mjs
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import markdownIt from 'markdown-it';
+import markdownItAttrs from 'markdown-it-attrs';
+import markdownItAnchor from 'markdown-it-anchor';
+import markdownItContainer from 'markdown-it-container';
+import markdownItHighlightjs from 'markdown-it-highlightjs';
+
+// Reconstruct __dirname and __filename in ES6 modules
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const sourceFile = process.argv[2];
+if (!sourceFile) {
+    console.error('Please provide a source file as an argument');
+    process.exit(1);
+}
+
+const targetFile = process.argv[3];
+if (!targetFile) {
+    console.error('Please provide a target file as an argument');
+    process.exit(1);
+}
+
+const skipMas = process.argv.includes('--skip-mas');
+
+// Initialize markdown-it with desired plugins
+const md = markdownIt({
+    html: true,
+    linkify: true,
+    typographer: true,
+})
+    .use(markdownItAttrs)
+    .use(markdownItAnchor, {
+        permalink: markdownItAnchor.permalink.headerLink(),
+    })
+    .use(markdownItContainer, 'warning')
+    .use(markdownItHighlightjs);
+
+// Define input and output paths
+const inputPath = path.join(__dirname, sourceFile);
+const outputPath = path.join(targetFile);
+
+// Read the Markdown file
+const inputContent = fs.readFileSync(inputPath, 'utf8');
+
+// Render Markdown to HTML
+const htmlContent = md.render(inputContent);
+
+const masJs = skipMas
+    ? ''
+    : '<script type="module" src="../../../deps/mas/mas.js"></script>';
+
+// HTML template with your custom element script
+const htmlTemplate = `
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <title>Custom Element Documentation</title>
+  <!-- Include your custom element script as an ES6 module -->
+  <script src="../../../features/spectrum-web-components/dist/theme.js" type="module"></script>
+  <script src="../../../features/spectrum-web-components/dist/button.js" type="module"></script>
+  ${masJs}
+  <!-- Include Highlight.js stylesheet for syntax highlighting -->
+  <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/default.min.css">
+  <!-- Include any additional stylesheets -->
+  <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+<main>
+<sp-theme color="light" scale="medium">
+${htmlContent}
+</sp-theme>
+</main>
+</body>
+</html>
+`;
+
+// Write the HTML file
+fs.writeFileSync(outputPath, htmlTemplate, 'utf8');
+console.log('Documentation generated at', outputPath);

libs/features/mas/build-docs.sh

@@ -0,0 +1,10 @@
+#!/bin/bash
+
+# Build documentation for commerce/checkout-link.md and output to docs/checkout-link.html
+node build-docs.mjs commerce/checkout-link.md docs/checkout-link.html
+
+# Build documentation for mas/mas.md and output to docs/mas.html
+node build-docs.mjs mas/mas.md docs/mas.html
+
+# Build documentation for mas/mas.js.md and output to docs/mas.js.html, does not include mas.js in the generated html
+node build-docs.mjs mas/mas.js.md docs/mas.js.html --skip-mas