# LongPress
**Also known as:** PressAndHold, TapAndHold
## Description
BitLongPress raises an event when its content is pressed and held: a touch, a pen or a mouse button kept down in place for a moment, or the context-menu keys of the keyboard. It is what a touch screen has for a secondary action where a desktop has the right-click - a context menu on iOS, which never raises one on its own, an item's options, a preview.
## Parameters
| Name | Type | Default Value | Description |
| :--- | :--- | :------------ | :---------- |
| ChildContent | `RenderFragment?` | null | The content the press is held on. |
| Delay | `int?` | null | The time in milliseconds a press has to be held before it is a long press. Defaults to 500. |
| KeyboardTrigger | `bool` | false | Makes the long press a tab stop whose context-menu keys - Shift+F10 and the Menu key - raise OnLongPress, at the middle of the element that has the focus and with a PointerType of "keyboard". The keys are named in aria-keyshortcuts, and are left alone on a field being typed in. |
| MoveTolerance | `decimal?` | null | How far in pixels the pointer may move while it is held before the press is called off. Defaults to 10. |
| OnLongPress | `EventCallback<BitLongPressEventArgs>` | | The callback for when a press has been held for the Delay, or the context-menu keys of KeyboardTrigger are pressed. |
| TouchOnly | `bool` | false | Leaves the mouse out: only a touch or a pen is held, and a mouse button held down does nothing. |
| AriaLabel | `string?` | null | Gets or sets the accessible label for the component, used by assistive technologies. |
| Class | `string?` | null | Gets or sets the CSS class name(s) to apply to the rendered element. |
| Dir | `BitDir?` | null | Gets or sets the text directionality for the component's content. |
| Disabled | `bool` | false | Gets or sets a value indicating whether the component is disabled and cannot respond to user interaction. |
| ForceAnimation | `bool` | false | Gets or sets a value indicating whether the component's animations play at their full duration even when reduced motion is requested. |
| HtmlAttributes | `Dictionary<string, object>` | new Dictionary<string, object>() | Captures additional HTML attributes to be applied to the rendered element, in addition to the component's parameters. An attribute written on the component wins over an entry of the same name. |
| Id | `string?` | null | Gets or sets the unique identifier for the component's root element. |
| Style | `string?` | null | Gets or sets the CSS style string to apply to the rendered element. |
| TabIndex | `string?` | null | Gets or sets the tab order index for the component when navigating with the keyboard. |
| Visibility | `BitVisibility` | BitVisibility.Visible | Gets or sets the visibility state (visible, hidden, or collapsed) of the component. |
## Public Members
| Name | Type | Default Value | Description |
| :--- | :--- | :------------ | :---------- |
| UniqueId | `Guid` | Guid.NewGuid() | Gets the readonly unique identifier for the component's root element, assigned when the component instance is constructed. |
| RootElement | `ElementReference` | | Gets the reference to the root HTML element associated with this component. |
## Enums
### BitVisibility Enum
| Name | Value | Description |
| :--- | :--- | :---------- |
| Visible | 0 | The content of the component is visible. |
| Hidden | 1 | The content of the component is hidden, but the space it takes on the page remains (visibility:hidden). |
| Collapsed | 2 | The component is hidden (display:none). |
### BitDir Enum
| Name | Value | Description |
| :--- | :--- | :---------- |
| Ltr | 0 | Ltr (left to right) is to be used for languages that are written from the left to the right (like English). |
| Rtl | 1 | Rtl (right to left) is to be used for languages that are written from the right to the left (like Arabic). |
| Auto | 2 | Auto lets the user agent decide. It uses a basic algorithm as it parses the characters inside the element until it finds a character with a strong directionality, then applies that directionality to the whole element. |
## Sub Classes
### BitLongPressEventArgs Properties
| Name | Type | Default Value | Description |
| :--- | :--- | :------------ | :---------- |
| ClientX | `double` | | The horizontal point the press was held at, in pixels relative to the viewport: where the pointer went down, or the middle of the focused element for the keyboard. It is what a menu opened at a point is given (BitContextMenu.OpenAt). |
| ClientY | `double` | | The vertical point the press was held at, in pixels relative to the viewport. |
| PointerType | `string` | | What held the press: "touch", "pen", "mouse", or "keyboard" for the keys of KeyboardTrigger. |
## CSS Variables
Public CSS custom properties read off the component's root. Set one on `:root` to restyle every instance, on any ancestor to restyle the ones inside it, or on the `Style` of one instance to restyle it and every instance nested inside it, which inherits the value too - a parameter changes one alone, as does the real CSS property on its `Style` / `Styles` when that property does not inherit (`opacity`); an inherited one (`color`, `font-family`) reaches the nested instances that do not set it themselves.
| Name | Default Value | Description |
| :--- | :------------ | :---------- |
| `--bit-LongPress-focus-color` | --bit-clr-pri-focus | Focus ring color of a KeyboardTrigger long press. |
## Examples
\n**Basic**:
```razor
contextMenu = default!;
private string? menuClicked;
private static readonly List menuItems =
[
new() { Text = "Share", Key = "share", IconName = BitIconName.Share },
new() { Text = "Rename", Key = "rename", IconName = BitIconName.Rename },
new() { IsSeparator = true },
new() { Text = "Delete", Key = "delete", IconName = BitIconName.Delete },
];
```
\n**Click and long press**:
```razor
Tap, or press and hold
```
\n**Style & Class**:
```razor
Press and hold here
Long presses: @basicCount
Last: @basicLast
```
```csharp
private int basicCount;
private string? basicLast;
private void HandleBasicLongPress(BitLongPressEventArgs e)
{
basicCount++;
basicLast = $"{e.PointerType} at {e.ClientX:0}, {e.ClientY:0}";
}
```
\n**Context menu**:
```razor
Right-click, or press and hold here
Clicked item: @menuClicked
```
```csharp
private BitContextMenuLast: @clickLog
```
```csharp
private int clickClicks;
private int clickLongPresses;
private string? clickLog;
private void HandleClick() => clickLog = $"Clicked ({++clickClicks})";
private void HandleClickLongPress() => clickLog = $"Long-pressed ({++clickLongPresses})";
```
\n**Delay & tolerance**:
```razor
Hold for 1.5 seconds
Hold, and drift up to 40px
Last: @delayLog
```
```csharp
private int delayCount;
private string? delayLog;
private void HandleSlowLongPress() => delayLog = $"Held for 1.5 seconds ({++delayCount})";
private void HandleTolerantLongPress() => delayLog = $"Held within 40px ({++delayCount})";
```
\n**Touch only**:
```razor
Press and hold with a finger or a pen
Held by: @touchLog
```
```csharp
private string? touchLog;
```
\n**Keyboard**:
```razor
Tab here, then press Shift+F10
Last: @keyboardLog
```
```csharp
private string? keyboardLog;
private void HandleKeyboardLongPress(BitLongPressEventArgs e) => keyboardLog = $"{e.PointerType} at {e.ClientX:0}, {e.ClientY:0}";
```
\n**Disabled**:
```razor
Holding here does nothing
Press and hold here
Long presses: @styleCount
```
```csharp
private int styleCount;
```