Skip to content

Commit 0c160fc

Browse files
rickbutterfieldrickbutterfield
committed
Add nested accordion for testing
1 parent 8981d74 commit 0c160fc

File tree

12 files changed

+408
-17
lines changed

12 files changed

+408
-17
lines changed

‎.github/README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
[![NuGet](https://img.shields.io/nuget/v/Umbraco.Community.BlockPreview.svg)](https://www.nuget.org/packages/Umbraco.Community.BlockPreview/)
44
[![GitHub](https://img.shields.io/github/license/rickbutterfield/BlockPreview)](https://github.com/rickbutterfield/BlockPreview/blob/develop/LICENSE)
55

6-
**BlockPreview** enables easy to use rich HTML backoffice previews for the Umbraco Block List and Block Grid editors.
6+
**BlockPreview** enables easy to use rich HTML backoffice previews for the Umbraco Block List and Block Grid editors, with full support for both Razor views and ViewComponents.
77

88
<img src="https://raw.githubusercontent.com/rickbutterfield/BlockPreview/develop/.github/assets/icon.png" alt="Umbraco.Community.BlockPreview icon" height="150" align="right">
99

@@ -139,13 +139,13 @@ builder.AddBlockPreview(options =>
139139

140140

141141
## Usage
142-
This package installs a custom Web Component preview for both the Block List and Block Grid editors in the backoffice. Block Grid and Block List can be configured independently (v14.2+).
142+
This package installs a custom Web Component preview for both the Block List and Block Grid editors in the backoffice. Block Grid and Block List can be configured independently. You can use both Razor partial views and ViewComponents for your block previews - ViewComponents are automatically detected and rendered when used.
143143

144144
Before and after of how components look within the Block Grid:
145145
![Screenshot2](https://raw.githubusercontent.com/rickbutterfield/BlockPreview/develop/.github/assets/screenshot2.png "Before and after of how components look within the Block Grid")
146146

147147
### Grid-specific setup
148-
When using the new Block Grid, replace the references below in your default Grid template partial views, and and custom views that render areas:
148+
When using the new Block Grid, replace the references below in your default Grid template partial views and custom views that render areas:
149149

150150
`/Views/Partials/blockgrid/default.cshtml`
151151
```diff

‎src/Umbraco.Cms.15.x/Umbraco.Cms.15.x.csproj

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@
2525

2626
<ItemGroup>
2727
<Folder Include="umbraco\" />
28+
<Folder Include="ViewComponents\" />
2829
</ItemGroup>
2930

3031
<PropertyGroup>

‎src/Umbraco.Cms.15.x/ViewComponents/HeroBlockViewComponent.cs

Lines changed: 0 additions & 14 deletions
This file was deleted.

‎src/Umbraco.Cms.15.x/Views/Partials/blockgrid/Components/accordion.cshtml

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
@inherits UmbracoViewPage<BlockGridItem<Accordion, BlockSettings>>
2+
3+
@if (Model.Content.AccordionItems == null || Model.Content.AccordionItems.Count == 0)
4+
{
5+
<p>No items</p>
6+
}
7+
else
8+
{
9+
<p>Items</p>
10+
}

‎src/Umbraco.Cms.15.x/uSync/v15/Content/accordion-test-page.config

Lines changed: 104 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,104 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<Content Key="70eff386-2ac2-42b1-b35e-768e93aae1f6" Alias="Accordion Test Page" Level="2">
3+
<Info>
4+
<Parent Key="6e2ff1f7-114e-484b-a407-918daded1aa6">Home</Parent>
5+
<Path>/Home/AccordionTestPage</Path>
6+
<Trashed>false</Trashed>
7+
<ContentType>blockGrid</ContentType>
8+
<CreateDate>2025-06-04T15:24:45</CreateDate>
9+
<NodeName Default="Accordion Test Page">
10+
<Name Culture="en-US">Accordion Test Page</Name>
11+
</NodeName>
12+
<SortOrder>5</SortOrder>
13+
<Published Default="false">
14+
<Published Culture="en-US">false</Published>
15+
</Published>
16+
<Schedule />
17+
<Template Key="09acf55b-fdd0-4cda-86fa-fa2caef695a9">BlockGrid</Template>
18+
</Info>
19+
<Properties>
20+
<content>
21+
<Value Culture="en-US"><![CDATA[{
22+
"contentData": [
23+
{
24+
"contentTypeKey": "4036a141-f838-4bca-b7b7-4e14e3dbf4f0",
25+
"key": "505b3939-d034-4704-9964-4fc774f55334",
26+
"udi": null,
27+
"values": [
28+
{
29+
"alias": "accordionItems",
30+
"culture": null,
31+
"editorAlias": null,
32+
"segment": null,
33+
"value": {
34+
"contentData": [
35+
{
36+
"contentTypeKey": "2206cd26-80fb-4a81-99b4-a27533ef6fd5",
37+
"key": "0b58680a-6ada-40b0-9d04-3574a8d0257a",
38+
"udi": null,
39+
"values": [
40+
{
41+
"alias": "title",
42+
"culture": null,
43+
"editorAlias": null,
44+
"segment": null,
45+
"value": "Item 1"
46+
}
47+
]
48+
}
49+
],
50+
"settingsData": [],
51+
"expose": [
52+
{
53+
"contentKey": "0b58680a-6ada-40b0-9d04-3574a8d0257a",
54+
"culture": null,
55+
"segment": null
56+
}
57+
],
58+
"Layout": {
59+
"Umbraco.BlockList": [
60+
{
61+
"contentKey": "0b58680a-6ada-40b0-9d04-3574a8d0257a",
62+
"contentUdi": null,
63+
"settingsKey": null,
64+
"settingsUdi": null
65+
}
66+
]
67+
}
68+
}
69+
}
70+
]
71+
}
72+
],
73+
"settingsData": [
74+
{
75+
"contentTypeKey": "cb6adf93-9c01-476c-970b-7469474db5b4",
76+
"key": "42be5e0a-463b-498f-b8b7-9124c8b77cf9",
77+
"udi": null,
78+
"values": []
79+
}
80+
],
81+
"expose": [
82+
{
83+
"contentKey": "505b3939-d034-4704-9964-4fc774f55334",
84+
"culture": null,
85+
"segment": null
86+
}
87+
],
88+
"Layout": {
89+
"Umbraco.BlockGrid": [
90+
{
91+
"areas": [],
92+
"columnSpan": 12,
93+
"contentKey": "505b3939-d034-4704-9964-4fc774f55334",
94+
"contentUdi": null,
95+
"rowSpan": 1,
96+
"settingsKey": "42be5e0a-463b-498f-b8b7-9124c8b77cf9",
97+
"settingsUdi": null
98+
}
99+
]
100+
}
101+
}]]></Value>
102+
</content>
103+
</Properties>
104+
</Content>

‎src/Umbraco.Cms.15.x/uSync/v15/ContentTypes/accordion.config

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<ContentType Key="4036a141-f838-4bca-b7b7-4e14e3dbf4f0" Alias="accordion" Level="2">
3+
<Info>
4+
<Name>Accordion</Name>
5+
<Icon>icon-bulleted-list color-black</Icon>
6+
<Thumbnail>folder.png</Thumbnail>
7+
<Description></Description>
8+
<AllowAtRoot>False</AllowAtRoot>
9+
<IsListView>False</IsListView>
10+
<Variations>Nothing</Variations>
11+
<IsElement>true</IsElement>
12+
<HistoryCleanup>
13+
<PreventCleanup>False</PreventCleanup>
14+
<KeepAllVersionsNewerThanDays></KeepAllVersionsNewerThanDays>
15+
<KeepLatestVersionPerDayForDays></KeepLatestVersionPerDayForDays>
16+
</HistoryCleanup>
17+
<Folder>Blocks</Folder>
18+
<Compositions />
19+
<DefaultTemplate></DefaultTemplate>
20+
<AllowedTemplates />
21+
</Info>
22+
<Structure />
23+
<GenericProperties>
24+
<GenericProperty>
25+
<Key>864204a3-0ac5-49d6-8a4f-8e6e643909b0</Key>
26+
<Name>Accordion Items</Name>
27+
<Alias>accordionItems</Alias>
28+
<Definition>5fb08651-4cd4-49d9-9dd0-6f637ec6363e</Definition>
29+
<Type>Umbraco.BlockList</Type>
30+
<Mandatory>true</Mandatory>
31+
<Validation></Validation>
32+
<Description><![CDATA[]]></Description>
33+
<SortOrder>0</SortOrder>
34+
<Tab Alias="content">Content</Tab>
35+
<Variations>Nothing</Variations>
36+
<MandatoryMessage></MandatoryMessage>
37+
<ValidationRegExpMessage></ValidationRegExpMessage>
38+
<LabelOnTop>false</LabelOnTop>
39+
</GenericProperty>
40+
</GenericProperties>
41+
<Tabs>
42+
<Tab>
43+
<Key>4c9ad398-61a1-457f-88fa-bba45f278c61</Key>
44+
<Caption>Content</Caption>
45+
<Alias>content</Alias>
46+
<Type>Tab</Type>
47+
<SortOrder>0</SortOrder>
48+
</Tab>
49+
</Tabs>
50+
</ContentType>

‎src/Umbraco.Cms.15.x/uSync/v15/ContentTypes/accordionitem.config

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<ContentType Key="2206cd26-80fb-4a81-99b4-a27533ef6fd5" Alias="accordionItem" Level="2">
3+
<Info>
4+
<Name>Accordion Item</Name>
5+
<Icon>icon-indent color-grey</Icon>
6+
<Thumbnail>folder.png</Thumbnail>
7+
<Description></Description>
8+
<AllowAtRoot>False</AllowAtRoot>
9+
<IsListView>False</IsListView>
10+
<Variations>Nothing</Variations>
11+
<IsElement>true</IsElement>
12+
<HistoryCleanup>
13+
<PreventCleanup>False</PreventCleanup>
14+
<KeepAllVersionsNewerThanDays></KeepAllVersionsNewerThanDays>
15+
<KeepLatestVersionPerDayForDays></KeepLatestVersionPerDayForDays>
16+
</HistoryCleanup>
17+
<Folder>Elements</Folder>
18+
<Compositions />
19+
<DefaultTemplate></DefaultTemplate>
20+
<AllowedTemplates />
21+
</Info>
22+
<Structure />
23+
<GenericProperties>
24+
<GenericProperty>
25+
<Key>bdbb6eec-79f4-4f0b-9159-a1738a764732</Key>
26+
<Name>Block Content</Name>
27+
<Alias>blockContent</Alias>
28+
<Definition>c3384287-a9ca-463c-a0b9-adfaa4ca679f</Definition>
29+
<Type>Umbraco.BlockGrid</Type>
30+
<Mandatory>false</Mandatory>
31+
<Validation></Validation>
32+
<Description><![CDATA[]]></Description>
33+
<SortOrder>1</SortOrder>
34+
<Tab Alias="content">Content</Tab>
35+
<Variations>Nothing</Variations>
36+
<MandatoryMessage></MandatoryMessage>
37+
<ValidationRegExpMessage></ValidationRegExpMessage>
38+
<LabelOnTop>false</LabelOnTop>
39+
</GenericProperty>
40+
<GenericProperty>
41+
<Key>bf2d61f0-78af-4a07-9a36-ea2f049d0275</Key>
42+
<Name>Title</Name>
43+
<Alias>title</Alias>
44+
<Definition>0cc0eba1-9960-42c9-bf9b-60e150b429ae</Definition>
45+
<Type>Umbraco.TextBox</Type>
46+
<Mandatory>true</Mandatory>
47+
<Validation></Validation>
48+
<Description><![CDATA[]]></Description>
49+
<SortOrder>0</SortOrder>
50+
<Tab Alias="content">Content</Tab>
51+
<Variations>Nothing</Variations>
52+
<MandatoryMessage></MandatoryMessage>
53+
<ValidationRegExpMessage></ValidationRegExpMessage>
54+
<LabelOnTop>false</LabelOnTop>
55+
</GenericProperty>
56+
</GenericProperties>
57+
<Tabs>
58+
<Tab>
59+
<Key>e1045bf2-dea2-474a-bb61-61c1f995cfeb</Key>
60+
<Caption>Content</Caption>
61+
<Alias>content</Alias>
62+
<Type>Tab</Type>
63+
<SortOrder>0</SortOrder>
64+
</Tab>
65+
</Tabs>
66+
</ContentType>

‎src/Umbraco.Cms.15.x/uSync/v15/DataTypes/AccordionBlockList.config

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<DataType Key="5fb08651-4cd4-49d9-9dd0-6f637ec6363e" Alias="Accordion Block List" Level="2">
3+
<Info>
4+
<Name>Accordion Block List</Name>
5+
<EditorAlias>Umbraco.BlockList</EditorAlias>
6+
<DatabaseType>Ntext</DatabaseType>
7+
<Folder>Block+Grid</Folder>
8+
</Info>
9+
<Config>
10+
<![CDATA[{
11+
"Blocks": [
12+
{
13+
"backgroundColor": null,
14+
"contentElementTypeKey": "2206cd26-80fb-4a81-99b4-a27533ef6fd5",
15+
"editorSize": "medium",
16+
"forceHideContentEditorInOverlay": false,
17+
"iconColor": null,
18+
"label": "{{title}}",
19+
"settingsElementTypeKey": null,
20+
"stylesheet": null,
21+
"thumbnail": null,
22+
"view": null
23+
}
24+
],
25+
"MaxPropertyWidth": null,
26+
"UseInlineEditingAsDefault": false,
27+
"UseLiveEditing": false,
28+
"UseSingleBlockMode": false,
29+
"ValidationLimit": {
30+
"max": null,
31+
"min": null
32+
}
33+
}]]>
34+
</Config>
35+
</DataType>

‎src/Umbraco.Cms.15.x/uSync/v15/DataTypes/BlockGridContent.config

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -314,6 +314,13 @@
314314
"stylesheet": "~/css/myblockgridlayout.css",
315315
"thumbnail": null,
316316
"view": "~/App_Plugins/Umbraco.Community.BlockPreview/views/block-preview.html"
317+
},
318+
{
319+
"contentElementTypeKey": "4036a141-f838-4bca-b7b7-4e14e3dbf4f0",
320+
"allowAtRoot": true,
321+
"allowInAreas": true,
322+
"groupKey": "f4348a1e-8970-4bed-ba97-47a0475f575a",
323+
"settingsElementTypeKey": "cb6adf93-9c01-476c-970b-7469474db5b4"
317324
}
318325
],
319326
"layoutStylesheet": "~/css/myblockgridlayout.css",

‎src/Umbraco.Cms.15.x/umbraco/models/Accordion.generated.cs

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
//------------------------------------------------------------------------------
2+
// <auto-generated>
3+
// This code was generated by a tool.
4+
//
5+
// Umbraco.ModelsBuilder.Embedded v15.4.0+15a8b40
6+
//
7+
// Changes to this file will be lost if the code is regenerated.
8+
// </auto-generated>
9+
//------------------------------------------------------------------------------
10+
11+
using System;
12+
using System.Linq.Expressions;
13+
using Umbraco.Cms.Core.Models.PublishedContent;
14+
using Umbraco.Cms.Core.PublishedCache;
15+
using Umbraco.Cms.Infrastructure.ModelsBuilder;
16+
using Umbraco.Cms.Core;
17+
using Umbraco.Extensions;
18+
19+
namespace Umbraco.Cms.Web.Common.PublishedModels
20+
{
21+
/// <summary>Accordion</summary>
22+
[PublishedModel("accordion")]
23+
public partial class Accordion : PublishedElementModel
24+
{
25+
// helpers
26+
#pragma warning disable 0109 // new is redundant
27+
[global::System.CodeDom.Compiler.GeneratedCodeAttribute("Umbraco.ModelsBuilder.Embedded", "15.4.0+15a8b40")]
28+
public new const string ModelTypeAlias = "accordion";
29+
[global::System.CodeDom.Compiler.GeneratedCodeAttribute("Umbraco.ModelsBuilder.Embedded", "15.4.0+15a8b40")]
30+
public new const PublishedItemType ModelItemType = PublishedItemType.Content;
31+
[global::System.CodeDom.Compiler.GeneratedCodeAttribute("Umbraco.ModelsBuilder.Embedded", "15.4.0+15a8b40")]
32+
[return: global::System.Diagnostics.CodeAnalysis.MaybeNull]
33+
public new static IPublishedContentType GetModelContentType(IPublishedContentTypeCache contentTypeCache)
34+
=> PublishedModelUtility.GetModelContentType(contentTypeCache, ModelItemType, ModelTypeAlias);
35+
[global::System.CodeDom.Compiler.GeneratedCodeAttribute("Umbraco.ModelsBuilder.Embedded", "15.4.0+15a8b40")]
36+
[return: global::System.Diagnostics.CodeAnalysis.MaybeNull]
37+
public static IPublishedPropertyType GetModelPropertyType<TValue>(IPublishedContentTypeCache contentTypeCache, Expression<Func<Accordion, TValue>> selector)
38+
=> PublishedModelUtility.GetModelPropertyType(GetModelContentType(contentTypeCache), selector);
39+
#pragma warning restore 0109
40+
41+
private IPublishedValueFallback _publishedValueFallback;
42+
43+
// ctor
44+
public Accordion(IPublishedElement content, IPublishedValueFallback publishedValueFallback)
45+
: base(content, publishedValueFallback)
46+
{
47+
_publishedValueFallback = publishedValueFallback;
48+
}
49+
50+
// properties
51+
52+
///<summary>
53+
/// Accordion Items
54+
///</summary>
55+
[global::System.CodeDom.Compiler.GeneratedCodeAttribute("Umbraco.ModelsBuilder.Embedded", "15.4.0+15a8b40")]
56+
[global::System.Diagnostics.CodeAnalysis.MaybeNull]
57+
[ImplementPropertyType("accordionItems")]
58+
public virtual global::Umbraco.Cms.Core.Models.Blocks.BlockListModel AccordionItems => this.Value<global::Umbraco.Cms.Core.Models.Blocks.BlockListModel>(_publishedValueFallback, "accordionItems");
59+
}
60+
}

0 commit comments

Comments
 (0)