/
BulmaForm.cs
123 lines (103 loc) · 6.04 KB
/
BulmaForm.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
using System;
using System.Linq;
using DotVVM.AutoUI.Metadata;
using DotVVM.Framework.Binding;
using DotVVM.Framework.Controls;
using Validator = DotVVM.Framework.Controls.Validator;
namespace DotVVM.AutoUI.Controls
{
/// <summary> Renders a bulma table-like form: https://bulma.io/documentation/form/general/#horizontal-form </summary>
[ControlMarkupOptions(Precompile = ControlPrecompilationMode.InServerSideStyles)]
public class BulmaForm : AutoFormBase
{
public BulmaForm(IServiceProvider services) : base(services)
{
}
public DotvvmControl GetContents(FieldProps props)
{
var context = CreateAutoUiContext();
var resultPlaceholder = new PlaceHolder();
// create the rows
foreach (var property in GetPropertiesToDisplay(context, props.FieldSelector))
{
if (TryGetFieldTemplate(property, props) is { } template)
{
resultPlaceholder.AppendChildren(template);
continue;
}
DotvvmControl control;
if (props.EditorTemplate.TryGetValue(property.Name, out var editorTemplate))
control = new TemplateHost(editorTemplate);
else
{
control = InitializeEditor(props, property, context);
}
var help = property.Description is { } description
? new HtmlGenericControl("div").AddCssClass("help").SetProperty(c => c.InnerText, description.ToBinding(context.BindingService)!)
: null;
var validator = new Validator()
.AddCssClass("help is-danger")
.SetProperty(Validator.ShowErrorMessageTextProperty, true);
var field = new HtmlGenericControl("div")
.AddCssClass("field")
.AppendChildren(control, validator, help);
var fieldBody = new HtmlGenericControl("div")
.AddCssClass("field-body")
.AppendChildren(field);
var label = InitializeControlLabel(property, context, props)
?.AddCssClass("label");
var fieldLabel = new HtmlGenericControl("div")
.AddCssClass("field-label is-normal")
.AppendChildren(label);
// create the validator
InitializeValidation(validator, fieldLabel, property, context);
var wrapperField = new HtmlGenericControl("div")
.AddCssClass("field is-horizontal")
.AppendChildren(fieldLabel, fieldBody);
SetFieldVisibility(wrapperField, property, props, context);
resultPlaceholder.Children.Add(wrapperField);
}
return resultPlaceholder;
}
private HtmlGenericControl InitializeEditor(FieldProps props, PropertyDisplayMetadata property, AutoUIContext context)
{
var editor = CreateEditor(property, context, props)
.SetProperty(Validator.InvalidCssClassProperty, "is-danger")
.SetProperty(Validator.SetToolTipTextProperty, true)
.SetProperty(Validator.ValueProperty, context.CreateValueBinding(property));
return new HtmlGenericControl("div")
.AddCssClass("control")
.AppendChildren(editor);
}
/// <summary>
/// Indicates that when the AutoEditor control is used inside BulmaForm, it should be wrapped in a div with a 'select' CSS class. This attached property is intended to be used when implementing custom FormEditorProviders.
/// </summary>
[AttachedProperty(typeof(bool))]
public static readonly DotvvmProperty WrapWithSelectClassProperty =
DotvvmProperty.Register<bool, BulmaForm>(() => WrapWithSelectClassProperty, isValueInherited: false, defaultValue: false);
/// <summary>
/// Indicates that when the AutoEditor control is used inside BulmaForm, it should be wrapped in a div with a 'checkbox' CSS class. This attached property is intended to be used when implementing custom FormEditorProviders.
/// </summary>
[AttachedProperty(typeof(bool))]
public static readonly DotvvmProperty WrapWithCheckboxClassProperty =
DotvvmProperty.Register<bool, BulmaForm>(() => WrapWithCheckboxClassProperty, isValueInherited: false, defaultValue: false);
/// <summary>
/// Indicates that when the AutoEditor control is used inside BulmaForm, it should be wrapped in a div with a 'radio' CSS class. This attached property is intended to be used when implementing custom FormEditorProviders.
/// </summary>
[AttachedProperty(typeof(bool))]
public static readonly DotvvmProperty WrapWithRadioClassProperty =
DotvvmProperty.Register<bool, BulmaForm>(() => WrapWithRadioClassProperty, isValueInherited: false, defaultValue: false);
/// <summary>
/// Indicates that when the AutoEditor control is used inside BulmaForm, it should be wrapped in a div with a 'textarea' CSS class. This attached property is intended to be used when implementing custom FormEditorProviders.
/// </summary>
[AttachedProperty(typeof(bool))]
public static readonly DotvvmProperty WrapWithTextareaClassProperty =
DotvvmProperty.Register<bool, BulmaForm>(() => WrapWithTextareaClassProperty, isValueInherited: false, defaultValue: false);
/// <summary>
/// Indicates that when the AutoEditor control is used inside BulmaForm, it should be wrapped in a div with an 'input' CSS class. This attached property is intended to be used when implementing custom FormEditorProviders.
/// </summary>
[AttachedProperty(typeof(bool))]
public static readonly DotvvmProperty WrapWithInputClassProperty =
DotvvmProperty.Register<bool, BulmaForm>(() => WrapWithInputClassProperty, isValueInherited: false, defaultValue: false);
}
}