@plone/volto 18.0.0-alpha.32 → 18.0.0-alpha.33

package/src/components/theme/View/View.jsx

@@ -237,7 +237,7 @@ class View extends Component {
       this.getViewByLayout() || this.getViewByType() || this.getViewDefault();
 
     return (
-      <div id="view">
+      <div id="view" tabIndex="-1">
         <ContentMetadataTags content={this.props.content} />
         {/* Body class if displayName in component is set */}
         <BodyClass

package/src/config/server.js

@@ -18,7 +18,6 @@ const settings = {
   ],
   criticalCssPath: 'public/critical.css',
   readCriticalCss: null, // so it will be defaultReadCriticalCss
-  extractScripts: { errorPages: false },
   staticFiles: [
     {
       id: 'root_static',

package/src/express-middleware/static.js

@@ -1,28 +1,46 @@
 import express from 'express';
 import path from 'path';
+import AddonConfigurationRegistry from '@plone/registry/src/addon-registry';
 import config from '@plone/volto/registry';
 
-const staticMiddlewareFn = express.static(
-  process.env.BUILD_DIR
-    ? path.join(process.env.BUILD_DIR, 'public')
-    : process.env.RAZZLE_PUBLIC_DIR,
-  {
-    setHeaders: function (res, path) {
-      const pathLib = require('path');
-      const base = pathLib.resolve(process.env.RAZZLE_PUBLIC_DIR);
-      const relpath = path.substr(base.length);
-      config.settings.serverConfig.staticFiles.some((elem) => {
-        if (relpath.match(elem.match)) {
-          for (const name in elem.headers) {
-            res.setHeader(name, elem.headers[name] || 'undefined');
-          }
-          return true;
+const projectRootPath = path.resolve('.');
+const registry = new AddonConfigurationRegistry(projectRootPath);
+
+const staticDirectory = () => {
+  if (process.env.BUILD_DIR) {
+    return path.join(process.env.BUILD_DIR, 'public');
+  }
+  // Only for development, when Volto detects that it's working on itself (not an
+  // old fashioned Volto project), there are add-ons (so it's the new setup) then
+  // point to the public folder in the root of the setup, instead of the inner Volto
+  // public folder.
+  if (
+    process.env.NODE_ENV !== 'production' &&
+    !registry.isVoltoProject &&
+    registry.addonNames.length > 0
+  ) {
+    return path.join(projectRootPath, '../../../public');
+  }
+  // Is always set (Razzle does it)
+  return process.env.RAZZLE_PUBLIC_DIR;
+};
+
+const staticMiddlewareFn = express.static(staticDirectory(), {
+  setHeaders: function (res, path) {
+    const pathLib = require('path');
+    const base = pathLib.resolve(process.env.RAZZLE_PUBLIC_DIR);
+    const relpath = path.substr(base.length);
+    config.settings.serverConfig.staticFiles.some((elem) => {
+      if (relpath.match(elem.match)) {
+        for (const name in elem.headers) {
+          res.setHeader(name, elem.headers[name] || 'undefined');
         }
-        return false;
-      });
-    },
+        return true;
+      }
+      return false;
+    });
   },
-);
+});
 
 export default function staticsMiddleware() {
   const middleware = express.Router();

package/src/helpers/Html/Html.jsx

@@ -187,14 +187,12 @@ class Html extends Component {
             charSet="UTF-8"
           />
           {/* Add the crossorigin while in development */}
-          {this.props.extractScripts !== false
-            ? extractor.getScriptElements().map((elem) =>
-                React.cloneElement(elem, {
-                  crossOrigin:
-                    process.env.NODE_ENV === 'production' ? undefined : 'true',
-                }),
-              )
-            : ''}
+          {extractor.getScriptElements().map((elem) =>
+            React.cloneElement(elem, {
+              crossOrigin:
+                process.env.NODE_ENV === 'production' ? undefined : 'true',
+            }),
+          )}
         </body>
       </html>
     );

package/src/helpers/Slots/index.tsx

@@ -1,12 +1,19 @@
-import type { Content } from '@plone/types';
 import { matchPath } from 'react-router-dom';
+import type { Content } from '@plone/types';
+import type { Location } from 'history';
 
 export function RouteCondition(path: string, exact?: boolean) {
-  return ({ pathname }: { pathname: string }) =>
-    Boolean(matchPath(pathname, { path, exact }));
+  return ({ location }: { location: Location }) =>
+    Boolean(matchPath(location.pathname, { path, exact }));
 }
 
 export function ContentTypeCondition(contentType: string[]) {
-  return ({ content }: { content: Content }) =>
-    contentType.includes(content?.['@type']);
+  return ({ content, location }: { content: Content; location: Location }) => {
+    return (
+      contentType.includes(content?.['@type']) ||
+      contentType.some((type) => {
+        return location.search.includes(`type=${encodeURIComponent(type)}`);
+      })
+    );
+  };
 }

package/src/server.jsx

@@ -272,50 +272,48 @@ server.get('/*', (req, res) => {
         });
       }
 
+      const sendHtmlResponse = (
+        res,
+        statusCode,
+        extractor,
+        markup,
+        store,
+        req,
+        config,
+      ) => {
+        res.status(statusCode).send(
+          `<!doctype html>
+        ${renderToString(
+          <Html
+            extractor={extractor}
+            markup={markup}
+            store={store}
+            criticalCss={readCriticalCss(req)}
+            apiPath={res.locals.detectedHost || config.settings.apiPath}
+            publicURL={res.locals.detectedHost || config.settings.publicURL}
+          />,
+        )}
+      `,
+        );
+      };
+
       if (context.url) {
         res.redirect(flattenToAppURL(context.url));
       } else if (context.error_code) {
         res.set({
           'Cache-Control': 'no-cache',
         });
-
-        res.status(context.error_code).send(
-          `<!doctype html>
-              ${renderToString(
-                <Html
-                  extractor={extractor}
-                  markup={markup}
-                  store={store}
-                  extractScripts={
-                    config.settings.serverConfig.extractScripts?.errorPages ||
-                    process.env.NODE_ENV !== 'production'
-                  }
-                  criticalCss={readCriticalCss(req)}
-                  apiPath={res.locals.detectedHost || config.settings.apiPath}
-                  publicURL={
-                    res.locals.detectedHost || config.settings.publicURL
-                  }
-                />,
-              )}
-            `,
+        sendHtmlResponse(
+          res,
+          context.error_code,
+          extractor,
+          markup,
+          store,
+          req,
+          config,
         );
       } else {
-        res.status(200).send(
-          `<!doctype html>
-              ${renderToString(
-                <Html
-                  extractor={extractor}
-                  markup={markup}
-                  store={store}
-                  criticalCss={readCriticalCss(req)}
-                  apiPath={res.locals.detectedHost || config.settings.apiPath}
-                  publicURL={
-                    res.locals.detectedHost || config.settings.publicURL
-                  }
-                />,
-              )}
-            `,
-        );
+        sendHtmlResponse(res, 200, extractor, markup, store, req, config);
       }
     }, errorHandler)
     .catch(errorHandler);

package/theme/themes/pastanaga/extras/objectbrowser-widget.less

@@ -41,3 +41,86 @@
     border: none !important;
   }
 }
+
+.object-browser {
+  .mode-switch {
+    margin-right: 8px;
+    cursor: pointer;
+    float: right;
+  }
+
+  header h2 {
+    margin: 2px 0 !important;
+  }
+
+  .searchResults {
+    margin-left: 20px;
+    font-size: 14px;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    line-height: 1.5;
+    text-rendering: optimizeLegibility;
+    text-size-adjust: 100%;
+  }
+
+  ul.object-listing {
+    padding: 0;
+  }
+
+  .image-wrapper {
+    display: block;
+    margin: 16px;
+    float: left;
+
+    img,
+    .icon-wrapper {
+      background-color: #edf1f2;
+      cursor: pointer;
+      outline: 0;
+    }
+
+    .selected {
+      outline: solid 3px #517776 !important;
+    }
+
+    img:hover,
+    .icon-wrapper:hover {
+      outline: solid 3px rgb(187, 198, 200);
+    }
+
+    .image-preview,
+    .image-preview:hover {
+      display: flex;
+      border: 0;
+      border-radius: 0;
+      box-shadow: none;
+
+      img {
+        width: 200px;
+        height: 200px;
+        object-fit: contain;
+      }
+    }
+
+    .image-preview,
+    .image-title {
+      cursor: pointer;
+      text-align: center;
+    }
+
+    .image-title {
+      margin-top: 5px;
+    }
+
+    .image-title-content {
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
+
+    .icon-wrapper {
+      display: flex;
+      padding: 46px;
+    }
+  }
+}

package/theme/themes/pastanaga/extras/widgets.less

@@ -153,3 +153,22 @@ body.babel-view .field.language-independent-field {
 .react-select__option {
   .word-break();
 }
+
+// makes sure event recurrence form buttons don't overflow when font is big
+.recurrence-form {
+  .byday-field {
+    .button {
+      flex-grow: 1;
+      padding-right: 0px;
+      padding-left: 0px;
+    }
+  }
+
+  .byyear-field {
+    .byyear-byday {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+    }
+  }
+}

package/types/components/manage/Sidebar/ObjectBrowserNav.d.ts

@@ -1,10 +1,11 @@
 export default ObjectBrowserNav;
-declare function ObjectBrowserNav({ currentSearchResults, selected, handleClickOnItem, handleDoubleClickOnItem, mode, navigateTo, isSelectable, }: {
+declare function ObjectBrowserNav({ currentSearchResults, selected, handleClickOnItem, handleDoubleClickOnItem, mode, view, navigateTo, isSelectable, }: {
     currentSearchResults: any;
     selected: any;
     handleClickOnItem: any;
     handleDoubleClickOnItem: any;
     mode: any;
+    view: any;
     navigateTo: any;
     isSelectable: any;
 }): import("react/jsx-runtime").JSX.Element;

package/types/components/manage/Widgets/IdWidget.d.ts

@@ -1,2 +1,54 @@
-declare const _default: any;
-export default _default;
+export default IdWidget;
+declare function IdWidget(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace IdWidget {
+    namespace propTypes {
+        let id: any;
+        let title: any;
+        let description: any;
+        let required: any;
+        let error: any;
+        let value: any;
+        let focus: any;
+        let onChange: any;
+        let onBlur: any;
+        let onClick: any;
+        let onEdit: any;
+        let onDelete: any;
+        let icon: any;
+        let iconAction: any;
+        let minLength: any;
+        let maxLength: any;
+        let wrapped: any;
+        let placeholder: any;
+    }
+    namespace defaultProps {
+        let description_1: any;
+        export { description_1 as description };
+        let required_1: boolean;
+        export { required_1 as required };
+        let error_1: any[];
+        export { error_1 as error };
+        let value_1: any;
+        export { value_1 as value };
+        export function onChange_1(): void;
+        export { onChange_1 as onChange };
+        export function onBlur_1(): void;
+        export { onBlur_1 as onBlur };
+        export function onClick_1(): void;
+        export { onClick_1 as onClick };
+        let onEdit_1: any;
+        export { onEdit_1 as onEdit };
+        let onDelete_1: any;
+        export { onDelete_1 as onDelete };
+        let focus_1: boolean;
+        export { focus_1 as focus };
+        let icon_1: any;
+        export { icon_1 as icon };
+        let iconAction_1: any;
+        export { iconAction_1 as iconAction };
+        let minLength_1: any;
+        export { minLength_1 as minLength };
+        let maxLength_1: any;
+        export { maxLength_1 as maxLength };
+    }
+}

package/types/components/manage/Widgets/TextWidget.d.ts

@@ -1,5 +1,54 @@
-declare const _default: React.FC<import("react-intl").WithIntlProps<any>> & {
-    WrappedComponent: React.ComponentType<any>;
-};
-export default _default;
-import React from 'react';
+export default TextWidget;
+declare function TextWidget(props: any): import("react/jsx-runtime").JSX.Element;
+declare namespace TextWidget {
+    namespace propTypes {
+        let id: any;
+        let title: any;
+        let description: any;
+        let required: any;
+        let error: any;
+        let value: any;
+        let focus: any;
+        let onChange: any;
+        let onBlur: any;
+        let onClick: any;
+        let onEdit: any;
+        let onDelete: any;
+        let icon: any;
+        let iconAction: any;
+        let minLength: any;
+        let maxLength: any;
+        let wrapped: any;
+        let placeholder: any;
+    }
+    namespace defaultProps {
+        let description_1: any;
+        export { description_1 as description };
+        let required_1: boolean;
+        export { required_1 as required };
+        let error_1: any[];
+        export { error_1 as error };
+        let value_1: any;
+        export { value_1 as value };
+        export function onChange_1(): void;
+        export { onChange_1 as onChange };
+        export function onBlur_1(): void;
+        export { onBlur_1 as onBlur };
+        export function onClick_1(): void;
+        export { onClick_1 as onClick };
+        let onEdit_1: any;
+        export { onEdit_1 as onEdit };
+        let onDelete_1: any;
+        export { onDelete_1 as onDelete };
+        let focus_1: boolean;
+        export { focus_1 as focus };
+        let icon_1: any;
+        export { icon_1 as icon };
+        let iconAction_1: any;
+        export { iconAction_1 as iconAction };
+        let minLength_1: any;
+        export { minLength_1 as minLength };
+        let maxLength_1: any;
+        export { maxLength_1 as maxLength };
+    }
+}

package/types/components/manage/Widgets/TextWidget.stories.d.ts

@@ -3,7 +3,19 @@ declare namespace _default {
     export let title: string;
     export { TextWidget as component };
     export let decorators: ((Story: any) => import("react/jsx-runtime").JSX.Element)[];
-    export let argTypes: {};
+    export namespace argTypes {
+        namespace description {
+            export let control: string;
+            let description_1: string;
+            export { description_1 as description };
+        }
+        namespace placeholder {
+            let control_1: string;
+            export { control_1 as control };
+            let description_2: string;
+            export { description_2 as description };
+        }
+    }
 }
 export default _default;
 import TextWidget from './TextWidget';

package/types/components/manage/Widgets/index.d.ts

@@ -4,7 +4,7 @@ export declare const ButtonsWidget: import("@loadable/component").LoadableCompon
 export declare const ArrayWidget: import("@loadable/component").LoadableClassComponent<any>;
 export declare const CheckboxWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
 export declare const FileWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
-export declare const IdWidget: import("@loadable/component").LoadableClassComponent<any>;
+export declare const IdWidget: import("@loadable/component").LoadableComponent<any>;
 export declare const PasswordWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
 export declare const QueryWidget: import("@loadable/component").LoadableClassComponent<any>;
 export declare const QuerySortOnWidget: import("@loadable/component").LoadableClassComponent<any>;
@@ -12,7 +12,7 @@ export declare const QuerystringWidget: import("@loadable/component").LoadableCo
 export declare const SchemaWidget: import("@loadable/component").LoadableClassComponent<any>;
 export declare const SelectWidget: import("@loadable/component").LoadableClassComponent<any>;
 export declare const TextareaWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
-export declare const TextWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
+export declare const TextWidget: import("@loadable/component").LoadableComponent<any>;
 export declare const TokenWidget: import("@loadable/component").LoadableClassComponent<any>;
 export declare const WysiwygWidget: import("@loadable/component").LoadableClassComponent<any>;
 export declare const UrlWidget: import("@loadable/component").LoadableClassComponent<{

package/types/config/Widgets.d.ts

@@ -96,7 +96,7 @@ export namespace widgetMapping {
         export { type_1 as type };
     }
 }
-export const defaultWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
+export const defaultWidget: import("@loadable/component").LoadableComponent<any>;
 import { SchemaWidget } from '@plone/volto/components/manage/Widgets';
 import { TokenWidget } from '@plone/volto/components/manage/Widgets';
 import { QuerystringWidget } from '@plone/volto/components/manage/Widgets';

package/types/config/server.d.ts

@@ -3,9 +3,6 @@ declare namespace settings {
     let expressMiddleware: any[];
     let criticalCssPath: string;
     let readCriticalCss: any;
-    namespace extractScripts {
-        let errorPages: boolean;
-    }
     let staticFiles: {
         id: string;
         match: RegExp;

package/types/helpers/Slots/index.d.ts

@@ -1,7 +1,9 @@
 import type { Content } from '@plone/types';
-export declare function RouteCondition(path: string, exact?: boolean): ({ pathname }: {
-    pathname: string;
+import type { Location } from 'history';
+export declare function RouteCondition(path: string, exact?: boolean): ({ location }: {
+    location: Location;
 }) => boolean;
-export declare function ContentTypeCondition(contentType: string[]): ({ content }: {
+export declare function ContentTypeCondition(contentType: string[]): ({ content, location }: {
     content: Content;
+    location: Location;
 }) => boolean;

package/types/start-client.d.ts

@@ -1,2 +1,2 @@
 export default function client(): void;
-export const history: any;
+export const history: import("history").History<unknown>;