live · mainnetoc · docs
specs · api · guides
docs / documentation

@orangecheck/auth-client


@orangecheck/auth-client / UseOcAddressSuggestionOptions

Interface: UseOcAddressSuggestionOptions

Defined in: src/components.tsx:448

Bitcoin-address <input> that, when the user is signed in via oc_session, surfaces their address as a one-click suggestion on focus.

Behaviour:

  • On focus, if logged-in AND the typed value is a prefix of the session address (or empty), show a small popover with bc1q…7ke3 as a clickable suggestion.
  • Click / Enter on the suggestion fills the field with the full address.
  • Down-arrow from the input highlights the suggestion; Up-arrow clears the highlight; Escape closes the popover; clicking outside closes the popover.
  • When the user types something that's no longer a prefix of the session address, the popover hides itself out of the way.
  • When the field already contains the session address exactly, no popover.

Style-agnostic: minimal inline styles for positioning only. Style the parts via wrapperClassName / popoverClassName / suggestionClassName, or via the [data-oc-address-input], [data-oc-address-popover], and [data-oc-address-suggestion] data attributes.

Properties

PropertyTypeDescriptionDefined in
<a id="property-onvaluechange"></a> onValueChange(value: string) => voidCalled when the user selects the suggestion (or you may also call it from the input's onChange).src/components.tsx:452
<a id="property-popoverclassname"></a> popoverClassName?stringclassName applied to the suggestion popover. Style with [data-oc-address-popover] otherwise.src/components.tsx:456
<a id="property-suggestionclassname"></a> suggestionClassName?stringclassName applied to the suggestion button. Style with [data-oc-address-suggestion] otherwise.src/components.tsx:458
<a id="property-suggestionlabel"></a> suggestionLabel?stringLabel shown above the suggested address in the popover. Defaults to use your address.src/components.tsx:454
<a id="property-value"></a> valuestringCurrent value of the input.src/components.tsx:450