@kitconcept/volto-light-theme 7.0.0-beta.4 → 7.0.0-beta.6

package/.changelog.draft

@@ -1,7 +1,7 @@
-## 7.0.0-beta.4 (2025-09-16)
+## 7.0.0-beta.6 (2025-09-22)
 
-### Internal
+### Bugfix
 
-- Re-release a3 due to a release process problem. @sneridagh 
+- Fix styles for H3 headings in slate grids. @danalvrz 
 
 

package/CHANGELOG.md

@@ -8,6 +8,26 @@
 
 <!-- towncrier release notes start -->
 
+## 7.0.0-beta.6 (2025-09-22)
+
+### Bugfix
+
+- Fix styles for H3 headings in slate grids. @danalvrz 
+
+## 7.0.0-beta.5 (2025-09-18)
+
+### Feature
+
+- Add Refresh Content button for slider block and cypress test for the same @Tishasoumya-02 
+
+### Bugfix
+
+- Fix slider button - Improve button mixing for RAC buttons. @sneridagh [#663](https://github.com/kitconcept/volto-light-theme/pull/663)
+
+### Internal
+
+- Fix A11y headlines Unique headings in example content @iRohitSingh [#661](https://github.com/kitconcept/volto-light-theme/pull/661)
+
 ## 7.0.0-beta.4 (2025-09-16)
 
 ### Internal

package/locales/de/LC_MESSAGES/volto.po

@@ -285,6 +285,11 @@ msgstr "Bild"
 msgid "Invalid Block"
 msgstr ""
 
+#. Default: "Invalid Slider source"
+#: components/Blocks/Slider/Data
+msgid "Invalid Slider source"
+msgstr ""
+
 #. Default: "Item"
 #: components/Widgets/schema/iconLinkListSchema
 msgid "Item"
@@ -468,6 +473,11 @@ msgstr "Presse"
 msgid "Previous Page"
 msgstr "Vorherige Seite"
 
+#. Default: "Refresh source content"
+#: components/Blocks/Slider/Data
+msgid "Refresh source content"
+msgstr ""
+
 #. Default: "Register"
 #: components/Anontools/Anontools
 msgid "Register"
@@ -479,6 +489,11 @@ msgstr "Registrieren"
 msgid "Remove item"
 msgstr ""
 
+#. Default: "Reset the block"
+#: components/Blocks/Slider/Data
+msgid "Reset the block"
+msgstr ""
+
 #. Default: "Result"
 #: components/Blocks/Listing/ListingBody
 msgid "Result"

package/locales/en/LC_MESSAGES/volto.po

@@ -280,6 +280,11 @@ msgstr ""
 msgid "Invalid Block"
 msgstr ""
 
+#. Default: "Invalid Slider source"
+#: components/Blocks/Slider/Data
+msgid "Invalid Slider source"
+msgstr ""
+
 #. Default: "Item"
 #: components/Widgets/schema/iconLinkListSchema
 msgid "Item"
@@ -463,6 +468,11 @@ msgstr ""
 msgid "Previous Page"
 msgstr ""
 
+#. Default: "Refresh source content"
+#: components/Blocks/Slider/Data
+msgid "Refresh source content"
+msgstr ""
+
 #. Default: "Register"
 #: components/Anontools/Anontools
 msgid "Register"
@@ -474,6 +484,11 @@ msgstr ""
 msgid "Remove item"
 msgstr ""
 
+#. Default: "Reset the block"
+#: components/Blocks/Slider/Data
+msgid "Reset the block"
+msgstr ""
+
 #. Default: "Result"
 #: components/Blocks/Listing/ListingBody
 msgid "Result"

package/locales/es/LC_MESSAGES/volto.po

@@ -287,6 +287,11 @@ msgstr "Imagen"
 msgid "Invalid Block"
 msgstr ""
 
+#. Default: "Invalid Slider source"
+#: components/Blocks/Slider/Data
+msgid "Invalid Slider source"
+msgstr ""
+
 #. Default: "Item"
 #: components/Widgets/schema/iconLinkListSchema
 msgid "Item"
@@ -470,6 +475,11 @@ msgstr "Pulsar"
 msgid "Previous Page"
 msgstr "Página anterior"
 
+#. Default: "Refresh source content"
+#: components/Blocks/Slider/Data
+msgid "Refresh source content"
+msgstr ""
+
 #. Default: "Register"
 #: components/Anontools/Anontools
 msgid "Register"
@@ -481,6 +491,11 @@ msgstr "Registrar usuario"
 msgid "Remove item"
 msgstr "Eliminar elemento"
 
+#. Default: "Reset the block"
+#: components/Blocks/Slider/Data
+msgid "Reset the block"
+msgstr ""
+
 #. Default: "Result"
 #: components/Blocks/Listing/ListingBody
 msgid "Result"

package/locales/eu/LC_MESSAGES/volto.po

@@ -286,6 +286,11 @@ msgstr "Irudia"
 msgid "Invalid Block"
 msgstr ""
 
+#. Default: "Invalid Slider source"
+#: components/Blocks/Slider/Data
+msgid "Invalid Slider source"
+msgstr ""
+
 #. Default: "Item"
 #: components/Widgets/schema/iconLinkListSchema
 msgid "Item"
@@ -469,6 +474,11 @@ msgstr "Sakatu"
 msgid "Previous Page"
 msgstr "Aurreko orria"
 
+#. Default: "Refresh source content"
+#: components/Blocks/Slider/Data
+msgid "Refresh source content"
+msgstr ""
+
 #. Default: "Register"
 #: components/Anontools/Anontools
 msgid "Register"
@@ -480,6 +490,11 @@ msgstr "Eman izena"
 msgid "Remove item"
 msgstr ""
 
+#. Default: "Reset the block"
+#: components/Blocks/Slider/Data
+msgid "Reset the block"
+msgstr ""
+
 #. Default: "Result"
 #: components/Blocks/Listing/ListingBody
 msgid "Result"

package/locales/pt_BR/LC_MESSAGES/volto.po

@@ -280,6 +280,11 @@ msgstr "Imagem"
 msgid "Invalid Block"
 msgstr "Bloco inválido"
 
+#. Default: "Invalid Slider source"
+#: components/Blocks/Slider/Data
+msgid "Invalid Slider source"
+msgstr ""
+
 #. Default: "Item"
 #: components/Widgets/schema/iconLinkListSchema
 msgid "Item"
@@ -463,6 +468,11 @@ msgstr "Imprensa"
 msgid "Previous Page"
 msgstr "Página anterior"
 
+#. Default: "Refresh source content"
+#: components/Blocks/Slider/Data
+msgid "Refresh source content"
+msgstr ""
+
 #. Default: "Register"
 #: components/Anontools/Anontools
 msgid "Register"
@@ -474,6 +484,11 @@ msgstr "Criar conta"
 msgid "Remove item"
 msgstr "Remover item"
 
+#. Default: "Reset the block"
+#: components/Blocks/Slider/Data
+msgid "Reset the block"
+msgstr ""
+
 #. Default: "Result"
 #: components/Blocks/Listing/ListingBody
 msgid "Result"

package/locales/volto.pot

@@ -282,6 +282,11 @@ msgstr ""
 msgid "Invalid Block"
 msgstr ""
 
+#. Default: "Invalid Slider source"
+#: components/Blocks/Slider/Data
+msgid "Invalid Slider source"
+msgstr ""
+
 #. Default: "Item"
 #: components/Widgets/schema/iconLinkListSchema
 msgid "Item"
@@ -465,6 +470,11 @@ msgstr ""
 msgid "Previous Page"
 msgstr ""
 
+#. Default: "Refresh source content"
+#: components/Blocks/Slider/Data
+msgid "Refresh source content"
+msgstr ""
+
 #. Default: "Register"
 #: components/Anontools/Anontools
 msgid "Register"
@@ -476,6 +486,11 @@ msgstr ""
 msgid "Remove item"
 msgstr ""
 
+#. Default: "Reset the block"
+#: components/Blocks/Slider/Data
+msgid "Reset the block"
+msgstr ""
+
 #. Default: "Result"
 #: components/Blocks/Listing/ListingBody
 msgid "Result"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kitconcept/volto-light-theme",
-  "version": "7.0.0-beta.4",
+  "version": "7.0.0-beta.6",
   "description": "Volto Light Theme by kitconcept",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/components/Blocks/Slider/Data.jsx

@@ -0,0 +1,147 @@
+import { useIntl, defineMessages } from 'react-intl';
+import { useDispatch } from 'react-redux';
+import { BlockDataForm } from '@plone/volto/components/manage/Form';
+import { SliderSchema } from '@kitconcept/volto-slider-block/components/schema';
+import { toast } from 'react-toastify';
+import Icon from '@plone/volto/components/theme/Icon/Icon';
+import Toast from '@plone/volto/components/manage/Toast/Toast';
+import { getContent } from '@plone/volto/actions/content/content';
+import isEmpty from 'lodash/isEmpty';
+import { flattenToAppURL } from '@plone/volto/helpers/Url/Url';
+import { Button } from 'semantic-ui-react';
+import reloadSVG from '@plone/volto/icons/reload.svg';
+import { messages as defaultMessages } from '@plone/volto/helpers/MessageLabels/MessageLabels';
+import cloneDeep from 'lodash/cloneDeep';
+
+const messages = defineMessages({
+  resetSlider: {
+    id: 'Reset the block',
+    defaultMessage: 'Reset the block',
+  },
+  refreshSlider: {
+    id: 'Refresh source content',
+    defaultMessage: 'Refresh source content',
+  },
+  invalidSlider: {
+    id: 'Invalid Slider source',
+    defaultMessage: 'Invalid Slider source',
+  },
+});
+
+const SliderData = (props) => {
+  const {
+    block,
+    blocksConfig,
+    data,
+    onChangeBlock,
+    navRoot,
+    contentType,
+    activeObject,
+  } = props;
+  const dispatch = useDispatch();
+  const intl = useIntl();
+  const schema = SliderSchema({ ...props, intl });
+
+  const dataTransformer = (resp, data, activeObject) => {
+    let hrefData = {
+      '@id': flattenToAppURL(resp['@id']),
+      '@type': resp?.['@type'],
+      Description: resp?.description,
+      Title: resp.title,
+      hasPreviewImage: resp?.preview_image ? true : false,
+      head_title: resp.head_title ?? null,
+      image_field: resp?.preview_image
+        ? 'preview_image'
+        : resp?.image
+          ? 'image'
+          : null,
+      image_scales: {
+        preview_image: [resp?.preview_image],
+        image: [resp?.image],
+      },
+      title: resp.title,
+    };
+
+    const updatedSlides = cloneDeep(data.slides);
+
+    updatedSlides[activeObject] = {
+      '@id': data.slides[activeObject]['@id'],
+      description: resp?.description,
+      title: resp?.title,
+      flagAlign: data.slides[activeObject]?.flagAlign,
+      href: [hrefData],
+    };
+    return {
+      ...data,
+      slides: updatedSlides,
+    };
+  };
+
+  const refresh = () => {
+    if (data.slides[activeObject]?.href?.[0]?.['@id']) {
+      dispatch(
+        getContent(
+          flattenToAppURL(data.slides[activeObject].href[0]['@id']),
+          null,
+          `${block}-slider-${activeObject}`,
+        ),
+      )
+        .then((resp) => {
+          if (resp) {
+            let blockData = dataTransformer(resp, data, activeObject);
+            onChangeBlock(block, blockData);
+          }
+        })
+        .catch((e) => {
+          toast.error(
+            <Toast
+              error
+              title={props.intl.formatMessage(defaultMessages.error)}
+              content={props.intl.formatMessage(messages.invalidSlider)}
+            />,
+          );
+        });
+    }
+  };
+
+  const ActionButton = (
+    <Button.Group className="refresh slider">
+      <Button
+        aria-label={intl.formatMessage(messages.refreshSlider)}
+        type="button"
+        basic
+        onClick={() => refresh()}
+        disabled={isEmpty(data.slides)}
+      >
+        {intl.formatMessage(messages.refreshSlider)}
+        <Icon name={reloadSVG} size="20px" color="#00000099" />
+      </Button>
+    </Button.Group>
+  );
+
+  const dataAdapter = blocksConfig[data['@type']].dataAdapter;
+
+  return (
+    <BlockDataForm
+      schema={schema}
+      title={schema.title}
+      onChangeField={(id, value) => {
+        dataAdapter({
+          block,
+          data,
+          id,
+          onChangeBlock,
+          value,
+        });
+      }}
+      onChangeBlock={onChangeBlock}
+      formData={data}
+      block={block}
+      actionButton={ActionButton}
+      navRoot={navRoot}
+      contentType={contentType}
+    />
+  );
+};
+
+export default SliderData;

package/src/customizations/@kitconcept/volto-slider-block/components/Data.jsx

@@ -0,0 +1,11 @@
+/**
+ * OVERRIDE Data.jsx
+ * REASON: Add Refresh source content button.
+ * FILE: https://github.com/kitconcept/volto-slider-block/blob/74cb8f01394907ff7b765c74c4a43ceb793c1c95/packages/volto-slider-block/src/components/Data.jsx
+ * DATE: 2025-09-11
+ * DEVELOPER: @Tishasoumya-02
+ */
+
+import Data from '../../../../components/Blocks/Slider/Data';
+
+export default Data;

package/src/theme/_utils.scss

@@ -43,14 +43,30 @@
 }
 
 @mixin button-style {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
   padding: 7px 10px;
   border: 2px solid var(--quanta-sapphire);
   border-radius: 10px;
-  margin-bottom: 10px; // Covers long button texts
+  margin: 0;
+  // margin-bottom: 10px; // Covers long button texts
+  appearance: none;
   background-color: transparent;
   color: var(--quanta-sapphire);
   cursor: pointer;
   font-size: 16px;
-  line-height: 0;
+  gap: 4px;
+  // line-height: 0;
   opacity: 0.8;
+  outline: none;
+  text-align: center;
+  text-decoration: none;
+  vertical-align: middle;
+
+  // Remove once we are using upddated @plone/components
+  &.react-aria-Button .icon:not(:last-child) {
+    flex-shrink: 0;
+    margin-right: initial;
+  }
 }

package/src/theme/_widgets.scss

@@ -142,8 +142,9 @@ span.color-contrast-label {
   .field.inline {
     .add-item-button-wrapper {
       display: flex;
+      align-items: center;
       justify-content: flex-end;
-      padding: 0;
+      padding: 10px 0;
 
       button {
         @include button-style;
@@ -196,9 +197,9 @@ span.color-contrast-label {
 .block-config-json-editor.field.inline {
   .button-wrapper {
     display: flex;
-    min-height: 60px;
+    align-items: center;
     justify-content: flex-end;
-    padding: 0;
+    padding: 10px 0;
 
     button {
       @include button-style;

package/src/theme/blocks/_grid.scss

@@ -60,18 +60,18 @@
       height: 100%;
 
       .image-wrapper {
-        margin-bottom: 40px;
+        margin-bottom: $spacing-medium;
 
         img {
           position: relative;
         }
       }
       .content {
-        padding: 0 20px 20px 20px;
+        padding: 0 $spacing-small $spacing-small $spacing-small;
         @include body-text();
 
         .headline {
-          margin-bottom: 20px;
+          margin-bottom: $spacing-small;
           letter-spacing: 1px;
           text-transform: uppercase;
           @include headtitle1();
@@ -79,12 +79,12 @@
 
         h2 {
           padding: 0;
-          margin-bottom: 20px !important;
+          margin-bottom: $spacing-small !important;
           @include text-heading-h3();
         }
 
         p {
-          margin-bottom: 20px;
+          margin-bottom: $spacing-small;
         }
       }
     }
@@ -105,7 +105,7 @@
   }
 
   .slate:not(.inner) {
-    padding: 40px 20px 20px 20px;
+    padding: $spacing-medium $spacing-small $spacing-small $spacing-small;
     margin: 0;
     p {
       padding: 0;
@@ -137,7 +137,7 @@
       margin: 0;
 
       .title {
-        margin: 0 0 20px 0;
+        margin: 0 0 $spacing-small 0;
         color: $white !important;
         letter-spacing: 0;
         @include text-heading-h3();
@@ -190,7 +190,7 @@
       }
     }
     h2 {
-      margin-bottom: 40px !important;
+      margin-bottom: $spacing-medium !important;
     }
     &.previous--is--same--block-type.previous--has--same--backgroundColor:not(
         .has--headline
@@ -227,9 +227,9 @@
             }
           }
           .card-summary {
-            padding-top: 40px;
+            padding-top: $spacing-medium;
             h3 {
-              margin-bottom: 20px !important;
+              margin-bottom: $spacing-small !important;
             }
           }
         }
@@ -243,7 +243,7 @@
     .block.listing {
       .listing-item {
         &:last-child {
-          padding-bottom: 0px !important;
+          padding-bottom: 0 !important;
         }
       }
       .pagination-wrapper {
@@ -263,7 +263,7 @@
     .block.listing {
       .listing-item {
         &:last-child {
-          padding-bottom: 0px !important;
+          padding-bottom: 0 !important;
         }
       }
     }
@@ -295,15 +295,19 @@
   @media only screen and (min-width: $largest-mobile-screen) {
     .one {
       .block.teaser .teaser-item .content h2 {
-        margin-bottom: 40px !important;
+        margin-bottom: $spacing-medium !important;
         @include text-heading-h2();
       }
 
       .slate {
         h2 {
-          margin-bottom: 40px !important;
+          margin-bottom: $spacing-medium !important;
           @include text-heading-h2();
         }
+
+        h3 {
+          margin-bottom: $spacing-small !important;
+        }
       }
 
       .image {
@@ -320,7 +324,7 @@
       .teaser {
         .teaser-item .content {
           h2 {
-            margin-bottom: 20px !important;
+            margin-bottom: $spacing-small !important;
             @include text-heading-h3();
           }
         }
@@ -330,7 +334,7 @@
           .title {
             @include text-heading-h3();
             @include word-break();
-            margin: 0 0 20px 0;
+            margin: 0 0 $spacing-small 0;
           }
         }
         figure:after {
@@ -339,9 +343,14 @@
       }
       .slate {
         h2 {
-          margin-bottom: 20px !important;
+          margin-bottom: $spacing-small !important;
           @include text-heading-h3();
         }
+
+        h3 {
+          margin-bottom: $spacing-small !important;
+          @include text-heading-h4();
+        }
       }
     }
 
@@ -349,14 +358,14 @@
       .teaser {
         .teaser-item {
           .image-wrapper {
-            margin-bottom: 20px !important;
+            margin-bottom: $spacing-small !important;
           }
           .content {
             .headline {
               @include headtitle2();
             }
             h2 {
-              margin-bottom: 20px !important;
+              margin-bottom: $spacing-small !important;
               @include text-heading-h4();
             }
             p {
@@ -382,7 +391,12 @@
 
       .slate {
         h2 {
-          margin-bottom: 20px !important;
+          margin-bottom: $spacing-small !important;
+          @include text-heading-h3();
+        }
+
+        h3 {
+          margin-bottom: $spacing-small !important;
           @include text-heading-h4();
         }
 
@@ -390,7 +404,7 @@
           margin-bottom: 0;
         }
 
-        padding-top: 20px !important;
+        padding-top: $spacing-small !important;
       }
     }
   }
@@ -402,7 +416,7 @@
 }
 
 .block.gridBlock h2.title {
-  margin-bottom: 20px !important;
+  margin-bottom: $spacing-small !important;
 }
 
 // Watch out for the following rule, it is used to override the default

package/src/theme/blocks/_slider.scss

@@ -243,3 +243,18 @@ $sliderImagesAspectRatio: var(--slider-images-aspect-ratio, 16/9);
     }
   }
 }
+
+.ui.buttons.refresh.slider button {
+  display: flex;
+  align-items: center;
+  padding: 0.5833em 0.833em;
+  background-color: #e8e8e8 !important;
+  color: rgba(0, 0, 0, 0.6) !important;
+  font-size: 0.85714286rem;
+  font-weight: bold;
+
+  svg {
+    padding: 0 0 0 0.5em;
+    margin-right: 0;
+  }
+}