scavold 0.4.0 → 0.5.0

package/CHANGELOG.md

@@ -9,6 +9,20 @@ one offered; a patch release does not.
 
 ## [Unreleased]
 
+## [0.5.0] — 2026-10-04
+
+### Added
+
+- A `group` container: content held together only to arrange it — an image with the
+  paragraph flowing around it, say — without claiming a meaning, rendered as a `<div>`.
+  It offers the same layouts as a section, for where no sectioning element fits.
+
+### Changed
+
+- The option of `details` that makes blocks close each other is called "Accordion" in
+  the editor ("Akkordeon" in German), so it is not mistaken for the new group. It is
+  still written `group=` in Markdown.
+
 ## [0.4.0] — 2026-10-04
 
 ### Added
@@ -36,6 +50,8 @@ one offered; a patch release does not.
 
 ## [0.3.0] — 2026-10-04
 
+Tagged, not published to npm; its changes reach sites with 0.4.0.
+
 ### Added
 
 - A `card` container: a unit of its own, such as an image, a heading and a few lines.
@@ -430,7 +446,8 @@ First published release. Version `0.1.0` existed in-tree only.
 - Only images are processed out of `media_folder`; other file types (video, documents)
   are never copied into the build output and have to live in the static folder.
 
-[Unreleased]: https://gitlab.com/cratly/scavold/-/compare/v0.4.0...main
+[Unreleased]: https://gitlab.com/cratly/scavold/-/compare/v0.5.0...main
+[0.5.0]: https://gitlab.com/cratly/scavold/-/compare/v0.4.0...v0.5.0
 [0.4.0]: https://gitlab.com/cratly/scavold/-/compare/v0.3.0...v0.4.0
 [0.3.0]: https://gitlab.com/cratly/scavold/-/compare/v0.2.1...v0.3.0
 [0.2.1]: https://gitlab.com/cratly/scavold/-/compare/v0.2.0...v0.2.1

package/COMPONENTS.md

@@ -134,6 +134,11 @@ component for each container name they declare in `.cratly.config.yaml`.
 
 See [`useContainer`](#usecontainer-props) for building custom container components.
 
+`:::group` is a built-in mapped to it: content held together only to arrange it, with no
+meaning of its own, rendered as `<div class="group">`. It offers the same
+[layout](#layout) as a section. Use it where no sectioning element fits — HTML keeps
+`<div>` for exactly that.
+
 ---
 
 ### `<ScavoldCover>`
@@ -991,8 +996,9 @@ async function enhanceApp( context ) {
 
 #### Layout
 
-`section`, `article` and `aside` take a `layout` arranging their first block — an image,
-usually — and the content after it. Left out, the block stands above the content.
+`section`, `article` and `aside`, and the generic `group`, take a `layout` arranging their
+first block — an image, usually — and the content after it. Left out, the block stands
+above the content.
 
 ```markdown
 ::: section layout=float-left

package/lib/containers.js

@@ -36,6 +36,8 @@ function defaultContainerMap() {
 	map.cover = "ScavoldCover";
 	map.details = "ScavoldDetails";
 	map.grid = "ScavoldGrid";
+	// Groups content for arranging it only, carrying no meaning of its own: a <div>.
+	map.group = "ScavoldContainer";
 	map.pagelist = "ScavoldPageList";
 
 	return map;

package/lib/sectionManifest.js

@@ -159,6 +159,19 @@ export const BUILTIN_SECTIONS = {
 		} ] ),
 	),
 
+	// Arranges content without claiming a meaning for it, which is what HTML keeps <div>
+	// for; ScavoldContainer renders it as one. Not the default type in the editor, so
+	// that choosing it stays a choice.
+	group: {
+		label: text( "Group", "Gruppe" ),
+		hint: text(
+			"Holds content together only to arrange it — an image with the paragraph flowing around it, say — without meaning of its own. Content with a topic of its own is a section; one that stands on its own, an article.",
+			"Fasst Inhalt nur zusammen, um ihn anzuordnen – etwa ein Bild mit dem Absatz, der es umfließt –, ohne eigene Bedeutung. Inhalt mit eigenem Thema ist ein Abschnitt, Inhalt, der für sich steht, ein Artikel.",
+		),
+		docs: docs( "group" ),
+		props: { layout: LAYOUT_PROP },
+	},
+
 	video: {
 		label: text( "Video", "Video" ),
 		hint: text( "Embedded video with playback controls.", "Eingebettetes Video mit Bedienelementen." ),
@@ -290,10 +303,10 @@ export const BUILTIN_SECTIONS = {
 			open: { type: "boolean", label: text( "Expanded at first", "Anfangs aufgeklappt" ) },
 			group: {
 				type: "text",
-				label: text( "Group", "Gruppe" ),
+				label: text( "Accordion", "Akkordeon" ),
 				hint: text(
-					"Blocks with the same group name close each other, so only one of them is expanded at a time.",
-					"Blöcke mit demselben Gruppennamen schließen einander, sodass immer nur einer aufgeklappt ist.",
+					"Details with the same accordion name close each other, so only one of them is expanded at a time.",
+					"Ausklappbare Blöcke mit demselben Akkordeon-Namen schließen einander, sodass immer nur einer aufgeklappt ist.",
 				),
 			},
 		},
@@ -302,8 +315,8 @@ export const BUILTIN_SECTIONS = {
 	grid: {
 		label: text( "Grid", "Raster" ),
 		hint: text(
-			"Puts the blocks written inside side by side in columns, starting a new row when a row is full — a paragraph, an image or an embedded section each fill one cell. On narrow screens the grid drops columns by itself.",
-			"Stellt die Blöcke darin in Spalten nebeneinander und beginnt eine neue Zeile, wenn eine voll ist – ein Absatz, ein Bild oder ein eingebetteter Abschnitt füllt je eine Zelle. Auf schmalen Bildschirmen werden es von selbst weniger Spalten.",
+			"Puts the blocks written inside side by side in columns, starting a new row when a row is full — a paragraph, an image or an embedded container each fill one cell. On narrow screens the grid drops columns by itself.",
+			"Stellt die Blöcke darin in Spalten nebeneinander und beginnt eine neue Zeile, wenn eine voll ist – ein Absatz, ein Bild oder ein eingebetteter Container füllt je eine Zelle. Auf schmalen Bildschirmen werden es von selbst weniger Spalten.",
 		),
 		docs: docs( "grid" ),
 		props: {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "scavold",
-	"version": "0.4.0",
+	"version": "0.5.0",
 	"type": "module",
 	"description": "VitePress theme framework — a scaffold for building custom VitePress themes with Vue at the core",
 	"keywords": [

package/scripts/check-fixture.js

@@ -249,6 +249,12 @@ expect( />Read more<\/a>/.test( containers ), "shows a translated text on a card
 expect( tags( containers, "section" ).some( t => /data-layout="float-left"/.test( t ) ) &&
 	tags( containers, "aside" ).some( t => /data-layout="split-right"/.test( t ) ),
 "marks a sectioning container with the layout asked for" );
+expect( tags( containers, "div" ).some( t => /class="group"/.test( t ) && /data-layout="float-right"/.test( t ) ),
+	"renders a group as a plain <div> carrying its layout" );
+expect( !/container ':::group' is not declared/.test( log ) &&
+	manifest.sections?.group?.props?.layout?.values?.length === 4 &&
+	manifest.sections?.details?.props?.group?.label?.de === "Akkordeon",
+"offers the group as a type of its own, and calls the details option an accordion" );
 const css = new Bun.Glob( "assets/**/*.css" ).scanSync( { cwd: DIST } ).map( f => readFileSync( join( DIST, f ), "utf-8" ) ).toArray().join( "\n" );
 expect( /\[data-layout=(["']?)split-left\1\]/.test( css ) && /@container/.test( css ),
 	"ships the stylesheet of the layout variants with the theme" );

package/styles/layouts.css

@@ -1,5 +1,5 @@
 /*
- * Layout variants of a section, article or aside — `::: section layout=float-left` —
+ * Layout variants of a section, article, aside or group — `::: group layout=float-left` —
  * arranging its first block, an image usually, and the content after it:
  *
  *   float-left / float-right   the content flows around the block and on below it