@progressive-development/pd-order 0.1.124 → 0.1.125

package/package.json

@@ -3,18 +3,24 @@
   "description": "Progressive Development Order Component",
   "author": "PD Progressive Development",
   "license": "SEE LICENSE IN LICENSE",
-  "version": "0.1.124",
-  "main": "index.js",
-  "module": "index.js",
+  "version": "0.1.125",
+  "exports": {
+    "./pd-order-contacts": "./dist/pd-order-contacts.js",
+    "./pd-order-summary": "./dist/pd-order-summary.js"
+  },
   "scripts": {
     "analyze": "cem analyze --litelement",
-    "start": "web-dev-server",
-    "lint": "eslint --ext .js,.html . --ignore-path .gitignore && prettier \"**/*.js\" --check --ignore-path .gitignore",
-    "format": "eslint --ext .js,.html . --fix --ignore-path .gitignore && prettier \"**/*.js\" --write --ignore-path .gitignore",
-    "test": "web-test-runner --coverage",
-    "test:watch": "web-test-runner --watch",
-    "storybook": "npm run analyze -- --exclude dist && web-dev-server -c .storybook/server.mjs",
-    "storybook:build": "npm run analyze -- --exclude dist && build-storybook"
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview",
+    "lint": "eslint --ext .js,.html . --ignore-path .gitignore && prettier \"**/*.{js,html}\" --check --ignore-path .gitignore",
+    "format": "eslint --ext .js,.html . --fix --ignore-path .gitignore && prettier \"**/*.{js,html}\" --write --ignore-path .gitignore",
+    "test": "vitest run --coverage",
+    "test:watch": "vitest --watch",
+    "localizeExtract": "lit-localize extract",
+    "localizeBuild": "lit-localize build",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
   },
   "dependencies": {
     "@progressive-development/pd-calendar": "^0.2.21",
@@ -24,28 +30,32 @@
     "@progressive-development/pd-forms": "^0.2.16",
     "@progressive-development/pd-price": "^0.1.10",
     "@progressive-development/pd-shared-styles": "^0.1.1",
-    "@progressive-development/pd-zip-check": "^0.1.59",
-    "fecha": "^4.2.0",
-    "lit": "^2.2.0"
+    "fecha": "^4.2.3",
+    "lit": "^2.8.0"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.4.17",
-    "@open-wc/eslint-config": "^4.3.0",
-    "@open-wc/testing": "next",
-    "@web/dev-server": "^0.1.30",
-    "@web/dev-server-storybook": "next",
-    "@web/test-runner": "^0.13.27",
+    "@lit/localize-tools": "^0.7.2",
+    "@storybook/addon-essentials": "^7.6.4",
+    "@storybook/addon-links": "^7.6.4",
+    "@storybook/blocks": "^7.5.1",
+    "@storybook/web-components": "^7.5.1",
+    "@storybook/web-components-vite": "^7.6.4",
     "eslint": "^7.32.0",
-    "eslint-config-prettier": "^8.4.0",
+    "eslint-config-prettier": "^8.10.0",
+    "eslint-plugin-storybook": "^0.6.15",
     "husky": "^4.3.8",
     "lint-staged": "^10.5.4",
-    "prettier": "^2.5.1"
+    "prettier": "^2.8.8",
+    "storybook": "^7.6.4",
+    "vite": "^5.4.11"
   },
   "customElements": "custom-elements.json",
   "eslintConfig": {
     "extends": [
       "@open-wc",
-      "prettier"
+      "prettier",
+      "plugin:storybook/recommended"
     ]
   },
   "prettier": {

package/stories/order-contacts.stories.js

@@ -9,10 +9,15 @@ export default {
   },
 };
 
-function Template({ summary, orderContact, billingContact }) {  
+function Template({ summary, orderContact, billingContact, withPayment, requiredFields }) {  
   return html`    
-    <pd-order-contacts id="testOrderId" ?summary="${summary}" .orderContact="${orderContact}" 
-      .billingContact="${billingContact}"></pd-order-contacts>    
+    <pd-order-contacts id="testOrderId" 
+      ?summary="${summary}" 
+      .orderContact="${orderContact}" 
+      .billingContact="${billingContact}"
+      ?withPayment="${withPayment}"
+      .requiredFields=${requiredFields}
+    ></pd-order-contacts>    
 
     <h2>Test Validation</h2>
     <button @click="${() => {
@@ -28,6 +33,29 @@ OrderContacts.args = {
   summary: false,
 };
 
+export const OrderContactsRequiredFields = Template.bind({});
+OrderContactsRequiredFields.args = {  
+  summary: false,
+  requiredFields: [
+    "email",
+    "phone1",
+    "street", 
+    "streetNr",
+    "firstName",
+    "lastName",
+    "companyName",
+    "zip",
+    "city",
+  ]
+};
+
+export const OrderContactsWithBilling = Template.bind({});
+OrderContactsWithBilling.args = {  
+  summary: false,
+  withPayment: true,
+
+};
+
 export const OrderContactsView = Template.bind({});
 OrderContactsView.args = {  
   summary: true,
@@ -62,8 +90,7 @@ OrderContactsPrepared.args = {
       streetNr: '34a',
       zip: '6041',
       city: 'Gent',
-      phone1: '0221/9923443',
-      mobil: '0175/9923443',
+      phone1: '+49123 123456',
       email: 'peter@muster.be'
     },
   billingContact: {

package/vite.config.js

@@ -0,0 +1,25 @@
+import { defineConfig } from 'vite';
+import { dependencies } from './package.json';
+
+export default defineConfig({
+  build: {
+    lib: {
+      entry: {
+        'pd-order-contacts': './pd-order-contacts.js',
+        'pd-order-summary': './pd-order-summary.js',
+      },
+      formats: ['es'], // Nur ESModule, kein UMD
+    },
+    rollupOptions: {
+      external: Object.keys(dependencies), // Alle Abhängigkeiten aus package.json ausschließen
+      output: {
+        entryFileNames: '[name].js', // Keine Hashes, klare Dateinamen
+        chunkFileNames: '[name]-chunk.js', // Benenne Chunks klar und konsistent
+        globals: {
+          lit: 'Lit',
+        },
+      },
+    },
+    minify: false, // Keine Minifizierung
+  },
+});

package/index.js

@@ -1 +0,0 @@
-export { PdOrder } from './src/PdOrder.js';

package/pd-booking.js

@@ -1,3 +0,0 @@
-import { PdBooking } from './src/PdBooking.js';
-
-window.customElements.define('pd-booking', PdBooking);

package/src/PdBooking.js

@@ -1,537 +0,0 @@
-/* eslint-disable lit-a11y/anchor-is-valid */
-/* eslint-disable lit-a11y/click-events-have-key-events */
-/**
- * @license
- * Copyright (c) 2021 PD Progressive Development UG. All rights reserved.
- */
-
-import { LitElement, html, css } from 'lit';
-
-import {PdBookDatePopup} from '@progressive-development/pd-dialog/pd-book-date-popup.js';
-
-import '@progressive-development/pd-calendar/pd-calendar.js';
-import '@progressive-development/pd-zip-check/pd-zip-check.js';
-
-import { PDFontStyles } from '@progressive-development/pd-shared-styles';
-  
-export class PdBooking extends LitElement {
-   /**
-    * Fired when free date clicked => At the moment only for freeDates
-    * @event book-date
-    */
-
-   /**
-    * Fired when date or ZIP should edited by the user
-    * @event edit-selection
-    */
-
-   static get properties() {
-     return {
-       // custTok: {type: String},
-       // contractKey: {type: String},
-       // item: {type: String},
-       product: { type: Object },
-       zipGroups: { type: Array },
-       userData: { type: Object },
-       editDate: { type: Object },
-       // TODO: API Call object => Mixin
-       productInfoRequest: { type: Object },
-       _zipRequired: { type: Boolean },
-       _validated: { type: Boolean },
-       _zipInput: { type: String },
-       _statusMsg: { type: String },
-       _freeUnits: { type: Object },
-       _selectedDate: { type: String },
-     };
-   }
-
-  static get styles() {
-    return [
-      PDFontStyles,
-      css`
-        :host {
-          display: block;
-        }
-
-        p {
-          color: var(--pd-default-font-content-col);
-          font-size: var(--pd-default-font-content-size);
-          font-family: var(--pd-default-font-content-family);
-          max-width: 1000px;
-        }
-
-        a {
-          cursor: pointer; 
-          font-family: var(--pd-default-font-link-family);
-          font-size: var(--pd-default-font-link-size);
-          color: var(--pd-default-font-link-col);
-        }
-
-        a:hover {
-          color: var(--pd-default-font-link-col-hover);
-        }
-
-     `];
-   }
-
-   constructor() {
-     super();
-
-     // external attribut properties
-     // this.custTok = '';
-     // this.contractKey = '';
-     // this.item = '';
-     this.product = {};
-     this.zipGroups = [];
-     this.productInfoRequest = undefined;
-
-     // internal propertie
-     this._zipRequired = false;
-     this._validated = false;
-     this._zipInput = '';
-     this._statusMsg = '';
-
-     this._freeUnits = {};
-     this._cheapestWeekDays = [];
-     this._selectedDate = '';
-   }
-
-   connectedCallback() {
-     super.connectedCallback();
-
-     // hard coded configuration at the moment, ref init function?
-     this._validated = true;
-     this._zipRequired = true;
-     this._statusMsg = '';
-
-     /*
-     // init settings for customer
-     if (this.custTok) {
- 
-       // fetch customer data
-       this._statusMsg = 'Load content...';
-       this._getCustomerConfiguration(this.custTok)
-       .then (customerConf => {
- 
-         if (customerConf) {
- 
-           // setup specific configuration, at the moment only zip required
-           console.log(customerConf);
-           this._validated = true;
-           this._zipRequired = customerConf.result.zipRequired;
-           this._statusMsg = '';          
- 
-         } else {
-           this._statusMsg = "No result found for configured customer!";
-         }
- 
-       }).catch(error => {
-         switch (error.message) {
-           case INVALID_TOK:
-             this._statusMsg = "Invalid customer token configured!";
-             break;
-           default:
-             this._statusMsg = "Fehler bei der Abfrage aufgetreten: " + error.message;
-         }
-       });
- 
-     } else {
-       this._statusMsg = "Missing customer token!";
-     }
-     */
-   }
-
-  updated(changePros) {
-    if (changePros.has('userData') && this.userData) {
-      this._zipInput = this.userData.zip;       
-      let refDate;
-      if (this.editDate) {
-        refDate = new Date(this.editDate.getFullYear(), this.editDate.getMonth(), 1).getTime();
-      }
-      this._callService(this._zipInput, refDate);
-    }
-  }
-
-   render() {
-     // customer is initialied, load content
-     if (this._validated) {
-       // check if selection already done
-       if (this._selectedDate && this._selectedDate !== '') {
-         return this._renderSelection();
-         // check if zip is required and not set at the moment
-       }
-
-       if (this._zipRequired && this._zipInput === '') {
-         // Show ZIP input
-         return this._renderZIPInput();
-       }
-
-       // Show Content
-       return html` ${this._renderZIPResult()} ${this._renderCalendar()} `;
-     }
-
-     // customer request is going on, or there are errors during init call
-     return html` <p>${this._statusMsg}</p> `;
-   }
-
-   _renderZIPInput() {
-     return html`
-       <pd-zip-check .zipGroups="${this.zipGroups}"
-           @zip-selection="${e => {
-             this._zipInput = e.detail.zip;
-             this._callService(this._zipInput);
-           }}"
-           @edit-zip-selection="${() => {
-             this._zipInput = undefined;
-           }}">
-           <div slot="description">
-             <slot name="description"></slot>
-           </div>
-          </pd-zip-check>        
-       <p>${this._statusMsg}</p>
- 
-       <!--
-       <div style="max-width: 700px; min-width: 300px;">        
-         .. hier dann elememte von oben ...
-       </div>
-       <squi-resize-content style="width: 500px;">
-         <div slot="preview-content"><span class="popup-info">More informations about ZIP and price</span></div>
-         <div slot="resize-content">
-           <h3>Supported regions</h3>                    
-           <p>
-           We work in the region in and around Gent. On each weekday we are in the same ZIP region. 
-           Depending on your ZIP and the distance to that daily region the specific callout-fee for each weekday is calculated.        
-           </p>         
-           <table>          
-             <tr>
-               <th style="text-align: left;">Region</th>
-               <th style="text-align: left;">Cheapest Weekday</th>
-             </tr>
-             <tr>
-               <td>Gent central</td>
-               <td>Monday</td>
-             </tr>
-             <tr>
-               <td>Gent North</td>
-               <td>Tuesday</td>
-             </tr>
-             <tr>
-               <td>Gent East</td>
-               <td>Wednesday</td>
-             </tr>
-             <tr>
-               <td>Gent South</td>
-               <td>Thirsday</td>
-             </tr>
-             <tr>
-               <td>Gent West</td>
-               <td>Friday</td>
-             </tr>
-           </table>
-         </div>
-       </squi-resize-content>
-       -->
-                     
-     </div>
-     `;
-   }
-
-   _renderZIPResult() {
-     return html`
-       <slot name="titel"></slot>
-       <p>
-         Uw postcode:
-         ${this._zipInput}${this.userData
-           ? '.'
-           : html`
-               <a @click="${() => {
-                   this._zipInput = '';
-                   this._statusMsg = '';
-                   this.dispatchEvent(new CustomEvent('edit-zip-selection'));
-                 }}"
-                 >(bewerk).</a>
-             `}
-         Voor het voordeligste tarief, kies voor
-         ${this._cheapestWeekDays && this._cheapestWeekDays.length > 0
-           ? this._cheapestWeekDays[0].longName
-           : '--'},
-         wanneer een technieker in uw buurt is. Zo bespaart U op uw
-         herstellingskosten. Deze dag is aangeduid in het groen.
-       </p>
-     `;
-   }
-
-   _renderSelection() {
-     return html`
-       <p>
-         Selected date: ${this._selectedDate}
-         <a @click="${this._editSelectedDate}">(edit)</a>
-       </p>
-     `;
-   }
-
-   _renderCalendar() {
-     return html`
-       <pd-calendar
-         .refDate="${this.editDate}"
-         .data="${this._freeUnits}"
-         prevMonthConstraint="${this.editDate ? 1 : 0}" 
-         nextMonthConstraint="${this.editDate ? 1 : 2}"
-         @change-month="${this._changeDate}"
-         @select-date="${this._dateSelecetd}"
-       >
-         <p slot="calFooter">* excl. BTW</p>
-       </pd-calendar>
-     `;
-   }
-
-   static _renderPopupContent() {
-     return html`
-       <h3>Supported ZIPs</h3>
-       On each weekday we are in the same ZIP region. Depending on your ZIP and
-       the distance to that daily region the specific callout-fee for each
-       weekday is calculated.
-       <br /><br />
-       Our supported ZIP regions with cheapest week day:
-       <ul>
-         <li>Mo - Gent center - from xyz to xcv</li>
-         <li>Di - Gent north - from xyz to xcv</li>
-         <li>Mi - Gent east - from xyz to xcv</li>
-         <li>Do - Gent south - from xyz to xcv</li>
-         <li>Fr - Gent west - from xyz to xcv</li>
-       </ul>
-     `;
-   }
-
-   _changeDate(e) {
-     // load new data for selected startdate
-     this._callService(this._zipInput, e.detail.newDate.getTime());
-   }
-
-   _dateSelecetd(e) {
-     // Add order submit popup
-     const popupEl = new PdBookDatePopup();
-     popupEl.date = `${e.detail.dateKey}`;
-     popupEl.price = this._freeUnits[e.detail.dateKey][0].price;
-
-     popupEl.addEventListener('date-approval', () => {
-       this._selectedDate = e.detail.dateKey;
-       const { price } = this._freeUnits[e.detail.dateKey][0];
-       this.dispatchEvent(
-         new CustomEvent('book-date', {
-           bubbles: true,
-           composed: true,
-           detail: {
-             dateKey: e.detail.dateKey,
-             date: e.detail.date,
-             price,
-           },
-         })
-       );
-       this.shadowRoot.removeChild(popupEl);
-     });
-
-     popupEl.addEventListener('close-popup', () => {
-       this.shadowRoot.removeChild(popupEl);
-     });
-
-     this.shadowRoot.appendChild(popupEl);
-   }
-
-   _editSelectedDate() {
-     this._selectedDate = '';
-     this.dispatchEvent(new CustomEvent('edit-selection', {
-      bubbles: true,
-      composed: true,
-     }));
-   }
-
-   _callService(zip, dateParam) {
-     // get freeBookingUnits
-     // _getFreeBookingUnits(tok, contractKey, zip, item) {
-     this._statusMsg = `Load free booking units for ZIP ${zip} ...`;
-
-     // Load products and zip groups
-     if (
-       this.productInfoRequest &&
-       typeof this.productInfoRequest === 'function'
-     ) {
-       this.productInfoRequest(dateParam || 'default', this.editDate ? true : undefined, 
-        this.userData ? this.userData.contractId : undefined)
-         .then(result => {
-          if (result.userData && result.userData.freeUnits) {
-            this._freeUnits = this._transformResult(result.userData.freeUnits, result.nextMonth);
-           }
-         })
-         .catch(error => {
-           console.log('Result Error', error);
-         });
-     }
-   }
-
-   _transformResult(freeUnitsArray, nextMonth) {
-     // get zip goup
-     const selectedZipGroup = this.zipGroups.filter(group =>
-       group.zips.includes(this._zipInput)
-     )[0];
-
-     const calcPrice = weekDay => {
-       let callOutFee = 0;
-       if (selectedZipGroup && weekDay) {
-         callOutFee = selectedZipGroup.outFee[weekDay] || 0;
-       }
-       return this.userData && this.userData.free
-         ? 0
-         : this.product.price + callOutFee;
-     };
-
-     const extractCWD = zipGroup => {
-       const cwds = [];
-       if (zipGroup && zipGroup.outFee) {
-         const feeVals = [];
-         Object.keys(zipGroup.outFee).forEach(key =>
-           feeVals.push(zipGroup.outFee[key])
-         );
-         const minFee = Math.min(...feeVals);
-         Object.keys(zipGroup.outFee).forEach(key => {
-           if (zipGroup.outFee[key] === minFee) {
-             cwds.push({
-               shortName: key,
-               longName: PdBooking._transformKey(key),
-             });
-           }
-         });
-       }
-       return cwds;
-     };
-
-     this._cheapestWeekDays = extractCWD(selectedZipGroup);
-
-     const freeUnitObj = {};
-     if (freeUnitsArray) {
-        freeUnitsArray.forEach(unit => {
-        const priceTmp = calcPrice(unit.dayOfW);
-        freeUnitObj[unit.date] = [
-           {
-             info: `${priceTmp} €`,
-             price: priceTmp,
-             special: this._isCheapDay(unit.dayOfW),
-           },
-         ];
-       });
-       // set month selection
-       freeUnitObj.monthSelection = nextMonth;
-     }
-     return freeUnitObj;
-   }
-
-   _isCheapDay(day) {
-     return (
-       this._cheapestWeekDays.filter(cwd => cwd.shortName === day)[0] !==
-       undefined
-     );
-   }
-
-   static _transformKey(keyParam) {
-     switch (keyParam) {
-       case 'MO':
-         return 'maandag';
-       case 'TU':
-         return 'dinsdag';
-       case 'WE':
-         return 'woensdag';
-       case 'TH':
-         return 'dondersdag';
-       case 'FR':
-         return 'vrijdag';
-       case 'SA':
-         return 'zaterdag';
-       case 'SU':
-         return 'zondag';
-       default:
-         return '--';
-     }
-   }
-
-   /*
-   Old Implementation...
- 
-   this._getFreeBookingUnits(this.custTok, this.contractKey || 'default', 
-     zip, this.item || 'default', dateParam || 'default')
-   .then(freeUnits => {
- 
-     console.log("My Units: ", freeUnits);
-     this._zipInput = zip;
-     // TODO Add new result => Avoid query for previously selected dates
-     this._freeUnits = this._transformResult(freeUnits.result);
-     this._cheapestWeekDays = freeUnits.cwds;
-     
-   }).catch(error => {
-     switch (error.message) {
-       case INVALID_ZIP_RANGE:
-         this._statusMsg = "Sorry, the entered ZIP " + zip + " is out of our supported range!";
-         break;
-       case INVALID_PRICE_ITEM:
-           this._statusMsg = "Price item not configured properly!";
-           break;
-       case INVALID_DATE:
-         this._statusMsg = "Invalid date delivered!";
-         break;
-       default:
-         this._statusMsg = "Fehler bei der Abfrage aufgetreten: " + error.message;
-     }
-   });
- 
- _getFreeBookingUnits(tok, contractKey, zip, item, startDate) {
- 
-   console.log("Mein Startdate: ", startDate);
- 
-   return new Promise((resolve, reject) => {                  
-     fetch(SERVER_URL + FREE_UNITS_URL + tok + '/' + contractKey + '/' + zip + '/' + item + '/' + startDate || 'default', {
-       method: 'GET'            
-     })
-     .then(response => {
-       if (response.status >= 400) {
-         throw new Error(response.status);
-       }
-       const contentType = response.headers.get('content-type');
-       if (!contentType || !contentType.includes('application/json')) {
-         throw new TypeError("Wrong content-type: " + contentType);
-       }
-       return response.json();
-     })
-     .then(data => {
-       resolve(data);
-     })
-     .catch(error => {
-       reject(error);
-     });
-   });
- }
- 
- _getCustomerConfiguration(tok) {
- 
-   return new Promise((resolve, reject) => {                  
-     fetch(SERVER_URL + INIT_URL + tok, {
-       method: 'GET'            
-     })
-     .then(response => {
-       if (response.status >= 400) {
-         throw new Error(response.status);
-       }
-       const contentType = response.headers.get('content-type');
-       if (!contentType || !contentType.includes('application/json')) {
-         throw new TypeError("Wrong content-type: " + contentType);
-       }
-       return response.json();
-     })
-     .then(data => {
-       resolve(data);
-     })
-     .catch(error => {
-       reject(error);
-     });
-   });
- }
- */
- }

package/test/pd-order.test.js

@@ -1,32 +0,0 @@
-import { html } from 'lit';
-import { fixture, expect } from '@open-wc/testing';
-
-import '../pd-order.js';
-
-describe('PdOrder', () => {
-  it('has a default title "Hey there" and counter 5', async () => {
-    const el = await fixture(html`<pd-order></pd-order>`);
-
-    expect(el.title).to.equal('Hey there');
-    expect(el.counter).to.equal(5);
-  });
-
-  it('increases the counter on button click', async () => {
-    const el = await fixture(html`<pd-order></pd-order>`);
-    el.shadowRoot.querySelector('button').click();
-
-    expect(el.counter).to.equal(6);
-  });
-
-  it('can override the title via attribute', async () => {
-    const el = await fixture(html`<pd-order title="attribute title"></pd-order>`);
-
-    expect(el.title).to.equal('attribute title');
-  });
-
-  it('passes the a11y audit', async () => {
-    const el = await fixture(html`<pd-order></pd-order>`);
-
-    await expect(el).shadowDom.to.be.accessible();
-  });
-});

package/web-dev-server.config.mjs

@@ -1,27 +0,0 @@
-// import { hmrPlugin, presets } from '@open-wc/dev-server-hmr';
-
-/** Use Hot Module replacement by adding --hmr to the start command */
-const hmr = process.argv.includes('--hmr');
-
-export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
-  open: '/demo/',
-  /** Use regular watch mode if HMR is not enabled. */
-  watch: !hmr,
-  /** Resolve bare module imports */
-  nodeResolve: {
-    exportConditions: ['browser', 'development'],
-  },
-
-  /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
-  // esbuildTarget: 'auto'
-
-  /** Set appIndex to enable SPA routing */
-  // appIndex: 'demo/index.html',
-
-  plugins: [
-    /** Use Hot Module Replacement by uncommenting. Requires @open-wc/dev-server-hmr plugin */
-    // hmr && hmrPlugin({ exclude: ['**/*/node_modules/**/*'], presets: [presets.litElement] }),
-  ],
-
-  // See documentation for all available options
-});

package/web-test-runner.config.mjs

@@ -1,41 +0,0 @@
-// import { playwrightLauncher } from '@web/test-runner-playwright';
-
-const filteredLogs = ['Running in dev mode', 'lit-html is in dev mode'];
-
-export default /** @type {import("@web/test-runner").TestRunnerConfig} */ ({
-  /** Test files to run */
-  files: 'test/**/*.test.js',
-
-  /** Resolve bare module imports */
-  nodeResolve: {
-    exportConditions: ['browser', 'development'],
-  },
-
-  /** Filter out lit dev mode logs */
-  filterBrowserLogs(log) {
-    for (const arg of log.args) {
-      if (typeof arg === 'string' && filteredLogs.some(l => arg.includes(l))) {
-        return false;
-      }
-    }
-    return true;
-  },
-
-  /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
-  // esbuildTarget: 'auto',
-
-  /** Amount of browsers to run concurrently */
-  // concurrentBrowsers: 2,
-
-  /** Amount of test files per browser to test concurrently */
-  // concurrency: 1,
-
-  /** Browsers to run tests on */
-  // browsers: [
-  //   playwrightLauncher({ product: 'chromium' }),
-  //   playwrightLauncher({ product: 'firefox' }),
-  //   playwrightLauncher({ product: 'webkit' }),
-  // ],
-
-  // See documentation for all available options
-});