diff --git a/src/Headway.Blazor.Controls/Components/OptionBase.cs b/src/Headway.Blazor.Controls/Base/OptionBase.cs
similarity index 92%
rename from src/Headway.Blazor.Controls/Components/OptionBase.cs
rename to src/Headway.Blazor.Controls/Base/OptionBase.cs
index 7a950198..0ea2d1da 100644
--- a/src/Headway.Blazor.Controls/Components/OptionBase.cs
+++ b/src/Headway.Blazor.Controls/Base/OptionBase.cs
@@ -3,7 +3,6 @@
 using Headway.Core.Helpers;
 using Headway.Core.Model;
 using Headway.Core.Notifications;
-using Headway.Blazor.Controls.Base;
 using Headway.RequestApi.Requests;
 using MediatR;
 using Microsoft.AspNetCore.Components;
@@ -13,7 +12,7 @@
 using System.Linq.Expressions;
 using System.Threading.Tasks;
 
-namespace Headway.Blazor.Controls.Components
+namespace Headway.Blazor.Controls.Base
 {
     [DynamicComponent]
     public abstract class OptionBase : DynamicComponentBase
@@ -59,7 +58,7 @@ protected override async Task OnInitializedAsync()
 
             var arg = ComponentArgHelper.GetArg(ComponentArgs, Options.OPTIONS_CODE);
 
-            if(arg == null)
+            if (arg == null)
             {
                 options = ComponentArgs
                     .Select(a => new OptionItem { Id = a.Name, Display = a.Value.ToString() })
@@ -84,7 +83,7 @@ protected override async Task OnParametersSetAsync()
                 options = new List<OptionItem>(optionItems);
             }
 
-            await OnInitializedAsync().ConfigureAwait(false);   
+            await OnInitializedAsync().ConfigureAwait(false);
         }
     }
 }
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Checkbox.razor b/src/Headway.Blazor.Controls/Components/Mobile/Checkbox.razor
new file mode 100644
index 00000000..f4e1b634
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Checkbox.razor
@@ -0,0 +1,25 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits CheckboxBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudCheckBox T="bool" @bind-Checked="PropertyValue" Label="@Field.Label" />
+            }
+            else
+            {
+                 <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudCheckBox T="bool" @bind-Checked="PropertyValue" Label="@Field.Label" />
+                 </MudTooltip>    
+            }
+        </div>
+        <div class="col-sm-8"></div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Checkbox.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Checkbox.razor.cs
new file mode 100644
index 00000000..b771bbb1
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Checkbox.razor.cs
@@ -0,0 +1,21 @@
+using Headway.Core.Attributes;
+using Headway.Blazor.Controls.Base;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class CheckboxBase : DynamicComponentBase
+    {
+        public bool PropertyValue
+        {
+            get
+            {
+                return (bool)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/CheckboxNullable.razor b/src/Headway.Blazor.Controls/Components/Mobile/CheckboxNullable.razor
new file mode 100644
index 00000000..e391ba26
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/CheckboxNullable.razor
@@ -0,0 +1,25 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits CheckboxNullableBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudCheckBox T="bool?" @bind-Checked="PropertyValue" Label="@Field.Label" />
+            }
+            else
+            {
+                 <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudCheckBox T="bool?" @bind-Checked="PropertyValue" Label="@Field.Label" />
+                 </MudTooltip>    
+            }
+        </div>
+        <div class="col-sm-8"></div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/CheckboxNullable.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/CheckboxNullable.razor.cs
new file mode 100644
index 00000000..ebd92559
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/CheckboxNullable.razor.cs
@@ -0,0 +1,21 @@
+using Headway.Core.Attributes;
+using Headway.Blazor.Controls.Base;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class CheckboxNullableBase : DynamicComponentBase
+    {
+        public bool? PropertyValue
+        {
+            get
+            {
+                return (bool?)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Date.razor b/src/Headway.Blazor.Controls/Components/Mobile/Date.razor
new file mode 100644
index 00000000..1b71d229
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Date.razor
@@ -0,0 +1,27 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits DateBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudTextField T="DateTime" @bind-Value="@PropertyValue" For="FieldExpression" Format="yyyy-MM-dd"
+                          Variant="Variant.Outlined" InputType="InputType.Date" Label="@Field.Label" />
+            }
+            else
+            {
+                <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudTextField T="DateTime" @bind-Value="@PropertyValue" For="FieldExpression" Format="yyyy-MM-dd"
+                              Variant="Variant.Outlined" InputType="InputType.Date" Label="@Field.Label" />
+                </MudTooltip>   
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Date.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Date.razor.cs
new file mode 100644
index 00000000..df8ae0f2
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Date.razor.cs
@@ -0,0 +1,32 @@
+using Headway.Core.Attributes;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DateBase : DynamicComponentBase
+    {
+        public Expression<Func<DateTime>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<DateTime>>(Field.MemberExpression);
+            }
+        }
+
+        public DateTime PropertyValue
+        {
+            get
+            {
+                return (DateTime)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DateNullable.razor b/src/Headway.Blazor.Controls/Components/Mobile/DateNullable.razor
new file mode 100644
index 00000000..aa3aedeb
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DateNullable.razor
@@ -0,0 +1,27 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits DateNullableBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudTextField T="DateTime?" @bind-Value="@PropertyValue" For="FieldExpression" Format="yyyy-MM-dd"
+                          Variant="Variant.Outlined" InputType="InputType.Date" Label="@Field.Label" />
+            }
+            else
+            {
+                <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudTextField T="DateTime?" @bind-Value="@PropertyValue" For="FieldExpression" Format="yyyy-MM-dd"
+                              Variant="Variant.Outlined" InputType="InputType.Date" Label="@Field.Label" />
+                </MudTooltip>   
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DateNullable.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/DateNullable.razor.cs
new file mode 100644
index 00000000..bc77df5e
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DateNullable.razor.cs
@@ -0,0 +1,32 @@
+using Headway.Core.Attributes;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DateNullableBase : DynamicComponentBase
+    {
+        public Expression<Func<DateTime?>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<DateTime?>>(Field.MemberExpression);
+            }
+        }
+
+        public DateTime? PropertyValue
+        {
+            get
+            {
+                return (DateTime?)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Decimal.razor b/src/Headway.Blazor.Controls/Components/Mobile/Decimal.razor
new file mode 100644
index 00000000..7a366292
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Decimal.razor
@@ -0,0 +1,27 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits DecimalBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudNumericField @bind-Value="@PropertyValue" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                             For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudNumericField @bind-Value="@PropertyValue" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                                 For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Decimal.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Decimal.razor.cs
new file mode 100644
index 00000000..bbdaa0c1
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Decimal.razor.cs
@@ -0,0 +1,77 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Helpers;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DecimalBase : DynamicComponentBase
+    {
+        protected string format = string.Empty;
+        protected int? maxLength = null;
+        protected decimal? min = null;
+        protected decimal? max = null;
+
+        protected override Task OnInitializedAsync()
+        {
+            var formatArg = ComponentArgHelper.GetArg(ComponentArgs, Args.FORMAT);
+
+            if (formatArg != null)
+            {
+                format = formatArg.Value;
+            }
+
+            var maxLengthArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX_LENGTH);
+
+            if (maxLengthArg != null)
+            {
+                maxLength = int.Parse(maxLengthArg.Value);
+            }
+
+            var minArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MIN);
+
+            if (minArg != null)
+            {
+                min = decimal.Parse(minArg.Value);
+            }
+
+            var maxArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX);
+
+            if (maxArg != null)
+            {
+                max = decimal.Parse(maxArg.Value);
+            }
+
+            return base.OnInitializedAsync();
+        }
+
+        public int MaxLength { get { return maxLength.HasValue ? maxLength.Value : int.MaxValue; } }
+        public decimal Max { get { return max ?? decimal.MaxValue; } }
+        public decimal Min { get { return min ?? decimal.MinValue; } }
+
+        public Expression<Func<decimal>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<decimal>>(Field.MemberExpression);
+            }
+        }
+
+        public decimal PropertyValue
+        {
+            get
+            {
+                return (decimal)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DecimalNullable.razor b/src/Headway.Blazor.Controls/Components/Mobile/DecimalNullable.razor
new file mode 100644
index 00000000..19fb382a
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DecimalNullable.razor
@@ -0,0 +1,27 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits DecimalNullableBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudNumericField @bind-Value="@PropertyValue" Format="@format" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                             For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudNumericField @bind-Value="@PropertyValue" Format="@format" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                                 For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DecimalNullable.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/DecimalNullable.razor.cs
new file mode 100644
index 00000000..d42127c0
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DecimalNullable.razor.cs
@@ -0,0 +1,75 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Helpers;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DecimalNullableBase : DynamicComponentBase
+    {
+        protected string format = string.Empty;
+        protected int? maxLength = null;
+
+        protected override Task OnInitializedAsync()
+        {
+            var formatArg = ComponentArgHelper.GetArg(ComponentArgs, Args.FORMAT);
+
+            if(formatArg != null)
+            {
+                format = formatArg.Value;
+            }
+
+            var maxLengthArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX_LENGTH);
+
+            if (maxLengthArg != null)
+            {
+                maxLength = int.Parse(maxLengthArg.Value);
+            }
+
+            var minArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MIN);
+
+            if (minArg != null)
+            {
+                Min = decimal.Parse(minArg.Value);
+            }
+
+            var maxArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX);
+
+            if (maxArg != null)
+            {
+                Max = decimal.Parse(maxArg.Value);
+            }
+
+            return base.OnInitializedAsync();
+        }
+
+        public int MaxLength { get { return maxLength.HasValue ? maxLength.Value : int.MaxValue; } }
+        protected decimal? Min { get; set; }
+        protected decimal? Max { get; set; }
+
+        public Expression<Func<decimal?>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<decimal?>>(Field.MemberExpression);
+            }
+        }
+
+        public decimal? PropertyValue
+        {
+            get
+            {
+                return (decimal?)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Dropdown.razor b/src/Headway.Blazor.Controls/Components/Mobile/Dropdown.razor
new file mode 100644
index 00000000..5afe85cc
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Dropdown.razor
@@ -0,0 +1,43 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits DropdownBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudSelect  T="string" Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter" MultiSelection="false"
+                           @bind-Value="PropertyValue" For="FieldExpression" SelectedValuesChanged="OnValueChanged" Label="@Field.Label">
+                    @if (optionItems != null)
+                    {
+                        @foreach (var optionItem in optionItems)
+                        {
+                            <MudSelectItem T="string" Value="@optionItem.Id">@optionItem.Display</MudSelectItem>
+                        }
+                    }
+                </MudSelect>            
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudSelect  T="string" Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter" MultiSelection="false"
+                               @bind-Value="PropertyValue" For="FieldExpression" SelectedValuesChanged="OnValueChanged" Label="@Field.Label">
+                        @if (optionItems != null)
+                        {
+                            @foreach (var optionItem in optionItems)
+                            {
+                                <MudSelectItem T="string" Value="@optionItem.Id">@optionItem.Display</MudSelectItem>
+                            }
+                        }
+                    </MudSelect>
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Dropdown.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Dropdown.razor.cs
new file mode 100644
index 00000000..306ba46d
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Dropdown.razor.cs
@@ -0,0 +1,121 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Helpers;
+using Headway.Core.Model;
+using Headway.Core.Notifications;
+using Headway.Blazor.Controls.Base;
+using Headway.RequestApi.Requests;
+using MediatR;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Linq.Expressions;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DropdownBase : DynamicComponentBase
+    {
+        [Inject]
+        public IStateNotification StateNotification { get; set; }
+
+        [Inject]
+        public IMediator Mediator { get; set; }
+
+        protected IEnumerable<OptionItem> optionItems;
+
+        private bool isNumericId = false;
+
+        public Expression<Func<string>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<string>>(Field.MemberExpression);
+            }
+        }
+
+        public string PropertyValue
+        {
+            get
+            {
+                return Field.PropertyInfo.GetValue(Field.Model)?.ToString();
+            }
+            set
+            {
+                if (string.IsNullOrWhiteSpace(value))
+                {
+                    Field.PropertyInfo.SetValue(Field.Model, null);
+                }
+                else if (isNumericId)
+                {
+                    Field.PropertyInfo.SetValue(Field.Model, int.Parse(value));
+                }
+                else
+                {
+                    Field.PropertyInfo.SetValue(Field.Model, value);
+                }
+            }
+        }
+
+        protected override void OnInitialized()
+        {
+            var isNumericIdArg = ComponentArgHelper.GetArg(ComponentArgs, Args.IS_NUMERIC_ID);
+
+            if (isNumericIdArg != null)
+            {
+                isNumericId = bool.Parse(isNumericIdArg.Value);
+            }
+
+            base.OnInitialized();
+        }
+
+        protected override async Task OnParametersSetAsync()
+        {
+            LinkFieldCheck();
+
+            var result = await Mediator.Send(new OptionItemsRequest(ComponentArgs)).ConfigureAwait(false);
+
+            optionItems = GetResponse(result.OptionItems);
+
+            OptionItem selectedItem = null;
+
+            if (isNumericId)
+            {
+                var id = (int)Field.PropertyInfo.GetValue(Field.Model);
+                selectedItem = optionItems.FirstOrDefault(o => o.Id != null && o.Id.Equals(id.ToString()));
+            }
+            else
+            {
+                var id = Field.PropertyInfo.GetValue(Field.Model)?.ToString();
+                if (!string.IsNullOrWhiteSpace(id))
+                {
+                    selectedItem = optionItems.FirstOrDefault(o => o.Id != null && o.Id.Equals(id));
+                }
+            }
+
+            if(selectedItem == null)
+            {
+                selectedItem = optionItems.First();
+            }
+
+            PropertyValue = selectedItem.Id;
+
+            await base.OnParametersSetAsync().ConfigureAwait(false);
+        }
+
+        protected async virtual void OnValueChanged(IEnumerable<string> values)
+        {
+            if (Field.HasLinkDependents)
+            {
+                StateNotification.NotifyStateHasChanged(Field.ContainerUniqueId);
+            }
+
+            await InvokeAsync(() =>
+            {
+                StateHasChanged();
+            });
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DropdownComplex.razor b/src/Headway.Blazor.Controls/Components/Mobile/DropdownComplex.razor
new file mode 100644
index 00000000..f5ff8e93
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DropdownComplex.razor
@@ -0,0 +1,45 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Headway.Blazor.Controls.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@typeparam T where T : class, new()
+@inherits DropdownComplexBase<T>
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudSelect  T="GenericItem<T>" Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter" MultiSelection="false"
+                           @bind-Value="SelectedItem" SelectedValuesChanged="OnValueChanged" Label="@Field.Label">
+                    @if (optionItems != null)
+                    {
+                        @foreach (var optionItem in optionItems)
+                        {
+                            <MudSelectItem T="GenericItem<T>" Value="@optionItem"/>
+                        }
+                    }
+                </MudSelect>            
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudSelect T="GenericItem<T>" Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter" MultiSelection="false"
+                           @bind-Value="SelectedItem" SelectedValuesChanged="OnValueChanged" Label="@Field.Label">
+                        @if (optionItems != null)
+                        {
+                            @foreach (var optionItem in optionItems)
+                            {
+                                <MudSelectItem T="GenericItem<T>" Value="@optionItem" />
+                            }
+                        }
+                    </MudSelect>
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DropdownComplex.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/DropdownComplex.razor.cs
new file mode 100644
index 00000000..b6c33140
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DropdownComplex.razor.cs
@@ -0,0 +1,83 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Extensions;
+using Headway.Core.Helpers;
+using Headway.Core.Interface;
+using Headway.Core.Notifications;
+using Headway.Blazor.Controls.Base;
+using Headway.Blazor.Controls.Model;
+using Microsoft.AspNetCore.Components;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DropdownComplexBase<T> : DynamicComponentBase
+    {
+        [Inject]
+        public IStateNotification StateNotification { get; set; }
+
+        [Inject]
+        public IOptionsApiRequest OptionsService { get; set; }
+
+        protected IEnumerable<GenericItem<T>> optionItems;
+
+        private GenericItem<T> selectedItem;
+
+        public GenericItem<T> SelectedItem
+        {
+            get
+            {
+                return selectedItem;
+            }
+            set
+            {
+                if (selectedItem != value)
+                {
+                    selectedItem = value;
+                    Field.PropertyInfo.SetValue(Field.Model, SelectedItem.Item);
+                }
+            }
+        }
+
+        protected override async Task OnParametersSetAsync()
+        {
+            LinkFieldCheck();
+
+            var displayName = ComponentArgs.DynamicArgToString(Options.DISPLAY_FIELD);
+
+            var propertyInfo = PropertyInfoHelper.GetPropertyInfo(typeof(T), displayName);
+
+            var result = await OptionsService.GetOptionItemsAsync<T>(ComponentArgs).ConfigureAwait(false);
+
+            var items = GetResponse(result);
+
+            if (items.Any())
+            {
+                optionItems = items.Select(oi => new GenericItem<T>(oi, propertyInfo));
+
+                if (Field.PropertyInfo.GetValue(Field.Model) != null)
+                {
+                    var value = propertyInfo.GetValue(Field.PropertyInfo.GetValue(Field.Model));
+                    if (value != null)
+                    {
+                        selectedItem = optionItems.FirstOrDefault(
+                            oi => oi.Name != null && oi.Name.Equals(value));
+                    }
+                }
+            }
+
+            await base.OnParametersSetAsync().ConfigureAwait(false);
+        }
+
+        public virtual void OnValueChanged(IEnumerable<GenericItem<T>> values)
+        {
+            if (Field.HasLinkDependents)
+            {
+                StateNotification.NotifyStateHasChanged(Field.ContainerUniqueId);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DropdownEnum.razor b/src/Headway.Blazor.Controls/Components/Mobile/DropdownEnum.razor
new file mode 100644
index 00000000..b1620253
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DropdownEnum.razor
@@ -0,0 +1,44 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@typeparam T where T : struct, Enum
+@inherits DropdownEnumBase<T>
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudSelect  T="T" Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter" MultiSelection="false"
+                           @bind-Value="PropertyValue" SelectedValuesChanged="OnValueChanged" Label="@Field.Label">
+                    @if (optionItems != null)
+                    {
+                        @foreach (var optionItem in optionItems)
+                        {
+                            <MudSelectItem T="T" Value="@optionItem.Id">@optionItem.Display</MudSelectItem>
+                        }
+                    }
+                </MudSelect>            
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudSelect T="T" Variant="Variant.Outlined" AnchorOrigin="Origin.BottomCenter" MultiSelection="false"
+                           @bind-Value="PropertyValue" SelectedValuesChanged="OnValueChanged" Label="@Field.Label">
+                        @if (optionItems != null)
+                        {
+                            @foreach (var optionItem in optionItems)
+                            {
+                                <MudSelectItem T="T" Value="@optionItem.Id">@optionItem.Display</MudSelectItem>
+                            }
+                        }
+                    </MudSelect>
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/DropdownEnum.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/DropdownEnum.razor.cs
new file mode 100644
index 00000000..55ae82b2
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/DropdownEnum.razor.cs
@@ -0,0 +1,71 @@
+using Headway.Core.Attributes;
+using Headway.Core.Notifications;
+using Headway.Blazor.Controls.Base;
+using Headway.Blazor.Controls.Model;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Collections.Generic;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class DropdownEnumBase<T> : DynamicComponentBase
+    {
+        [Inject]
+        public IStateNotification StateNotification { get; set; }
+
+        protected List<OptionItemEnum<T>> optionItems = new();
+
+        public T PropertyValue
+        {
+            get
+            {
+                return (T)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+
+        protected override Task OnInitializedAsync()
+        {
+            var type = Type.GetType(nameof(T));
+            var optionItemsArray = Enum.GetValues(typeof(T));
+
+            foreach (var optionItem in optionItemsArray)
+            {
+                var item = optionItem.ToString();
+                optionItems.Add(new OptionItemEnum<T>
+                {
+
+                    Id = (T)optionItem,
+                    Display = item
+                });
+            }
+
+            return base.OnInitializedAsync();
+        }
+
+        protected override async Task OnParametersSetAsync()
+        {
+            LinkFieldCheck();
+
+            await base.OnParametersSetAsync().ConfigureAwait(false);
+        }
+
+        protected async virtual void OnValueChanged(IEnumerable<T> values)
+        {
+            if (Field.HasLinkDependents)
+            {
+                StateNotification.NotifyStateHasChanged(Field.ContainerUniqueId);
+            }
+
+            await InvokeAsync(() =>
+            {
+                StateHasChanged();
+            });
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Integer.razor b/src/Headway.Blazor.Controls/Components/Mobile/Integer.razor
new file mode 100644
index 00000000..fb1881c6
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Integer.razor
@@ -0,0 +1,27 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits IntegerBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudNumericField @bind-Value="@PropertyValue" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                             For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudNumericField @bind-Value="@PropertyValue" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                                 For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Integer.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Integer.razor.cs
new file mode 100644
index 00000000..24215591
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Integer.razor.cs
@@ -0,0 +1,69 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Helpers;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class IntegerBase : DynamicComponentBase
+    {
+        protected int? maxLength = null;
+        protected int? min = null;
+        protected int? max = null;
+
+        protected override Task OnInitializedAsync()
+        {
+            var maxLengthArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX_LENGTH);
+
+            if (maxLengthArg != null)
+            {
+                maxLength = int.Parse(maxLengthArg.Value);
+            }
+
+            var minArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MIN);
+
+            if (minArg != null)
+            {
+                min = int.Parse(minArg.Value);
+            }
+
+            var maxArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX);
+
+            if (maxArg != null)
+            {
+                max = int.Parse(maxArg.Value);
+            }
+
+            return base.OnInitializedAsync();
+        }
+
+        public int MaxLength { get { return maxLength.HasValue ? maxLength.Value : int.MaxValue; } }
+        public int Max { get { return max ?? int.MaxValue; } }
+        public int Min { get { return min ?? int.MinValue; } }
+
+        public Expression<Func<int>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<int>>(Field.MemberExpression);
+            }
+        }
+
+        public int PropertyValue
+        {
+            get
+            {
+                return (int)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/IntegerNullable.razor b/src/Headway.Blazor.Controls/Components/Mobile/IntegerNullable.razor
new file mode 100644
index 00000000..500c78ae
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/IntegerNullable.razor
@@ -0,0 +1,27 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits IntegerNullableBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudNumericField @bind-Value="@PropertyValue" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                             For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudNumericField @bind-Value="@PropertyValue" MaxLength="@MaxLength" Min="@Min" Max="@Max"
+                                 For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/IntegerNullable.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/IntegerNullable.razor.cs
new file mode 100644
index 00000000..f3214dde
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/IntegerNullable.razor.cs
@@ -0,0 +1,69 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Helpers;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+using System.Threading.Tasks;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class IntegerNullableBase : DynamicComponentBase
+    {
+        protected int? maxLength = null;
+        protected int? min = null;
+        protected int? max = null;
+
+        protected override Task OnInitializedAsync()
+        {
+            var maxLengthArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX_LENGTH);
+
+            if (maxLengthArg != null)
+            {
+                maxLength = int.Parse(maxLengthArg.Value);
+            }
+
+            var minArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MIN);
+
+            if (minArg != null)
+            {
+                min = int.Parse(minArg.Value);
+            }
+
+            var maxArg = ComponentArgHelper.GetArg(ComponentArgs, Args.MAX);
+
+            if (maxArg != null)
+            {
+                max = int.Parse(maxArg.Value);
+            }
+
+            return base.OnInitializedAsync();
+        }
+
+        public int MaxLength { get { return maxLength.HasValue ? maxLength.Value : int.MaxValue; } }
+        public int Max { get { return max ?? int.MaxValue; } }
+        public int Min { get { return min ?? int.MinValue; } }
+
+        public Expression<Func<int?>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<int?>>(Field.MemberExpression);
+            }
+        }
+
+        public int? PropertyValue
+        {
+            get
+            {
+                return (int?)Field.PropertyInfo.GetValue(Field.Model);
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Label.razor b/src/Headway.Blazor.Controls/Components/Mobile/Label.razor
new file mode 100644
index 00000000..f88601f5
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Label.razor
@@ -0,0 +1,25 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits LabelBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudTextField Value="@PropertyValue" Variant="Variant.Outlined" ReadOnly="true" Label="@Field.Label" />
+            }
+            else
+            {
+                <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudTextField Value="@PropertyValue" Variant="Variant.Outlined" ReadOnly="true" Label="@Field.Label" />
+                </MudTooltip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Label.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Label.razor.cs
new file mode 100644
index 00000000..67739005
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Label.razor.cs
@@ -0,0 +1,17 @@
+using Headway.Core.Attributes;
+using Headway.Blazor.Controls.Base;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class LabelBase : DynamicComponentBase
+    {
+        public string PropertyValue
+        {
+            get
+            {
+                return Field.PropertyInfo.GetValue(Field.Model)?.ToString();
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/OptionHorizontal.razor b/src/Headway.Blazor.Controls/Components/Mobile/OptionHorizontal.razor
new file mode 100644
index 00000000..e25b9c4e
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/OptionHorizontal.razor
@@ -0,0 +1,35 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits OptionBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudRadioGroup @bind-SelectedOption="@PropertyValue" For="FieldExpression">
+                    @foreach (var option in options)
+                    {
+                        <MudRadio Option="@option.Id">@option.Display</MudRadio>
+                    }
+                </MudRadioGroup>
+            }
+            else
+            {
+                <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudRadioGroup @bind-SelectedOption="@PropertyValue" For="FieldExpression">
+                        @foreach (var option in options)
+                        {
+                            <MudRadio Option="@option.Id">@option.Display</MudRadio>
+                        }
+                    </MudRadioGroup>
+                </MudTooltip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/OptionVertical.razor b/src/Headway.Blazor.Controls/Components/Mobile/OptionVertical.razor
new file mode 100644
index 00000000..00ec95e3
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/OptionVertical.razor
@@ -0,0 +1,39 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits OptionBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+               <MudRadioGroup @bind-SelectedOption="@PropertyValue" For="FieldExpression">
+                    @foreach (var option in options)
+                    {
+                        <div class="option-vertical">
+                            <MudRadio Option="@option.Id">@option.Display</MudRadio>
+                        </div>
+                    }
+               </MudRadioGroup>        
+            }
+            else
+            {
+                <MudTooltip Text="@Field.Tooltip" Placement="Placement.Top">
+                    <MudRadioGroup @bind-SelectedOption="@PropertyValue" For="FieldExpression">
+                        @foreach (var option in options)
+                        {
+                            <div class="option-vertical">
+                                <MudRadio Option="@option.Id">@option.Display</MudRadio>
+                            </div>
+                        }
+                    </MudRadioGroup>
+                </MudTooltip> 
+            }
+        </div>
+        <div class="col-sm-8 option-vertical-container" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/OptionVertical.razor.css b/src/Headway.Blazor.Controls/Components/Mobile/OptionVertical.razor.css
new file mode 100644
index 00000000..c5e31dbe
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/OptionVertical.razor.css
@@ -0,0 +1,7 @@
+.option-vertical-container {
+    margin-top: 5px;
+}
+
+.option-vertical {
+    margin: 2px;
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Text.razor b/src/Headway.Blazor.Controls/Components/Mobile/Text.razor
new file mode 100644
index 00000000..06b79601
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Text.razor
@@ -0,0 +1,25 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits TextBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudTextField @bind-Value="@PropertyValue" For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudTextField @bind-Value="@PropertyValue" For="FieldExpression" Variant="Variant.Outlined" Label="@Field.Label" />
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/Text.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/Text.razor.cs
new file mode 100644
index 00000000..b5ff35f1
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/Text.razor.cs
@@ -0,0 +1,32 @@
+using Headway.Core.Attributes;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class TextBase : DynamicComponentBase
+    {
+        public Expression<Func<string>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<string>>(Field.MemberExpression);
+            }
+        }
+
+        public string PropertyValue
+        {
+            get
+            {
+                return Field.PropertyInfo.GetValue(Field.Model)?.ToString();
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+    }
+}
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/TextMultiline.razor b/src/Headway.Blazor.Controls/Components/Mobile/TextMultiline.razor
new file mode 100644
index 00000000..e10aca85
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/TextMultiline.razor
@@ -0,0 +1,25 @@
+@using Headway.Core.Dynamic
+@using Headway.Core.Model
+@using Microsoft.AspNetCore.Components.Forms
+@using System.Reflection
+@using System.Linq.Expressions
+
+@inherits TextMultilineBase
+
+<div class="mb-1">
+    <div class="row">
+        <div class="col-sm-4">
+            @if(string.IsNullOrWhiteSpace(Field.Tooltip))
+            {
+                <MudTextField @bind-Value="@PropertyValue" For="FieldExpression" Variant="Variant.Outlined" Lines="@rows" Label="@Field.Label" />
+            }
+            else
+            {
+                <ComponentTip Text="@Field.Tooltip">
+                    <MudTextField @bind-Value="@PropertyValue" For="FieldExpression" Variant="Variant.Outlined" Lines="@rows" Label="@Field.Label" />
+                </ComponentTip>    
+            }
+        </div>
+        <div class="col-sm-8" />
+    </div>
+</div>
\ No newline at end of file
diff --git a/src/Headway.Blazor.Controls/Components/Mobile/TextMultiline.razor.cs b/src/Headway.Blazor.Controls/Components/Mobile/TextMultiline.razor.cs
new file mode 100644
index 00000000..1731d65d
--- /dev/null
+++ b/src/Headway.Blazor.Controls/Components/Mobile/TextMultiline.razor.cs
@@ -0,0 +1,48 @@
+using Headway.Core.Attributes;
+using Headway.Core.Constants;
+using Headway.Core.Helpers;
+using Headway.Blazor.Controls.Base;
+using Microsoft.AspNetCore.Components;
+using System;
+using System.Linq.Expressions;
+
+namespace Headway.Blazor.Controls.Components.Mobile
+{
+    [DynamicComponent]
+    public abstract class TextMultilineBase : DynamicComponentBase
+    {
+        protected int rows;
+
+        public Expression<Func<string>> FieldExpression
+        {
+            get
+            {
+                return Expression.Lambda<Func<string>>(Field.MemberExpression);
+            }
+        }
+
+        public string PropertyValue
+        {
+            get
+            {
+                return Field.PropertyInfo.GetValue(Field.Model)?.ToString();
+            }
+            set
+            {
+                Field.PropertyInfo.SetValue(Field.Model, value);
+            }
+        }
+
+        protected override void OnInitialized()
+        {
+            var val = ComponentArgHelper.GetArgValue(ComponentArgs, Args.TEXT_MULTILINE_ROWS);
+
+            if (int.TryParse(val, out int i))
+            {
+                rows = i;
+            }
+
+            base.OnInitialized();
+        }
+    }
+}