apostrophe 4.30.1-beta.1 → 4.31.0

package/modules/@apostrophecms/template/lib/jsxRuntime.js

@@ -0,0 +1,276 @@
+// JSX runtime used by Apostrophe `.jsx` templates. The classic Babel
+// transform (`@babel/plugin-transform-react-jsx`) compiles `<Tag a={x}>...</Tag>`
+// into `h(Tag, { a: x }, ...children)` and `<>...</>` into
+// `h(Fragment, null, ...children)`. The `h` function and `Fragment` symbol
+// are injected into every compiled module by `jsxLoader.js`.
+//
+// Output model: `h` returns a nested array of strings, `Raw` markers,
+// promises, and arrays. The array is flattened by `flatten()` which awaits
+// every promise, escapes plain string values, and joins everything into a
+// final HTML string. This array+promise model is what allows JSX templates
+// to call asynchronous helpers (`Area`, `Component`, `Template`, `Extend`)
+// directly inside markup without wrapping them in `await`.
+
+const voidElements = require('void-elements');
+
+const Fragment = Symbol('AposJsxFragment');
+
+// Marker class for already-rendered raw HTML. Anything wrapped in a `Raw`
+// is emitted into the final output without any additional escaping.
+class Raw {
+  constructor(html) {
+    this.html = (html == null) ? '' : String(html);
+  }
+}
+
+// Compatibility hook: Nunjucks `SafeString` instances (returned by Apostrophe
+// helpers like `apos.area.html()` and the `safe` filter) need to flow through
+// JSX templates without being escaped a second time. `template/index.js`
+// registers Nunjucks's `SafeString` class via `registerSafeClass()`; any
+// instance of a registered class is treated as raw HTML.
+const safeClasses = [];
+
+function registerSafeClass(cls) {
+  if (cls && !safeClasses.includes(cls)) {
+    safeClasses.push(cls);
+  }
+}
+
+function isSafeInstance(value) {
+  if (value == null || typeof value !== 'object') {
+    return false;
+  }
+  for (const cls of safeClasses) {
+    if (value instanceof cls) {
+      return true;
+    }
+  }
+  return false;
+}
+
+function escapeHtml(value) {
+  return String(value)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;');
+}
+
+function escapeAttr(value) {
+  return String(value)
+    .replace(/&/g, '&amp;')
+    .replace(/"/g, '&quot;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;');
+}
+
+// Build the JSX node for an element, function component, or fragment.
+// For function types (including the runtime helpers `Area`, `Component`,
+// `Template`, `Extend`, `Widget`) we invoke the function with a single
+// `props` object that includes `children`, matching React conventions.
+function h(type, props, ...children) {
+  props = props || {};
+  if (type === Fragment) {
+    return children;
+  }
+  if (typeof type === 'function') {
+    const finalProps = { ...props };
+    if (children.length > 0) {
+      finalProps.children = (children.length === 1) ? children[0] : children;
+    }
+    return type(finalProps);
+  }
+  if (typeof type !== 'string') {
+    throw new Error(`Invalid JSX element type: ${typeof type}`);
+  }
+  return buildElement(type, props, children);
+}
+
+function buildElement(tag, props, children) {
+  let attrs = '';
+  let dangerous = null;
+  for (const key of Object.keys(props)) {
+    if (key === 'children' || key === 'key' || key === 'ref') {
+      continue;
+    }
+    if (key === 'dangerouslySetInnerHTML') {
+      const v = props[key];
+      if (v && typeof v.__html === 'string') {
+        dangerous = v.__html;
+      } else if (v && v.__html != null) {
+        dangerous = String(v.__html);
+      }
+      continue;
+    }
+    const value = props[key];
+    if (value == null || value === false) {
+      continue;
+    }
+    const attrName = jsxAttrName(key);
+    if (value === true) {
+      attrs += ` ${attrName}`;
+    } else {
+      attrs += ` ${attrName}="${escapeAttr(value)}"`;
+    }
+  }
+
+  if (dangerous != null) {
+    return [
+      new Raw(`<${tag}${attrs}>`),
+      new Raw(dangerous),
+      new Raw(`</${tag}>`)
+    ];
+  }
+
+  if (voidElements[tag] && children.length === 0) {
+    return [ new Raw(`<${tag}${attrs} />`) ];
+  }
+
+  return [
+    new Raw(`<${tag}${attrs}>`),
+    ...children,
+    new Raw(`</${tag}>`)
+  ];
+}
+
+// Match React's friendly attribute names to standard HTML/SVG attribute
+// names. `data-*` and `aria-*` props pass through verbatim; SVG presentation
+// attributes (`strokeWidth`, `fillRule`, etc.) are converted to the
+// kebab-case form actually understood by browsers when the document is
+// parsed as text/html. The handful of SVG attributes that are *natively*
+// camelCase (e.g. `viewBox`, `preserveAspectRatio`) stay as-is.
+const svgAttrMap = {
+  // Stroke
+  strokeWidth: 'stroke-width',
+  strokeLinecap: 'stroke-linecap',
+  strokeLinejoin: 'stroke-linejoin',
+  strokeDasharray: 'stroke-dasharray',
+  strokeDashoffset: 'stroke-dashoffset',
+  strokeMiterlimit: 'stroke-miterlimit',
+  strokeOpacity: 'stroke-opacity',
+  // Fill
+  fillOpacity: 'fill-opacity',
+  fillRule: 'fill-rule',
+  // Clip / mask
+  clipPath: 'clip-path',
+  clipRule: 'clip-rule',
+  // Text
+  textAnchor: 'text-anchor',
+  textDecoration: 'text-decoration',
+  alignmentBaseline: 'alignment-baseline',
+  baselineShift: 'baseline-shift',
+  dominantBaseline: 'dominant-baseline',
+  fontFamily: 'font-family',
+  fontSize: 'font-size',
+  fontStyle: 'font-style',
+  fontVariant: 'font-variant',
+  fontWeight: 'font-weight',
+  letterSpacing: 'letter-spacing',
+  wordSpacing: 'word-spacing',
+  // Generic
+  colorInterpolation: 'color-interpolation',
+  colorInterpolationFilters: 'color-interpolation-filters',
+  colorProfile: 'color-profile',
+  colorRendering: 'color-rendering',
+  fillRendering: 'fill-rendering',
+  imageRendering: 'image-rendering',
+  shapeRendering: 'shape-rendering',
+  textRendering: 'text-rendering',
+  pointerEvents: 'pointer-events',
+  unicodeBidi: 'unicode-bidi',
+  vectorEffect: 'vector-effect',
+  writingMode: 'writing-mode',
+  enableBackground: 'enable-background',
+  floodColor: 'flood-color',
+  floodOpacity: 'flood-opacity',
+  glyphOrientationHorizontal: 'glyph-orientation-horizontal',
+  glyphOrientationVertical: 'glyph-orientation-vertical',
+  lightingColor: 'lighting-color',
+  markerEnd: 'marker-end',
+  markerMid: 'marker-mid',
+  markerStart: 'marker-start',
+  overflowWrap: 'overflow-wrap',
+  paintOrder: 'paint-order',
+  stopColor: 'stop-color',
+  stopOpacity: 'stop-opacity',
+  // Linked references
+  xlinkHref: 'xlink:href',
+  xlinkRole: 'xlink:role',
+  xlinkTitle: 'xlink:title',
+  xlinkType: 'xlink:type',
+  xlinkArcrole: 'xlink:arcrole',
+  xlinkActuate: 'xlink:actuate',
+  xlinkShow: 'xlink:show',
+  xmlBase: 'xml:base',
+  xmlLang: 'xml:lang',
+  xmlSpace: 'xml:space',
+  xmlnsXlink: 'xmlns:xlink'
+};
+
+function jsxAttrName(name) {
+  if (name === 'className') {
+    return 'class';
+  }
+  if (name === 'htmlFor') {
+    return 'for';
+  }
+  const svg = svgAttrMap[name];
+  if (svg) {
+    return svg;
+  }
+  return name;
+}
+
+// Walk the tree of strings, Raw markers, promises, and arrays, awaiting
+// every promise and producing a final HTML string. Plain strings/numbers
+// are escaped; Raw and Nunjucks SafeString values are not.
+async function flatten(node) {
+  const out = [];
+  await walk(node, out);
+  return out.join('');
+}
+
+async function walk(node, out) {
+  if (node == null || node === false || node === true) {
+    return;
+  }
+  if (Array.isArray(node)) {
+    for (const item of node) {
+      await walk(item, out);
+    }
+    return;
+  }
+  if (node instanceof Raw) {
+    out.push(node.html);
+    return;
+  }
+  if (isSafeInstance(node)) {
+    out.push(node.toString());
+    return;
+  }
+  if (typeof node === 'object' && typeof node.then === 'function') {
+    const resolved = await node;
+    await walk(resolved, out);
+    return;
+  }
+  if (typeof node === 'string') {
+    out.push(escapeHtml(node));
+    return;
+  }
+  if (typeof node === 'number' || typeof node === 'bigint') {
+    out.push(escapeHtml(String(node)));
+    return;
+  }
+  // Anything else (objects without a known handler) is coerced to string
+  // and escaped, mirroring how React stringifies unexpected children.
+  out.push(escapeHtml(String(node)));
+}
+
+module.exports = {
+  h,
+  Fragment,
+  Raw,
+  flatten,
+  escapeHtml,
+  escapeAttr,
+  registerSafeClass
+};

package/modules/@apostrophecms/template/lib/nunjucksLoader.js

@@ -7,23 +7,26 @@
 // Note that if @apostrophecms/template has a project-level override
 // of outerLayout.html, that will be loaded instead. This is
 // intentional.
+//
+// File watching and cache invalidation are deliberately NOT handled here:
+// the template module wires up `viewWatcher.js` once for both Nunjucks and
+// JSX, and clears every loader's `cache` (read by Nunjucks itself) when a
+// view file changes.
 
 const fs = require('fs');
 const path = require('path');
 const _ = require('lodash');
 const { stripIndent } = require('common-tags');
-const chokidar = require('chokidar');
 
 module.exports = function(moduleName, searchPaths, noWatch, templates, options) {
 
   const self = this;
-  self.watches = [];
   options = options || {};
   const extensions = options.extensions || [ 'njk', 'html' ];
   self.moduleName = moduleName;
   self.templates = templates;
 
-  self.init = function(searchPaths, noWatch) {
+  self.init = function(searchPaths) {
     self.pathsToNames = {};
     if (searchPaths) {
       searchPaths = Array.isArray(searchPaths) ? searchPaths : [ searchPaths ];
@@ -32,34 +35,6 @@ module.exports = function(moduleName, searchPaths, noWatch, templates, options)
     } else {
       self.searchPaths = [];
     }
-    // Unless and until chokidar declares this a supported config,
-    // no watching in WSL (it doesn't work without chokidar either)
-    if ((!noWatch) && (!require('is-wsl'))) {
-      _.each(self.searchPaths, function(p) {
-        if (fs.existsSync(p)) {
-          try {
-            const watcher = chokidar.watch(p);
-            watcher.on('change', (path, stats) => {
-              // Just blow the whole cache if anything is modified. Much
-              // simpler, avoids several false negatives, and works well for a
-              // CMS in dev. -Tom
-              self.cache = {};
-            });
-            self.watches.push(watcher);
-          } catch (e) {
-            if (!self.firstWatchFailure) {
-              // Don't crash in broken environments (not sure if any are left
-              // thanks to chokidar, but still a useful warning to have if it
-              // comes up)
-              self.firstWatchFailure = true;
-              self.templates.apos.util.warn('WARNING: fs.watch does not work on this system. That is OK but you\n' +
-                'will have to restart to see any template changes take effect.');
-            }
-            self.templates.apos.util.error(e);
-          }
-        }
-      });
-    }
   };
 
   self.isRelative = function(filename) {
@@ -183,11 +158,11 @@ module.exports = function(moduleName, searchPaths, noWatch, templates, options)
     }
   };
 
-  self.destroy = async () => {
-    for (const watch of self.watches) {
-      await watch.close();
-    }
-  };
+  // Retained for backwards compatibility — file watching now lives in
+  // `viewWatcher.js`, owned by the template module itself, so there is
+  // nothing for the loader to dispose of. Callers (Apostrophe internals
+  // and tests) may still invoke `destroy()` and that must keep working.
+  self.destroy = async () => {};
 
   self.init(searchPaths, noWatch);
 };

package/modules/@apostrophecms/template/lib/viewWatcher.js

@@ -0,0 +1,113 @@
+// File-watching for view directories shared by Nunjucks and JSX.
+//
+// Owns one chokidar watcher per directory and dispatches change events to
+// any number of registered handlers. The template module wires this up at
+// init time with two handlers: clear every Nunjucks loader's cache, and
+// invalidate compiled `.jsx` modules so the next render reloads them.
+//
+// WSL safety: chokidar's underlying file events are unreliable on WSL, so
+// we deliberately skip watching there — same behavior as the previous
+// in-loader code. Developers running on WSL will need to restart to pick
+// up template edits, but the rest of Apostrophe still functions.
+//
+// Returns a methods mixin compatible with `@apostrophecms/module`'s
+// `methods` factory pattern, the same way `bundlesLoader` and `jsxRender`
+// are mixed in.
+
+const fs = require('fs');
+const chokidar = require('chokidar');
+const isWsl = require('is-wsl');
+
+module.exports = (self) => {
+  // Lazily-allocated state. Lives on `self` so it survives across method
+  // calls and can be inspected by tests if needed.
+  if (!self._viewWatchers) {
+    self._viewWatchers = [];
+  }
+  if (!self._viewWatchedDirs) {
+    self._viewWatchedDirs = new Set();
+  }
+  if (!self._viewChangeHandlers) {
+    self._viewChangeHandlers = [];
+  }
+
+  return {
+    // Begin watching the supplied directories for change events. Idempotent
+    // per absolute path: subsequent calls with the same dir do not create
+    // duplicate watchers. Honors the WSL skip flag and the loader's
+    // `noWatch` option (templates module exposes this via
+    // `options.loader.noWatch`).
+    watchViewFolders(dirs) {
+      if (self.options.loader && self.options.loader.noWatch) {
+        return;
+      }
+      // In production the file tree is static and watching only burns
+      // file descriptors. Honor NODE_ENV unconditionally.
+      if (process.env.NODE_ENV === 'production') {
+        return;
+      }
+      // chokidar's recursive watching is not reliable on WSL; preserve the
+      // historical behavior of skipping watch setup entirely there.
+      if (isWsl) {
+        return;
+      }
+      for (const dir of dirs) {
+        if (self._viewWatchedDirs.has(dir)) {
+          continue;
+        }
+        if (!fs.existsSync(dir)) {
+          continue;
+        }
+        self._viewWatchedDirs.add(dir);
+        try {
+          const watcher = chokidar.watch(dir);
+          watcher.on('change', (filePath) => {
+            for (const handler of self._viewChangeHandlers) {
+              try {
+                handler(filePath);
+              } catch (e) {
+                self.apos.util.error(e);
+              }
+            }
+          });
+          self._viewWatchers.push(watcher);
+        } catch (e) {
+          // Don't crash in broken environments. Warn at most once so the
+          // logs don't get spammed for every dir we fail to watch.
+          if (!self._viewFirstWatchFailure) {
+            self._viewFirstWatchFailure = true;
+            self.apos.util.warn(
+              'WARNING: fs.watch does not work on this system. That is OK but you\n' +
+              'will have to restart to see any template changes take effect.'
+            );
+          }
+          self.apos.util.error(e);
+        }
+      }
+    },
+
+    // Register a callback invoked with the absolute path of the changed
+    // file every time chokidar reports a `change` event. Handlers run in
+    // registration order. Errors thrown by a handler are logged but never
+    // stop other handlers from running.
+    onViewChange(handler) {
+      self._viewChangeHandlers.push(handler);
+    },
+
+    // Tear down every chokidar watcher created via `watchViewFolders`.
+    // Called from the `apostrophe:destroy` handler so a process that
+    // builds and tears down multiple Apostrophe instances (tests, the
+    // multisite harness) doesn't leak file descriptors.
+    async closeViewWatchers() {
+      const watchers = self._viewWatchers.splice(0, self._viewWatchers.length);
+      self._viewWatchedDirs.clear();
+      for (const watcher of watchers) {
+        try {
+          await watcher.close();
+        } catch (e) {
+          self.apos.util.error(e);
+        }
+      }
+    }
+  };
+};

package/modules/@apostrophecms/ui/ui/apos/components/AposButtonGroup.vue

@@ -2,7 +2,7 @@
   <div
     class="apos-button-group"
     :class="modifierClass"
-    role="menubar"
+    role="toolbar"
   >
     <div class="apos-button-group__inner">
       <slot />

package/modules/@apostrophecms/ui/ui/apos/components/AposCellLastEdited.vue

@@ -70,6 +70,6 @@ export default {
 
 <style lang="scss" scoped>
   .apos-table__cell-field--relative-time {
-    color: var(--a-base-4);
+    color: var(--a-base-2);
   }
 </style>

package/modules/@apostrophecms/ui/ui/apos/components/AposSelect.vue

@@ -4,6 +4,7 @@
     :class="wrapperClasses"
   >
     <select
+      :id="uid"
       class="apos-input apos-input--select"
       :class="classes"
       :uid="uid"

package/modules/@apostrophecms/ui/ui/apos/components/AposSlat.vue

@@ -8,8 +8,9 @@
       'apos-is-only-child': slatCount === 1,
       'apos-is-selected': selected,
       'apos-is-disabled': disabled,
+      'apos-is-not-draggable': !draggable,
     }"
-    :aria-pressed="engaged"
+    :aria-current="engaged"
     role="listitem"
     :aria-labelledby="parent"
     @keydown.space="toggleEngage"
@@ -22,7 +23,7 @@
   >
     <div class="apos-slat__main">
       <drag-icon
-        v-if="slatCount > 1"
+        v-if="slatCount > 1 && draggable"
         class="apos-slat__control apos-slat__control--drag"
         :size="13"
       />
@@ -158,6 +159,10 @@ export default {
     editorIcon: {
       type: String,
       default: null
+    },
+    draggable: {
+      type: Boolean,
+      default: true
     }
   },
   emits: [ 'engage', 'disengage', 'move', 'remove', 'item-clicked', 'select' ],
@@ -209,7 +214,7 @@ export default {
       return e.target.click();
     },
     toggleEngage() {
-      if (this.slatCount > 1) {
+      if (this.draggable && this.slatCount > 1) {
         if (this.engaged) {
           this.disengage();
         } else {
@@ -278,7 +283,8 @@ export default {
     }
 
     &.apos-slat-list__item--disabled,
-    &.apos-is-only-child {
+    &.apos-is-only-child,
+    &.apos-is-not-draggable {
       &:hover,
       &:active {
         cursor: default;

package/modules/@apostrophecms/ui/ui/apos/components/AposSlatList.vue

@@ -26,6 +26,7 @@
               'apos-input--error': duplicate
             }"
             :disabled="disabled"
+            :draggable="draggable"
             :engaged="engaged === item._id"
             :parent="listId"
             :slat-count="next.length"
@@ -87,6 +88,10 @@ export default {
     duplicate: {
       type: String,
       default: null
+    },
+    draggable: {
+      type: Boolean,
+      default: true
     }
   },
   emits: [ 'item-clicked', 'select', 'update:modelValue' ],
@@ -104,7 +109,7 @@ export default {
     dragOptions() {
       return {
         animation: 0,
-        disabled: this.disabled || this.next.length <= 1,
+        disabled: !this.draggable || this.disabled || this.next.length <= 1,
         ghostClass: 'apos-is-dragging'
       };
     }

package/modules/@apostrophecms/ui/ui/apos/components/AposSubformPreview.vue

@@ -140,7 +140,7 @@ function inferFieldValues(schema, values, $t) {
     & {
       display: inline-block;
       line-height: 1;
-      color: var(--a-base-3);
+      color: var(--a-base-2);
     }
   }
 }

package/modules/@apostrophecms/ui/ui/apos/components/AposTreeHeader.vue

@@ -120,7 +120,7 @@ export default {
 @import '../scss/shared/_table-rows';
 
 .apos-tree__header {
-  color: var(--a-base-3);
+  color: var(--a-base-2);
 }
 
 .apos-tree__header.apos-tree__header--hidden {

package/modules/@apostrophecms/ui/ui/apos/scss/global/_inputs.scss

@@ -372,6 +372,8 @@
   @include type-base;
 
   & {
+    // Do not remove - it fixes unintended `sr-only` side effect.
+    position: relative;
     display: flex;
     align-items: center;
     color: var(--a-base-2);

package/modules/@apostrophecms/ui/ui/apos/scss/global/_theme.scss

@@ -3,6 +3,7 @@
   --a-danger: #eb443b;
   --a-danger-fade: #eb443b30;
   --a-success: #00bf9a;
+  --a-success-dark: #006650;
   --a-success-fade: #00bf9a30;
   --a-warning: #ffce00;
   --a-warning-dark: #a75c07;

package/modules/@apostrophecms/uploadfs/index.js

@@ -41,6 +41,9 @@ module.exports = {
         const uploadfsSettings = {};
         _.merge(uploadfsSettings, uploadfsDefaultSettings);
         _.merge(uploadfsSettings, options);
+        if (process.env.APOS_UPLOADFS_DISABLED_FILE_KEY) {
+          uploadfsSettings.disabledFileKey = process.env.APOS_UPLOADFS_DISABLED_FILE_KEY;
+        }
         if (process.env.APOS_S3_BUCKET) {
           _.merge(uploadfsSettings, {
             backend: 's3',

package/modules/@apostrophecms/util/index.js

@@ -35,6 +35,13 @@ const util = require('util');
 const { stripIndent } = require('common-tags');
 const glob = require('../../../lib/glob.js');
 
+// Dot-path segments that must never be traversed when walking a
+// user-supplied path in `apos.util.get` and `apos.util.set`. Following any
+// of these reaches the prototype chain and enables server-side prototype
+// pollution (CWE-1321), e.g. a PATCH `$pullAll` key of
+// `__proto__.publicApiProjection`.
+const unsafePathSegments = new Set([ '__proto__', 'constructor', 'prototype' ]);
+
 module.exports = {
   options: {
     alias: 'util',
@@ -724,7 +731,7 @@ module.exports = {
       },
       // Given a widget or doc, return the appropriate manager module. If the manager
       // cannot be determined for any reason, undefined is returned.
-      getManagerOf(object) {
+      getManagerOf(object, { log = true } = {}) {
         if (object.metaType === 'doc') {
           return self.apos.doc.getManager(object.type);
         } else if (object.metaType === 'widget') {
@@ -733,10 +740,10 @@ module.exports = {
           return self.apos.schema.getArrayManager(object.scopedArrayName);
         } else if (object.metaType === 'object') {
           return self.apos.schema.getObjectManager(object.scopedObjectName);
-        } else {
+        } else if (log) {
           self.apos.util.error(`Unsupported metaType in getManagerOf: ${object.metaType}`);
-          return undefined;
         }
+        return undefined;
       },
       // fetch the value at the given path from the object or
       // array `o`. `path` supports dot notation like MongoDB, and
@@ -755,6 +762,10 @@ module.exports = {
             if (o == null) {
               return undefined;
             }
+            if (unsafePathSegments.has(p)) {
+              // Never read through the prototype chain (CWE-1321)
+              return undefined;
+            }
             o = o[p];
           }
         }
@@ -819,6 +830,12 @@ module.exports = {
           }
         }
         path = path.split('.');
+        for (p of path) {
+          if (unsafePathSegments.has(p)) {
+            // Refuse to write through the prototype chain (CWE-1321)
+            throw self.apos.error('invalid', `Unsafe property name "${p}" in dot path`);
+          }
+        }
         for (i = 0; (i < (path.length - 1)); i++) {
           p = path[i];
           o = o[p];