On a phone the composer opened at the top of the feed whether or not the feed was scrolled there, and a reply, quote or edit opened inside its card's 228px column. New PhoneSheet shows them as a sheet from the bottom of the screen below md, over a dimmed page, with a heading and a close button (a tap outside or Escape closes it too); from md they stay in place as before. On a phone a new post starts from a round button under the thumb (the feed keeps room for it at the bottom), and the tabs' Post button shows from md. Opening the composer scrolls the feed to its top, and the composer's words take the focus (DTextarea.Element). Picking a suggested mention or hashtag keeps the focus, and the phone's keyboard, in the words (DButton.KeepFocus, and the words are focused again). The character count sits under the words instead of over their last line, and the visibility menu names each choice. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01LsXgEaXee4GCU1hwYgPJXw
54 lines
1.9 KiB
Plaintext
54 lines
1.9 KiB
Plaintext
@typeparam TValue
|
|
@inherits DInputBase<TValue>
|
|
|
|
@* daisyUI Textarea: https://daisyui.com/components/textarea/ . Blazor sets the textarea's value property, so the bound
|
|
value is the content; rows, placeholder and the like pass through. *@
|
|
<textarea @ref="Element" @attributes="InputAttributes" class="@CssClassFull" name="@NameAttribute" value="@CurrentValueAsString"
|
|
@oninput="OnInput" @onchange="OnChange" aria-invalid="@(IsInvalid ? "true" : null)"></textarea>
|
|
|
|
@code {
|
|
/// <summary>The textarea itself, for focusing it.</summary>
|
|
public ElementReference Element { get; private set; }
|
|
|
|
[Parameter] public DColor Color { get; set; }
|
|
[Parameter] public DSize Size { get; set; }
|
|
[Parameter] public bool Ghost { get; set; }
|
|
/// <summary>Update the bound value on every keystroke instead of on change.</summary>
|
|
[Parameter] public bool Immediate { get; set; }
|
|
/// <summary>Adds daisyUI's validator class: error/success colors and a following DValidatorHint.</summary>
|
|
[Parameter] public bool Validator { get; set; }
|
|
|
|
string CssClassFull => Cx("textarea", IsInvalid ? "textarea-error" : ColorClass, SizeClass, Ghost ? "textarea-ghost" : null,
|
|
Validator ? "validator" : null, CssClass);
|
|
|
|
string ColorClass => Color switch
|
|
{
|
|
DColor.Neutral => "textarea-neutral",
|
|
DColor.Primary => "textarea-primary",
|
|
DColor.Secondary => "textarea-secondary",
|
|
DColor.Accent => "textarea-accent",
|
|
DColor.Info => "textarea-info",
|
|
DColor.Success => "textarea-success",
|
|
DColor.Warning => "textarea-warning",
|
|
DColor.Error => "textarea-error",
|
|
_ => null
|
|
};
|
|
|
|
string SizeClass => Size switch
|
|
{
|
|
DSize.Xs => "textarea-xs",
|
|
DSize.Sm => "textarea-sm",
|
|
DSize.Lg => "textarea-lg",
|
|
DSize.Xl => "textarea-xl",
|
|
_ => null
|
|
};
|
|
|
|
void OnInput(ChangeEventArgs e)
|
|
{
|
|
if (Immediate)
|
|
CurrentValueAsString = e.Value?.ToString();
|
|
}
|
|
|
|
void OnChange(ChangeEventArgs e) => CurrentValueAsString = e.Value?.ToString();
|
|
}
|