@plone/volto 18.0.0-alpha.46 → 18.0.0-alpha.48

package/src/helpers/Blocks/Blocks.test.js

@@ -24,6 +24,7 @@ import {
   findBlocks,
   findContainer,
   isBlockContainer,
+  findStyleByName,
 } from './Blocks';
 
 import config from '@plone/volto/registry';
@@ -1103,38 +1104,68 @@ describe('Blocks', () => {
   });
 
   describe('buildStyleObjectFromData', () => {
+    beforeEach(() => {
+      function blockThemesEnhancer(data) {
+        const blockConfig = config.blocks.blocksConfig[data['@type']];
+        const blockStyleDefinitions =
+          // We look up for the blockThemes in the block's data, then in the global config
+          // We keep data.colors for BBB, but data.themes should be used
+          blockConfig.themes ||
+          blockConfig.colors ||
+          config.blocks.themes ||
+          [];
+        return data.theme
+          ? findStyleByName(blockStyleDefinitions, data.theme)
+          : {};
+      }
+      config.registerUtility({
+        name: 'blockThemesEnhancer',
+        type: 'styleWrapperStyleObjectEnhancer',
+        method: blockThemesEnhancer,
+      });
+    });
+
     it('Understands style converter for style values, no styles found', () => {
-      const styles = {
-        color: 'red',
-        backgroundColor: '#FFF',
+      const data = {
+        '@type': 'text',
+        styles: {
+          color: 'red',
+          backgroundColor: '#FFF',
+        },
       };
-      expect(buildStyleObjectFromData(styles)).toEqual({});
+      expect(buildStyleObjectFromData(data)).toEqual({});
     });
 
     it('Understands style converter for style values', () => {
-      const styles = {
-        color: 'red',
-        '--background-color': '#FFF',
+      const data = {
+        '@type': 'text',
+        styles: {
+          color: 'red',
+          '--background-color': '#FFF',
+        },
       };
-      expect(buildStyleObjectFromData(styles)).toEqual({
+      expect(buildStyleObjectFromData(data)).toEqual({
         '--background-color': '#FFF',
       });
     });
 
     it('Supports multiple nested levels', () => {
-      const styles = {
-        '--color': 'red',
-        backgroundColor: '#AABBCC',
-        nested: {
-          l1: 'white',
-          '--foo': 'white',
-          level2: {
-            '--foo': '#fff',
-            bar: '#000',
+      const data = {
+        '@type': 'text',
+        styles: {
+          '--color': 'red',
+          backgroundColor: '#AABBCC',
+          nested: {
+            l1: 'white',
+            '--foo': 'white',
+            level2: {
+              '--foo': '#fff',
+              bar: '#000',
+            },
           },
         },
       };
-      expect(buildStyleObjectFromData(styles)).toEqual({
+      expect(buildStyleObjectFromData(data)).toEqual({
         '--color': 'red',
         '--nested--foo': 'white',
         '--nested--level2--foo': '#fff',
@@ -1142,22 +1173,168 @@ describe('Blocks', () => {
     });
 
     it('Supports multiple nested levels and optional inclusion of the name of the level', () => {
-      const styles = {
+      const data = {
+        '@type': 'text',
+        styles: {
+          '--color': 'red',
+          backgroundColor: '#AABBCC',
+          'nested:noprefix': {
+            l1: 'white',
+            '--foo': 'white',
+            level2: {
+              '--foo': '#fff',
+              bar: '#000',
+            },
+          },
+        },
+      };
+      expect(buildStyleObjectFromData(data)).toEqual({
         '--color': 'red',
-        backgroundColor: '#AABBCC',
-        'nested:noprefix': {
-          l1: 'white',
-          '--foo': 'white',
-          level2: {
-            '--foo': '#fff',
-            bar: '#000',
+        '--foo': 'white',
+        '--level2--foo': '#fff',
+      });
+    });
+
+    it('Supports named theme block - with global config', () => {
+      config.blocks.themes = [
+        {
+          style: {
+            '--primary-color': '#fff',
+            '--primary-foreground-color': '#ecebeb',
+          },
+          name: 'default',
+          label: 'Default',
+        },
+        {
+          style: {
+            '--primary-color': '#000',
+            '--primary-foreground-color': '#fff',
+          },
+          name: 'primary',
+          label: 'Primary',
+        },
+      ];
+      const data = {
+        '@type': 'text',
+        theme: 'primary',
+      };
+      expect(buildStyleObjectFromData(data)).toEqual({
+        '--primary-color': '#000',
+        '--primary-foreground-color': '#fff',
+      });
+    });
+
+    it('Supports named theme block - with local block themes config', () => {
+      config.blocks.themes = [
+        {
+          style: {
+            '--primary-color': '#fff',
+            '--primary-foreground-color': '#ecebeb',
+          },
+          name: 'default',
+          label: 'Default',
+        },
+        {
+          style: {
+            '--primary-color': '#000',
+            '--primary-foreground-color': '#fff',
+          },
+          name: 'primary',
+          label: 'Primary',
+        },
+      ];
+      const themes = [
+        {
+          style: {
+            '--primary-color': '#fff',
+            '--primary-foreground-color': '#ecebeb',
+          },
+          name: 'default',
+          label: 'Default',
+        },
+        {
+          style: {
+            '--secondary-color': '#bbb',
+            '--secondary-foreground-color': '#ddd',
           },
+          name: 'secondary',
+          label: 'Secondary',
         },
+      ];
+      config.blocks.blocksConfig.text.themes = themes;
+      const data = {
+        '@type': 'text',
+        theme: 'secondary',
       };
-      expect(buildStyleObjectFromData(styles)).toEqual({
+
+      expect(buildStyleObjectFromData(data)).toEqual({
+        '--secondary-color': '#bbb',
+        '--secondary-foreground-color': '#ddd',
+      });
+    });
+
+    it('All together now - named theme block - with local block themes config', () => {
+      config.blocks.blocksThemes = [
+        {
+          style: {
+            '--primary-color': '#fff',
+            '--primary-foreground-color': '#ecebeb',
+          },
+          name: 'default',
+          label: 'Default',
+        },
+        {
+          style: {
+            '--primary-color': '#000',
+            '--primary-foreground-color': '#fff',
+          },
+          name: 'primary',
+          label: 'Primary',
+        },
+      ];
+      const themes = [
+        {
+          style: {
+            '--primary-color': '#fff',
+            '--primary-foreground-color': '#ecebeb',
+          },
+          name: 'default',
+          label: 'Default',
+        },
+        {
+          style: {
+            '--secondary-color': '#bbb',
+            '--secondary-foreground-color': '#ddd',
+          },
+          name: 'secondary',
+          label: 'Secondary',
+        },
+      ];
+
+      const data = {
+        '@type': 'text',
+        styles: {
+          '--color': 'red',
+          backgroundColor: '#AABBCC',
+          'nested:noprefix': {
+            l1: 'white',
+            '--foo': 'white',
+            level2: {
+              '--foo': '#fff',
+              bar: '#000',
+            },
+          },
+        },
+        theme: 'secondary',
+        themes,
+      };
+
+      expect(buildStyleObjectFromData(data)).toEqual({
         '--color': 'red',
         '--foo': 'white',
         '--level2--foo': '#fff',
+        '--secondary-color': '#bbb',
+        '--secondary-foreground-color': '#ddd',
       });
     });
   });

package/src/middleware/api.js

@@ -186,6 +186,7 @@ const apiMiddlewareFactory =
                     checkUrl: settings.actions_raising_api_errors.includes(
                       action.type,
                     ),
+                    attach: item.attach,
                   },
                 ).then((reqres) => {
                   if (action.subrequest === 'batch-upload') {
@@ -205,6 +206,7 @@ const apiMiddlewareFactory =
                   checkUrl: settings.actions_raising_api_errors.includes(
                     action.type,
                   ),
+                  attach: item.attach,
                 }),
               ),
             )
@@ -214,6 +216,7 @@ const apiMiddlewareFactory =
             headers: request.headers,
             params: request.params,
             checkUrl: settings.actions_raising_api_errors.includes(action.type),
+            attach: request.attach,
           });
       actionPromise.then(
         (result) => {

package/src/reducers/content/content.js

@@ -20,6 +20,8 @@ import {
   UPDATE_UPLOADED_FILES,
 } from '@plone/volto/constants/ActionTypes';
 
+import config from '@plone/volto/registry';
+
 const initialState = {
   create: {
     loaded: false,
@@ -192,6 +194,16 @@ export default function content(state = initialState, action = {}) {
           };
         });
       }
+
+      const transforms = config.getUtilities({
+        type: 'transform',
+        dependencies: { reducer: 'content' },
+      });
+
+      transforms.forEach(({ method }) => {
+        method(result);
+      });
+
       return action.subrequest
         ? {
             ...state,

package/src/start-server.js

@@ -18,11 +18,8 @@ export default function server() {
 
   server
     .listen(port, bind_address, () => {
-      if (app.apiPath === app.publicURL || !app.apiPath) {
-        console.log(`Volto is running in SEAMLESS mode`);
-      } else {
-        console.log(`API server (API_PATH) is set to: ${app.apiPath}`);
-      }
+      console.log(`API server (API_PATH) is set to: ${app.apiPath}`);
+
       if (app.devProxyToApiPath)
         console.log(
           `Proxying API requests from ${app.publicURL}/++api++ to ${

package/types/actions/aliases/aliases.d.ts

@@ -5,7 +5,7 @@
  * @param {Object} options Options data.
  * @returns {Object} Get aliases action.
  */
-export function getAliases(url: string, options: any): any;
+export function getAliases(url: string, options?: any): any;
 /**
  * Add alias function.
  * @function addAliases
@@ -22,3 +22,10 @@ export function addAliases(url: string, data: any): any;
  * @returns {Object} Remove alias action.
  */
 export function removeAliases(url: string, data: any): any;
+/**
+ * Upload aliases function.
+ * @function uploadAliases
+ * @param {Object} file CSV file.
+ * @returns {Object} Upload aliases action.
+ */
+export function uploadAliases(file: any): any;

package/types/components/manage/Blocks/ToC/View.d.ts

@@ -4,8 +4,5 @@ export function getBlocksTocEntries(properties: any, tocData: any): {
     tocEntries: {};
     tocEntriesLayout: any[];
 };
-declare const _default: React.FC<import("react-intl").WithIntlProps<any>> & {
-    WrappedComponent: React.ComponentType<any>;
-};
+declare const _default: (props: any) => import("react/jsx-runtime").JSX.Element;
 export default _default;
-import React from 'react';

package/types/components/manage/Blocks/ToC/variations/DefaultTocRenderer.d.ts

@@ -1,5 +1,10 @@
-declare const _default: React.FC<import("react-intl").WithIntlProps<import("react-intl").WrappedComponentProps<string>>> & {
-    WrappedComponent: React.ComponentType<import("react-intl").WrappedComponentProps<string>>;
-};
-export default _default;
-import React from 'react';
+export default View;
+declare function View({ data, tocEntries }: {
+    data: any;
+    tocEntries: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace View {
+    namespace propTypes {
+        let properties: any;
+    }
+}

package/types/components/manage/Blocks/ToC/variations/HorizontalMenu.d.ts

@@ -1,5 +1,10 @@
-declare const _default: React.FC<import("react-intl").WithIntlProps<import("react-intl").WrappedComponentProps<string>>> & {
-    WrappedComponent: React.ComponentType<import("react-intl").WrappedComponentProps<string>>;
-};
-export default _default;
-import React from 'react';
+export default View;
+declare function View({ data, tocEntries }: {
+    data: any;
+    tocEntries: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace View {
+    namespace propTypes {
+        let properties: any;
+    }
+}

package/types/components/manage/Blocks/ToC/variations/index.d.ts

@@ -2,15 +2,27 @@ export default ToCVariations;
 declare const ToCVariations: ({
     id: string;
     title: string;
-    view: import("react").FC<import("react-intl").WithIntlProps<import("react-intl").WrappedComponentProps<string>>> & {
-        WrappedComponent: import("react").ComponentType<import("react-intl").WrappedComponentProps<string>>;
+    view: {
+        ({ data, tocEntries }: {
+            data: any;
+            tocEntries: any;
+        }): import("react/jsx-runtime").JSX.Element;
+        propTypes: {
+            properties: any;
+        };
     };
     isDefault: boolean;
 } | {
     id: string;
     title: string;
-    view: import("react").FC<import("react-intl").WithIntlProps<import("react-intl").WrappedComponentProps<string>>> & {
-        WrappedComponent: import("react").ComponentType<import("react-intl").WrappedComponentProps<string>>;
+    view: {
+        ({ data, tocEntries }: {
+            data: any;
+            tocEntries: any;
+        }): import("react/jsx-runtime").JSX.Element;
+        propTypes: {
+            properties: any;
+        };
     };
     isDefault?: undefined;
 })[];

package/types/components/manage/Contents/__mocks__/index.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="jest" />
 export declare const Contents: jest.Mock<import("react/jsx-runtime").JSX.Element, [], any>;
 export declare const ContentsRenameModal: jest.Mock<import("react/jsx-runtime").JSX.Element, [], any>;

package/types/components/manage/Controlpanels/Relations/RelationsMatrix.d.ts

@@ -36,7 +36,7 @@ declare const _default: {
         data: {};
         block: string;
     };
-    contextType?: React.Context<any>;
+    contextType?: React.Context<any> | undefined;
 };
 export default _default;
 import React from 'react';

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const Controlpanels: any;
 export declare const Controlpanel: import("@loadable/component").LoadableComponent<Omit<import("react-intl").WithIntlProps<import("react-intl").WrappedComponentProps<string>>, "ref"> & import("react").RefAttributes<import("react").ComponentType<import("react-intl").WrappedComponentProps<string>>>>;
 export declare const RulesControlpanel: import("@loadable/component").LoadableClassComponent<any>;

package/types/components/manage/Form/__mocks__/index.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="jest" />
 export declare const Field: jest.Mock<import("react/jsx-runtime").JSX.Element, [props: any], any>;
 export declare const InlineForm: jest.Mock<import("react/jsx-runtime").JSX.Element, [props: any], any>;
 export declare const ModalForm: jest.Mock<import("react/jsx-runtime").JSX.Element, [props: any], any>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const Field: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;
 export declare const InlineForm: import("@loadable/component").LoadableComponent<Omit<import("react-intl").WithIntlProps<any>, "ref"> & import("react").RefAttributes<any>>;
 export declare const ModalForm: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;

package/types/components/manage/Multilingual/ManageTranslations.d.ts

@@ -36,7 +36,7 @@ declare const _default: {
         data: {};
         block: string;
     };
-    contextType?: React.Context<any>;
+    contextType?: React.Context<any> | undefined;
 };
 export default _default;
 import React from 'react';

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

@@ -69,6 +69,6 @@ declare function withObjectBrowser(WrappedComponent: any): {
         data: {};
         block: string;
     };
-    contextType?: React.Context<any>;
+    contextType?: React.Context<any> | undefined;
 };
 import React from 'react';

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

@@ -74,7 +74,7 @@ declare const _default: {
         data: {};
         block: string;
     };
-    contextType?: React.Context<any>;
+    contextType?: React.Context<any> | undefined;
 };
 export default _default;
 import React from 'react';

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

@@ -74,7 +74,7 @@ declare const _default: {
         data: {};
         block: string;
     };
-    contextType?: React.Context<any>;
+    contextType?: React.Context<any> | undefined;
 };
 export default _default;
 import React from 'react';

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

@@ -1,4 +1,3 @@
-/// <reference types="jest" />
 export declare const AlignWidget: jest.Mock<import("react/jsx-runtime").JSX.Element, [], any>;
 export declare const ButtonsWidget: jest.Mock<import("react/jsx-runtime").JSX.Element, [], any>;
 export declare const ArrayWidget: jest.Mock<import("react/jsx-runtime").JSX.Element, [], any>;

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

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const AlignWidget: import("@loadable/component").LoadableComponent<any>;
 export declare const ButtonsWidget: import("@loadable/component").LoadableComponent<any>;
 export declare const ArrayWidget: import("@loadable/component").LoadableClassComponent<any>;
@@ -53,7 +52,7 @@ export declare const UrlWidget: import("@loadable/component").LoadableClassCompo
         data: {};
         block: string;
     };
-    contextType?: import("react").Context<any>;
+    contextType?: import("react").Context<any> | undefined;
 }>;
 export declare const InternalUrlWidget: import("@loadable/component").LoadableClassComponent<{
     new (): {
@@ -93,7 +92,7 @@ export declare const InternalUrlWidget: import("@loadable/component").LoadableCl
         data: {};
         block: string;
     };
-    contextType?: import("react").Context<any>;
+    contextType?: import("react").Context<any> | undefined;
 }>;
 export declare const EmailWidget: import("@loadable/component").LoadableComponent<any>;
 export declare const NumberWidget: import("@loadable/component").LoadableComponent<import("react-intl").WithIntlProps<any>>;

package/types/components/theme/RouteAnnouncer/RouteAnnouncer.d.ts

@@ -0,0 +1,2 @@
+export default RouteAnnouncer;
+declare function RouteAnnouncer(): import("react/jsx-runtime").JSX.Element;

package/types/config/slots.d.ts

@@ -7,7 +7,7 @@ declare namespace slots {
                 content: {
                     subjects?: any[];
                 };
-            }): JSX.Element;
+            }): JSX.Element | null;
             propTypes: {
                 content: any;
             };

package/types/constants/ActionTypes.d.ts

@@ -134,6 +134,7 @@ export const MOVE_CONTENT_RULE: "MOVE_CONTENT_RULE";
 export const GET_ALIASES: "GET_ALIASES";
 export const ADD_ALIASES: "ADD_ALIASES";
 export const REMOVE_ALIASES: "REMOVE_ALIASES";
+export const UPLOAD_ALIASES: "UPLOAD_ALIASES";
 export const GET_USERSCHEMA: "GET_USERSCHEMA";
 export const GET_UPGRADE: "GET_UPGRADE";
 export const POST_UPGRADE: "POST_UPGRADE";

package/types/helpers/Blocks/Blocks.d.ts

@@ -134,6 +134,15 @@ export function applySchemaDefaults({ data, schema, intl }: {
  * @return {Object} Derived data, with the defaults extracted from the schema
  */
 export function applyBlockDefaults({ data, intl, navRoot, contentType, ...rest }: any, blocksConfig: any): any;
+/**
+ * Find a matching style by name given a style definition
+ *
+ * @function findStyleByName
+ * @param {Object} styleDefinitions An object with the style definitions
+ * @param {string} name The name of the style to find
+ * @return {Object} The style object of the matching name
+ */
+export function findStyleByName(styleDefinitions: any, name: string): any;
 /**
  * Check if a block is a container block
  * check blocks from data as well since some add-ons use that
@@ -168,7 +177,7 @@ export function styleToClassName(key: any, value: any, prefix?: string): any;
 export function buildStyleClassNamesFromData(obj?: {}, prefix?: string): any;
 export function buildStyleClassNamesExtenders({ block, content, data, classNames, }: any): any[];
 export function styleDataToStyleObject(key: any, value: any, prefix?: string): any[];
-export function buildStyleObjectFromData(obj?: any, prefix?: string): any;
+export function buildStyleObjectFromData(data?: any, prefix?: string): any;
 export function getPreviousNextBlock({ content, block }: any): any[];
 export function getBlocksHierarchy(properties: any): any;
 export function findContainer(formData: object, { containerId }: {

package/types/helpers/Helmet/Helmet.d.ts

@@ -133,6 +133,6 @@ declare const HelmetExport: {
     peek: any;
     rewind: () => any;
     canUseDOM: any;
-    contextType?: React.Context<any>;
+    contextType?: React.Context<any> | undefined;
 };
 import React from 'react';