@stencil/core 4.33.1-dev.1749534306.36fca61 → 4.33.1-dev.1749618190.28e2a06

package/internal/client/index.js

@@ -1,5 +1,5 @@
 /*
- Stencil Client Platform v4.33.1-dev.1749534306.36fca61 | MIT Licensed | https://stenciljs.com
+ Stencil Client Platform v4.33.1-dev.1749618190.28e2a06 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -640,13 +640,17 @@ var addSlotRelocateNode = (newChild, slotNode, prepend, position) => {
 };
 var getSlotName = (node) => typeof node["s-sn"] === "string" ? node["s-sn"] : node.nodeType === 1 && node.getAttribute("slot") || void 0;
 function patchSlotNode(node) {
-  if (node.assignedElements || node.assignedNodes || !node["s-sr"]) return;
+  var _a;
+  const slotNode = node;
+  if (slotNode.assignedElements || slotNode.assignedNodes || !node["s-sr"]) {
+    return;
+  }
   const assignedFactory = (elementsOnly) => (function(opts) {
     const toReturn = [];
     const slotName = this["s-sn"];
     if (opts == null ? void 0 : opts.flatten) {
       console.error(`
-          Flattening is not supported for Stencil non-shadow slots. 
+          Flattening is not supported for Stencil non-shadow slots.
           You can use \`.childNodes\` to nested slot fallback content.
           If you have a particular use case, please open an issue on the Stencil repo.
         `);
@@ -663,8 +667,39 @@ function patchSlotNode(node) {
     }
     return toReturn;
   }).bind(node);
-  node.assignedElements = assignedFactory(true);
-  node.assignedNodes = assignedFactory(false);
+  slotNode.assignedElements = assignedFactory(true);
+  slotNode.assignedNodes = assignedFactory(false);
+  slotNode.__eventListeners = (_a = slotNode.__eventListeners) != null ? _a : [];
+  if (!slotNode.addEventListener) {
+    slotNode.addEventListener = function(type, listener) {
+      this.__eventListeners = this.__eventListeners || [];
+      this.__eventListeners.push({ type, listener });
+    };
+  }
+  if (!slotNode.removeEventListener) {
+    slotNode.removeEventListener = function(type, listener) {
+      if (!this.__eventListeners) return;
+      this.__eventListeners = this.__eventListeners.filter((l) => !(l.type === type && l.listener === listener));
+    };
+  }
+  if (!slotNode.dispatchEvent) {
+    slotNode.dispatchEvent = function(event) {
+      if (!this.__eventListeners) return true;
+      const listeners = this.__eventListeners.filter((l) => l.type === event.type);
+      for (const { listener } of listeners) {
+        try {
+          if (typeof listener === "function") {
+            listener.call(this, event);
+          } else if (listener && typeof listener.handleEvent === "function") {
+            listener.handleEvent(event);
+          }
+        } catch (err2) {
+          console.error("Error in slot event listener:", err2);
+        }
+      }
+      return !event.defaultPrevented;
+    };
+  }
 }
 function dispatchSlotChangeEvent(elm) {
   elm.dispatchEvent(new CustomEvent("slotchange", { bubbles: false, cancelable: false, composed: false }));
@@ -1294,15 +1329,19 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
   vnode.$elm$ = hostElm;
   const members = Object.entries(((_a = hostRef.$cmpMeta$) == null ? void 0 : _a.$members$) || {});
   members.forEach(([memberName, [memberFlags, metaAttributeName]]) => {
-    var _a2;
+    var _a2, _b;
     if (!(memberFlags & 31 /* Prop */)) {
       return;
     }
     const attributeName = metaAttributeName || memberName;
     const attrVal = hostElm.getAttribute(attributeName);
     if (attrVal !== null) {
-      const attrPropVal = parsePropertyValue(attrVal, memberFlags);
-      (_a2 = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _a2.set(memberName, attrPropVal);
+      const attrPropVal = parsePropertyValue(
+        attrVal,
+        memberFlags,
+        BUILD13.formAssociated && !!(((_a2 = hostRef.$cmpMeta$) == null ? void 0 : _a2.$flags$) & 64 /* formAssociated */)
+      );
+      (_b = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _b.set(memberName, attrPropVal);
     }
   });
   let scopeId2;
@@ -2073,7 +2112,7 @@ import { BUILD as BUILD22 } from "@stencil/core/internal/app-data";
 
 // src/runtime/parse-property-value.ts
 import { BUILD as BUILD14 } from "@stencil/core/internal/app-data";
-var parsePropertyValue = (propValue, propType) => {
+var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   if ((BUILD14.hydrateClientSide || BUILD14.hydrateServerSide) && typeof propValue === "string" && (propValue.startsWith("{") && propValue.endsWith("}") || propValue.startsWith("[") && propValue.endsWith("]"))) {
     try {
       propValue = JSON.parse(propValue);
@@ -2087,7 +2126,11 @@ var parsePropertyValue = (propValue, propType) => {
   }
   if (propValue != null && !isComplexType(propValue)) {
     if (BUILD14.propBoolean && propType & 4 /* Boolean */) {
-      return propValue === "false" ? false : propValue === "" || !!propValue;
+      if (BUILD14.formAssociated && isFormAssociated && typeof propValue === "string") {
+        return propValue === "" || !!propValue;
+      } else {
+        return propValue === "false" ? false : propValue === "" || !!propValue;
+      }
     }
     if (BUILD14.propNumber && propType & 2 /* Number */) {
       return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
@@ -2433,7 +2476,7 @@ var checkSlotFallbackVisibility = false;
 var checkSlotRelocate = false;
 var isSvgMode = false;
 var createElm = (oldParentVNode, newParentVNode, childIndex) => {
-  var _a;
+  var _a, _b;
   const newVNode2 = newParentVNode.$children$[childIndex];
   let i2 = 0;
   let elm;
@@ -2463,6 +2506,11 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
     elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
   } else if (BUILD20.slotRelocation && newVNode2.$flags$ & 1 /* isSlotReference */) {
     elm = newVNode2.$elm$ = BUILD20.isDebug || BUILD20.hydrateServerSide ? slotReferenceDebugNode(newVNode2) : win.document.createTextNode("");
+    elm["s-sr"] = true;
+    elm["s-cr"] = contentRef;
+    elm["s-sn"] = newVNode2.$name$ || "";
+    elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
+    patchSlotNode(elm);
     if (BUILD20.vdomAttribute) {
       updateElement(null, newVNode2, isSvgMode);
     }
@@ -2509,11 +2557,13 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   elm["s-hn"] = hostTagName;
   if (BUILD20.slotRelocation) {
     if (newVNode2.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) {
-      elm["s-sr"] = true;
-      elm["s-cr"] = contentRef;
-      elm["s-sn"] = newVNode2.$name$ || "";
-      elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
-      patchSlotNode(elm);
+      if (!(newVNode2.$flags$ & 1 /* isSlotReference */)) {
+        elm["s-sr"] = true;
+        elm["s-cr"] = contentRef;
+        elm["s-sn"] = newVNode2.$name$ || "";
+        elm["s-rf"] = (_b = newVNode2.$attrs$) == null ? void 0 : _b.ref;
+        patchSlotNode(elm);
+      }
       oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
       if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
         if (BUILD20.experimentalSlotFixes) {
@@ -3281,7 +3331,11 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
   const oldVal = hostRef.$instanceValues$.get(propName);
   const flags = hostRef.$flags$;
   const instance = BUILD22.lazyLoad ? hostRef.$lazyInstance$ : elm;
-  newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
+  newVal = parsePropertyValue(
+    newVal,
+    cmpMeta.$members$[propName][0],
+    BUILD22.formAssociated && !!(cmpMeta.$flags$ & 64 /* formAssociated */)
+  );
   const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
   const didValueChange = newVal !== oldVal && !areBothNaN;
   if ((!BUILD22.lazyLoad || !(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
@@ -3419,7 +3473,13 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
               } else if (!ref.$instanceValues$.get(memberName) && currentValue) {
                 ref.$instanceValues$.set(memberName, currentValue);
               }
-              origSetter.apply(this, [parsePropertyValue(newValue, memberFlags)]);
+              origSetter.apply(this, [
+                parsePropertyValue(
+                  newValue,
+                  memberFlags,
+                  BUILD23.formAssociated && !!(cmpMeta.$flags$ & 64 /* formAssociated */)
+                )
+              ]);
               newValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
               setValue(this, memberName, newValue, cmpMeta);
               return;
@@ -3445,7 +3505,11 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
                 if (!ref.$instanceValues$.get(memberName) && currentValue) {
                   ref.$instanceValues$.set(memberName, currentValue);
                 }
-                ref.$lazyInstance$[memberName] = parsePropertyValue(newValue, memberFlags);
+                ref.$lazyInstance$[memberName] = parsePropertyValue(
+                  newValue,
+                  memberFlags,
+                  BUILD23.formAssociated && !!(cmpMeta.$flags$ & 64 /* formAssociated */)
+                );
                 setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
               };
               if (ref.$lazyInstance$) {

package/internal/client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/client",
-  "version": "4.33.1-dev.1749534306.36fca61",
+  "version": "4.33.1-dev.1749618190.28e2a06",
   "description": "Stencil internal client platform to be imported by the Stencil Compiler and internal runtime. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "exports": "./index.js",

package/internal/client/patch-browser.js

@@ -1,5 +1,5 @@
 /*
- Stencil Client Patch Browser v4.33.1-dev.1749534306.36fca61 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v4.33.1-dev.1749618190.28e2a06 | MIT Licensed | https://stenciljs.com
  */
 
 // src/client/client-patch-browser.ts

package/internal/hydrate/index.js

@@ -1,5 +1,5 @@
 /*
- Stencil Hydrate Platform v4.33.1-dev.1749534306.36fca61 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Platform v4.33.1-dev.1749618190.28e2a06 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {
@@ -411,13 +411,17 @@ var addSlotRelocateNode = (newChild, slotNode, prepend, position) => {
 };
 var getSlotName = (node) => typeof node["s-sn"] === "string" ? node["s-sn"] : node.nodeType === 1 && node.getAttribute("slot") || void 0;
 function patchSlotNode(node) {
-  if (node.assignedElements || node.assignedNodes || !node["s-sr"]) return;
+  var _a;
+  const slotNode = node;
+  if (slotNode.assignedElements || slotNode.assignedNodes || !node["s-sr"]) {
+    return;
+  }
   const assignedFactory = (elementsOnly) => (function(opts) {
     const toReturn = [];
     const slotName = this["s-sn"];
     if (opts == null ? void 0 : opts.flatten) {
       console.error(`
-          Flattening is not supported for Stencil non-shadow slots. 
+          Flattening is not supported for Stencil non-shadow slots.
           You can use \`.childNodes\` to nested slot fallback content.
           If you have a particular use case, please open an issue on the Stencil repo.
         `);
@@ -434,8 +438,39 @@ function patchSlotNode(node) {
     }
     return toReturn;
   }).bind(node);
-  node.assignedElements = assignedFactory(true);
-  node.assignedNodes = assignedFactory(false);
+  slotNode.assignedElements = assignedFactory(true);
+  slotNode.assignedNodes = assignedFactory(false);
+  slotNode.__eventListeners = (_a = slotNode.__eventListeners) != null ? _a : [];
+  if (!slotNode.addEventListener) {
+    slotNode.addEventListener = function(type, listener) {
+      this.__eventListeners = this.__eventListeners || [];
+      this.__eventListeners.push({ type, listener });
+    };
+  }
+  if (!slotNode.removeEventListener) {
+    slotNode.removeEventListener = function(type, listener) {
+      if (!this.__eventListeners) return;
+      this.__eventListeners = this.__eventListeners.filter((l) => !(l.type === type && l.listener === listener));
+    };
+  }
+  if (!slotNode.dispatchEvent) {
+    slotNode.dispatchEvent = function(event) {
+      if (!this.__eventListeners) return true;
+      const listeners = this.__eventListeners.filter((l) => l.type === event.type);
+      for (const { listener } of listeners) {
+        try {
+          if (typeof listener === "function") {
+            listener.call(this, event);
+          } else if (listener && typeof listener.handleEvent === "function") {
+            listener.handleEvent(event);
+          }
+        } catch (err2) {
+          console.error("Error in slot event listener:", err2);
+        }
+      }
+      return !event.defaultPrevented;
+    };
+  }
 }
 function dispatchSlotChangeEvent(elm) {
   elm.dispatchEvent(new CustomEvent("slotchange", { bubbles: false, cancelable: false, composed: false }));
@@ -1065,15 +1100,19 @@ var initializeClientHydrate = (hostElm, tagName, hostId, hostRef) => {
   vnode.$elm$ = hostElm;
   const members = Object.entries(((_a = hostRef.$cmpMeta$) == null ? void 0 : _a.$members$) || {});
   members.forEach(([memberName, [memberFlags, metaAttributeName]]) => {
-    var _a2;
+    var _a2, _b;
     if (!(memberFlags & 31 /* Prop */)) {
       return;
     }
     const attributeName = metaAttributeName || memberName;
     const attrVal = hostElm.getAttribute(attributeName);
     if (attrVal !== null) {
-      const attrPropVal = parsePropertyValue(attrVal, memberFlags);
-      (_a2 = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _a2.set(memberName, attrPropVal);
+      const attrPropVal = parsePropertyValue(
+        attrVal,
+        memberFlags,
+        BUILD7.formAssociated && !!(((_a2 = hostRef.$cmpMeta$) == null ? void 0 : _a2.$flags$) & 64 /* formAssociated */)
+      );
+      (_b = hostRef == null ? void 0 : hostRef.$instanceValues$) == null ? void 0 : _b.set(memberName, attrPropVal);
     }
   });
   let scopeId2;
@@ -1844,7 +1883,7 @@ import { BUILD as BUILD16 } from "@stencil/core/internal/app-data";
 
 // src/runtime/parse-property-value.ts
 import { BUILD as BUILD8 } from "@stencil/core/internal/app-data";
-var parsePropertyValue = (propValue, propType) => {
+var parsePropertyValue = (propValue, propType, isFormAssociated) => {
   if ((BUILD8.hydrateClientSide || BUILD8.hydrateServerSide) && typeof propValue === "string" && (propValue.startsWith("{") && propValue.endsWith("}") || propValue.startsWith("[") && propValue.endsWith("]"))) {
     try {
       propValue = JSON.parse(propValue);
@@ -1858,7 +1897,11 @@ var parsePropertyValue = (propValue, propType) => {
   }
   if (propValue != null && !isComplexType(propValue)) {
     if (BUILD8.propBoolean && propType & 4 /* Boolean */) {
-      return propValue === "false" ? false : propValue === "" || !!propValue;
+      if (BUILD8.formAssociated && isFormAssociated && typeof propValue === "string") {
+        return propValue === "" || !!propValue;
+      } else {
+        return propValue === "false" ? false : propValue === "" || !!propValue;
+      }
     }
     if (BUILD8.propNumber && propType & 2 /* Number */) {
       return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
@@ -2204,7 +2247,7 @@ var checkSlotFallbackVisibility = false;
 var checkSlotRelocate = false;
 var isSvgMode = false;
 var createElm = (oldParentVNode, newParentVNode, childIndex) => {
-  var _a;
+  var _a, _b;
   const newVNode2 = newParentVNode.$children$[childIndex];
   let i2 = 0;
   let elm;
@@ -2234,6 +2277,11 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
     elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
   } else if (BUILD14.slotRelocation && newVNode2.$flags$ & 1 /* isSlotReference */) {
     elm = newVNode2.$elm$ = BUILD14.isDebug || BUILD14.hydrateServerSide ? slotReferenceDebugNode(newVNode2) : win.document.createTextNode("");
+    elm["s-sr"] = true;
+    elm["s-cr"] = contentRef;
+    elm["s-sn"] = newVNode2.$name$ || "";
+    elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
+    patchSlotNode(elm);
     if (BUILD14.vdomAttribute) {
       updateElement(null, newVNode2, isSvgMode);
     }
@@ -2280,11 +2328,13 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
   elm["s-hn"] = hostTagName;
   if (BUILD14.slotRelocation) {
     if (newVNode2.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) {
-      elm["s-sr"] = true;
-      elm["s-cr"] = contentRef;
-      elm["s-sn"] = newVNode2.$name$ || "";
-      elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
-      patchSlotNode(elm);
+      if (!(newVNode2.$flags$ & 1 /* isSlotReference */)) {
+        elm["s-sr"] = true;
+        elm["s-cr"] = contentRef;
+        elm["s-sn"] = newVNode2.$name$ || "";
+        elm["s-rf"] = (_b = newVNode2.$attrs$) == null ? void 0 : _b.ref;
+        patchSlotNode(elm);
+      }
       oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
       if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
         if (BUILD14.experimentalSlotFixes) {
@@ -3052,7 +3102,11 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
   const oldVal = hostRef.$instanceValues$.get(propName);
   const flags = hostRef.$flags$;
   const instance = BUILD16.lazyLoad ? hostRef.$lazyInstance$ : elm;
-  newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
+  newVal = parsePropertyValue(
+    newVal,
+    cmpMeta.$members$[propName][0],
+    BUILD16.formAssociated && !!(cmpMeta.$flags$ & 64 /* formAssociated */)
+  );
   const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
   const didValueChange = newVal !== oldVal && !areBothNaN;
   if ((!BUILD16.lazyLoad || !(flags & 8 /* isConstructingInstance */) || oldVal === void 0) && didValueChange) {
@@ -3190,7 +3244,13 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
               } else if (!ref.$instanceValues$.get(memberName) && currentValue) {
                 ref.$instanceValues$.set(memberName, currentValue);
               }
-              origSetter.apply(this, [parsePropertyValue(newValue, memberFlags)]);
+              origSetter.apply(this, [
+                parsePropertyValue(
+                  newValue,
+                  memberFlags,
+                  BUILD17.formAssociated && !!(cmpMeta.$flags$ & 64 /* formAssociated */)
+                )
+              ]);
               newValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
               setValue(this, memberName, newValue, cmpMeta);
               return;
@@ -3216,7 +3276,11 @@ More information: https://stenciljs.com/docs/properties#prop-mutability`
                 if (!ref.$instanceValues$.get(memberName) && currentValue) {
                   ref.$instanceValues$.set(memberName, currentValue);
                 }
-                ref.$lazyInstance$[memberName] = parsePropertyValue(newValue, memberFlags);
+                ref.$lazyInstance$[memberName] = parsePropertyValue(
+                  newValue,
+                  memberFlags,
+                  BUILD17.formAssociated && !!(cmpMeta.$flags$ & 64 /* formAssociated */)
+                );
                 setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
               };
               if (ref.$lazyInstance$) {
@@ -4046,7 +4110,7 @@ function proxyHostElement(elm, cstr) {
         let attrPropVal;
         const { get: origGetter, set: origSetter } = Object.getOwnPropertyDescriptor(cstr.prototype, memberName) || {};
         if (attrValue != null) {
-          attrPropVal = parsePropertyValue(attrValue, memberFlags);
+          attrPropVal = parsePropertyValue(attrValue, memberFlags, !!(cmpMeta.$flags$ & 64 /* formAssociated */));
         }
         if (propValue !== void 0) {
           attrPropVal = propValue;

package/internal/hydrate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal/hydrate",
-  "version": "4.33.1-dev.1749534306.36fca61",
+  "version": "4.33.1-dev.1749618190.28e2a06",
   "description": "Stencil internal hydrate platform to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "private": true

package/internal/hydrate/runner.js

@@ -1,5 +1,5 @@
 /*
- Stencil Hydrate Runner v4.33.1-dev.1749534306.36fca61 | MIT Licensed | https://stenciljs.com
+ Stencil Hydrate Runner v4.33.1-dev.1749618190.28e2a06 | MIT Licensed | https://stenciljs.com
  */
 var __defProp = Object.defineProperty;
 var __export = (target, all) => {

package/internal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/internal",
-  "version": "4.33.1-dev.1749534306.36fca61",
+  "version": "4.33.1-dev.1749618190.28e2a06",
   "description": "Stencil internals only to be imported by the Stencil Compiler. Breaking changes can and will happen at any time.",
   "main": "./index.js",
   "types": "./index.d.ts",

package/internal/stencil-private.d.ts

@@ -1120,9 +1120,10 @@ export interface Plugin {
     pluginType?: string;
     load?: (id: string, context: PluginCtx) => Promise<string> | string;
     resolveId?: (importee: string, importer: string, context: PluginCtx) => Promise<string> | string;
-    transform?: (sourceText: string, id: string, context: PluginCtx) => Promise<PluginTransformResults> | PluginTransformResults | string;
+    transform?: (sourceText: string, id: string, context: PluginCtx) => Promise<PluginTransformResults> | PluginTransformResults;
 }
-export interface PluginTransformResults {
+export type PluginTransformResults = PluginTransformationDescriptor | string | null;
+export interface PluginTransformationDescriptor {
     code?: string;
     map?: string;
     id?: string;

package/internal/stencil-public-compiler.d.ts

@@ -250,7 +250,6 @@ export interface StencilConfig {
     docs?: StencilDocsConfig;
     globalScript?: string;
     srcIndexHtml?: string;
-    watch?: boolean;
     testing?: TestingConfig;
     maxConcurrentWorkers?: number;
     preamble?: string;
@@ -273,6 +272,17 @@ export interface StencilConfig {
     sys?: CompilerSystem;
     tsconfig?: string;
     validateTypes?: boolean;
+    /**
+     * Sets whether Stencil will watch for changes in the source files and rebuild the project automatically.
+     * @default true
+     */
+    watch?: boolean;
+    /**
+     * External directories to watch for changes. By default, Stencil will watch the root and {@link StencilConfig.srcDir}
+     * directory for changes. If you want to watch additional directories, including e.g. `node_modules`, you can add them here.
+     * @default []
+     */
+    watchExternalDirs?: string[];
     /**
      * An array of RegExp patterns that are matched against all source files before adding
      * to the watch list in watch mode. If the file path matches any of the patterns, when it