Connect this instance to a target input element and insert this instance into the DOM in the correct location.
NOTE: calling the static for method is usually preferable as it will reuse an existing clone if available.
However, if reusing clones is problematic (ie, if the clone needs to be mutated), a clone can be constructed
directly with new InputStyleClone(target).
Get the clone element.
Static forGet the clone for an input, reusing an existing one if available. This avoids creating unecessary clones, which have a performance cost due to their high-frequency event-based updates. Because these elements are shared, they should be mutated with caution. If you're planning to mutate the clone, consider constructing a new one instead.
Upon initial creation the clone element will automatically be inserted into the DOM and begin observing the linked input.
The target input to clone.
Appends an event listener for events whose type attribute value is type. The callback argument sets the callback that will be invoked when the event is dispatched.
The options argument sets listener-specific options. For compatibility this can be a boolean, in which case the method behaves exactly as if the value was specified as options's capture.
When set to true, options's capture prevents callback from being invoked when the event's eventPhase attribute value is BUBBLING_PHASE. When false (or not present), callback will not be invoked when event's eventPhase attribute value is CAPTURING_PHASE. Either way, callback will be invoked if event's eventPhase attribute value is AT_TARGET.
When set to true, options's passive indicates that the callback will not cancel the event by invoking preventDefault(). This is used to enable performance optimizations described in ยง 2.8 Observing event listeners.
When set to true, options's once indicates that the callback will only be invoked once after which the event listener will be removed.
If an AbortSignal is passed for options's signal, then the event listener will be removed when signal is aborted.
The event listener is appended to target's event listener list and is not appended if it has the same type, callback, and capture.
Optional options: boolean | AddEventListenerOptionsGenerated using TypeDoc
Creates an element that exactly matches an input pixel-for-pixel and automatically stays in sync with it. This is a non-interactive overlay on to the input and can be used to affect the visual appearance of the input without modifying its behavior. The clone element is hidden by default.
This lower level API powers the
InputRangebut provides more advanced functionality including event updates.Emits
updateevents whenever anything is recalculated: when the layout changes, when the user scrolls, when the input is updated, etc. This event may be emitted more than once per change.Note
There may be cases in which the clone cannot observe changes to the input and fails to automatically update. For example, if the
valueproperty on the input is written to directly, noinputevent is emitted by the input and the clone does not automatically update. In these cases,forceUpdatecan be used to manually trigger an update.