Rough in separator

components/Block/Separator.vue

@@ -0,0 +1,3 @@
+<template>
+	<BaseDivider />
+</template>

components/PageBuilder.vue

@@ -30,10 +30,10 @@ const components: Record<BlockType, ReturnType<typeof resolveComponent>> = {
 	block_logocloud: resolveComponent('BlockLogoCloud'),
 	block_media_fullwidth: resolveComponent('BlockMediaFullWidth'),
 	block_pageheader: resolveComponent('BlockPageHeader'),
-	block_separator: 'div',
+	block_richtext: resolveComponent('BlockRichText'),
+	block_separator: resolveComponent('BlockSeparator'),
 	block_showcase: resolveComponent('BlockShowcase'),
 	block_testimonial_slider: resolveComponent('BlockTestimonialSlider'),
-	block_richtext: resolveComponent('BlockRichText'),
 };
 </script>
 

types/schema/blocks/block.ts

@@ -6,32 +6,35 @@ import type { BlockHeroRotator } from './block-hero-rotator.js';
 import type { BlockLogoCloud } from './block-logo-cloud.js';
 import type { BlockMediaFullWidth } from './block-media-full-width.js';
 import type { BlockPageHeader } from './block-page-header.js';
+import type { BlockSeparator } from './block-separator.js';
 import type { BlockShowcase } from './block-showcase.js';
 import type { BlockTestimonialSlider } from './block-testimonial-slider.js';
 
 export type BlockType =
+	| 'block_cardgroup'
+	| 'block_columns'
+	| 'block_featuregrid'
 	| 'block_hero_form'
 	| 'block_hero_headline'
 	| 'block_hero_rotator'
-	| 'block_media_fullwidth'
-	| 'block_separator'
 	| 'block_logocloud'
+	| 'block_media_fullwidth'
 	| 'block_pageheader'
-	| 'block_featuregrid'
-	| 'block_columns'
+	| 'block_richtext'
+	| 'block_separator'
+	| 'block_separator'
 	| 'block_showcase'
-	| 'block_cardgroup'
-	| 'block_testimonial_slider'
-	| 'block_richtext';
+	| 'block_testimonial_slider';
 
 export type Block =
 	| BlockColumns
-	| BlockPageHeader
-	| BlockLogoCloud
 	| BlockFeatureGrid
-	| BlockShowcase
-	| BlockMediaFullWidth
 	| BlockHeroForm
 	| BlockHeroHeadline
 	| BlockHeroRotator
+	| BlockLogoCloud
+	| BlockMediaFullWidth
+	| BlockPageHeader
+	| BlockSeparator
+	| BlockShowcase
 	| BlockTestimonialSlider;

types/schema/schema.ts

@@ -9,6 +9,7 @@ import type {
 	BlockMediaFullWidth,
 	BlockPageHeader,
 	BlockRichText,
+	BlockSeparator,
 	BlockShowcase,
 	BlockTestimonialSlider,
 } from './blocks/index.js';
@@ -54,6 +55,7 @@ export interface Schema {
 	block_media_fullwidth: BlockMediaFullWidth[];
 	block_pageheader: BlockPageHeader[];
 	block_richtext: BlockRichText[];
+	block_separator: BlockSeparator[];
 	block_showcase: BlockShowcase[];
 	block_testimonial_slider: BlockTestimonialSlider[];