Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make it possible to add Razor HTML content to the shape as a property #14867

Open
wants to merge 43 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 41 commits
Commits
Show all changes
43 commits
Select commit Hold shift + click to select a range
30475d2
Add Content property when it's not defined.
sarahelsaig Dec 8, 2023
299043c
Fix demo controller.
sarahelsaig Dec 8, 2023
f661706
Adding demo content.
sarahelsaig Dec 8, 2023
ec33f93
Document spacing.
sarahelsaig Dec 8, 2023
9a30f5c
Merge branch 'main' into shape-tag-helper-inner-content
sarahelsaig Jan 3, 2024
b18f2f8
Rename the shape property to HtmlContent from Content to avoid confli…
sarahelsaig Jan 3, 2024
81a7de8
cshtml formatting.
sarahelsaig Jan 3, 2024
3cb0f91
Fix cshtml mistake.
sarahelsaig Jan 3, 2024
9380261
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Jan 19, 2024
71f97cf
Replace bare HTML content with a <html-content> child tag helper.
sarahelsaig Jan 19, 2024
75fb190
Bug fix for html-content with embedded shape.
sarahelsaig Jan 19, 2024
ed31344
Demo multiple properties.
sarahelsaig Jan 19, 2024
22241d9
Add extension points to BaseShapeTagHelper for more behavior control …
sarahelsaig Jan 19, 2024
65653e9
Spacing and spelling.
sarahelsaig Jan 19, 2024
f8bc3d2
Remove duplicate GetChildContentAsync call.
sarahelsaig Jan 19, 2024
1731a60
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Feb 10, 2024
5e8e5ca
Remove extension points.
sarahelsaig Feb 10, 2024
3db27d5
Adjust HtmlContentTagHelper to be more similar to other shape child t…
sarahelsaig Feb 11, 2024
25c6805
Remove comment.
sarahelsaig Feb 11, 2024
9d43867
Rename to add-property.
sarahelsaig Feb 11, 2024
4ac5a17
Add optional value attribute to add-property.
sarahelsaig Feb 11, 2024
35f6e20
rename file and class to AddPropertyTagHelper
sarahelsaig Feb 11, 2024
8798a68
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Feb 11, 2024
9a6ee64
Merge branch 'shape-tag-helper-inner-content' of https://github.com/s…
sarahelsaig Feb 11, 2024
c8b383c
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Feb 11, 2024
3395057
Update documentation.
sarahelsaig Feb 11, 2024
fd29e62
wording
sarahelsaig Feb 11, 2024
1b40522
Use prop- in explanation.
sarahelsaig Feb 11, 2024
eb4ebbd
Merge branch 'main' into shape-tag-helper-inner-content
Piedone Apr 21, 2024
e3840cf
Update src/docs/reference/core/Placement/README.md
sarahelsaig Jun 17, 2024
d5da5fb
Update src/docs/reference/core/Placement/README.md
sarahelsaig Jun 17, 2024
84f6389
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Jun 17, 2024
12afe10
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Jun 17, 2024
2817473
Reference in change log.
sarahelsaig Jun 17, 2024
f3a1d01
Move demo code to separate action.
sarahelsaig Jun 17, 2024
8d6b12d
fix spacing
sarahelsaig Jun 17, 2024
499b08a
Update src/docs/releases/2.0.0.md
sarahelsaig Jun 17, 2024
4d06f62
Update src/OrchardCore.Modules/OrchardCore.Demo/Views/EmbedContentInS…
sarahelsaig Jun 17, 2024
f223a9e
Update src/docs/reference/core/Placement/README.md
sarahelsaig Jun 17, 2024
331c8f6
Update src/OrchardCore/OrchardCore.DisplayManagement/TagHelpers/AddPr…
sarahelsaig Jun 17, 2024
52a7cdc
Merge remote-tracking branch 'upstream/main' into shape-tag-helper-in…
sarahelsaig Jun 17, 2024
eb28a0f
Update src/docs/releases/2.0.0.md
sarahelsaig Jun 17, 2024
9193498
Merge branch 'main' into shape-tag-helper-inner-content
hishamco Jun 17, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -104,13 +104,13 @@ public async Task<ActionResult> DisplayShape(string contentItemId)
return NotFound();
}

var shape = Shape
.Foo()
.Line(contentItem.As<TestContentPartA>().Line);
var shape = await Shape.Foo(Line: contentItem.As<TestContentPartA>().Line);

return View(shape);
}

public IActionResult AddProperty() => View();

public ActionResult Raw()
{
return View();
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
@using Microsoft.AspNetCore.Html

<div class="border">
<p>The content is inserted below this line.</p>
<p>@Model.HtmlContent</p>
<p>The content is inserted above this line.</p>

@if (Model.SomeProperty != null)
{
<p>And here is another property: @Model.SomeProperty.</p>
}

@if (Model.OtherContent is IHtmlContent otherContent)
{
<div class="border">
<p>Another property called "OtherContent" starts here.</p>
<p>@otherContent</p>
<p>Another property called "OtherContent" ends here.</p>
</div>
}
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
@using Microsoft.AspNetCore.Html

<shape type="EmbedContentInShape">
<add-property name="HtmlContent">
The inner HTML of the <code>&lt;add-property name="propertyName"&gt;</code> tag helper (which is a direct child
of the <code>&lt;shape&gt;</code> tag helper) is converted into HTML and then passed to the shape as a model
property. The property's name is the string passed into the <code>name</code> attribute.
<shape type="TestContentPartA" Line="Sample Data" Creating="Now" Processing="Later"/>
Even other shapes can be included!
</add-property>
<add-property name="OtherContent">
You can have multiple, they are just <code>@nameof(IHtmlContent)</code> type shape properties.
</add-property>
<add-property name="SomeProperty" value="Some value passed to the attribute." />
</shape>

<shape type="EmbedContentInShape" HtmlContent="This property is ignored.">
<add-property name="HtmlContent">
If a <code>&lt;add-property&gt;</code> tag helper exists, it takes precedence over any matching attribute of the
<code>&lt;shape&gt;</code> tag helper. This is because child tag helpers are evaluated after the shape is
created, right before it's displayed.
</add-property>
</shape>
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
using Microsoft.AspNetCore.Html;
using Microsoft.AspNetCore.Razor.TagHelpers;
using System.Threading.Tasks;

namespace OrchardCore.DisplayManagement.TagHelpers;

[HtmlTargetElement("add-property", Attributes = "name", TagStructure = TagStructure.NormalOrSelfClosing)]
hishamco marked this conversation as resolved.
Show resolved Hide resolved
public class AddPropertyTagHelper : TagHelper
{
[HtmlAttributeName("name")]
public string Name { get; set; }

public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
{
if (string.IsNullOrWhiteSpace(Name))
{
return;
}

var content = await output.GetChildContentAsync(useCachedResult: false);
var shape = (IShape)context.Items[typeof(IShape)];
shape.Properties[Name.Trim()] = output.Attributes.ContainsName("value")
? output.Attributes["value"].Value
: new HtmlString(content.GetContent());

output.SuppressOutput();
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ public override async Task ProcessAsync(TagHelperContext tagHelperContext, TagHe
shape.Metadata.Wrappers.Add(Convert.ToString(output.Attributes["wrapper"].Value));
}

tagHelperContext.Items.Add(typeof(IShape), shape);
tagHelperContext.Items[typeof(IShape)] = shape;
ns8482e marked this conversation as resolved.
Show resolved Hide resolved

if (!string.IsNullOrWhiteSpace(Cache))
{
Expand Down
20 changes: 20 additions & 0 deletions src/docs/reference/core/Placement/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -175,6 +175,26 @@ Metadata tag helper example:
</menu>
```

#### Adding properties with additional tag helpers
Piedone marked this conversation as resolved.
Show resolved Hide resolved

Properties can be passed to a shape by adding attributes to the shape tag helper, as mentioned above. But you can also use the `<add-property>` tag helper inside `<shape>`. This even lets you pass Razor code as properties with the `IHtmlContent` value, if you omit the `value` attribute. Something that can't be easily done otherwise.

```xml
<shape type="MyShape">
<add-property name="foo" value="1" />
<add-property name="bar" value="a" />
<add-property name="content">
<h2>Some complicated HTML</h2>
<div>
You can even include shapes:
<shape type="AnotherShape" prop-count="10" />
</div>
</add-property>
</shape>
```

This is the same as `<shape type="MyShape" pro-foo="1" prop-bar="a" prop-content="@someHtmlContentVariable" />` where you'd have to construct `someHtmlContentVariable` separately. Of course, you can mix and match the different formats, for example, to only use `<add-property>` when you want to pass HTML content as property.

### Date Time shapes

#### `DateTime`
Expand Down
6 changes: 5 additions & 1 deletion src/docs/releases/2.0.0.md
Original file line number Diff line number Diff line change
Expand Up @@ -593,4 +593,8 @@ A new filter named `supported_cultures` was added to allow you to get a list of

### Sealing Types

Many configuration classes commonly used by modules can be `sealed`, which improves runtime performance. We've implemented this enhancement in [this pull request](https://github.com/OrchardCMS/OrchardCore/pull/16253) and [this one](https://github.com/OrchardCMS/OrchardCore/pull/16238). While it's not mandatory, we recommend that you consider applying this improvement to your own extensions as well.
Many configuration classes commonly used by modules can be `sealed`, which improves runtime performance. We've implemented this enhancement in [this pull request](https://github.com/OrchardCMS/OrchardCore/pull/16253) and [this one](https://github.com/OrchardCMS/OrchardCore/pull/16238). While it's not mandatory, we recommend that you consider applying this improvement to your own extensions as well.
sarahelsaig marked this conversation as resolved.
Show resolved Hide resolved

### Adding properties with additional tag helpers

The new `<add-property>` tag helper can be placed inside the `<shape>` tag helpers to add properties to the shape. This is similar to `prop-*` attributes, but you can also include Razor code as the `IHtmlContent` property value, which was impossible before. See more details [here](../reference/core/Placement/README.md#adding-properties-with-additional-tag-helpers).