rimmel
Version:
A Streams-Oriented UI library for the Rx.Observable Universe
97 lines • 4.52 kB
TypeScript
/**
* An Event Operator that emits the value of the underlying <input> element into a target observer
*
* @category Event Adapter Operators
* @returns OperatorFunction<Event, string | number | date | null>
*
* For simple, one-step input pipelines, see the {@link Cut | Cut (uppercase)} Event Adapter
*
* ## Examples
*
* ### ValidInfo
*
* Create a custom Event Operator that feeds a stream with validated data, once a custom validator passes
*
* ```ts
* import { Subject, filter } from 'rxjs';
* import { rml, inputPipe, value } from 'rimmel';
*
* const isValid = filter((s: string) => IS_VALID_IMPL(s) );
* const ValidInfo = inputPipe(value, isValid);
*
* const Component = () => {
* const stream = new Subject<string>();
*
* return rml`
* <input type="text" onchange="${ValidInfo(stream)}" autofocus>
* [ <span>${stream}</span> ]
* `;
* };
* ```
*/
export declare const value: import("rxjs").OperatorFunction<Event, string | number | boolean | Date | null>;
/**
* An Event Adapter emitting the value of the underlying <input> element instead of a regular DOM Event object
*
* ## Example
* Copy the value of a text box on change
*
* ```ts
* import { Subject } from 'rxjs';
* import { rml, Value } from 'rimmel';
*
* const Component = () => {
* const stream = new Subject<string>();
*
* return rml`
* <input type="text" onchange="${Value(stream)}" autofocus>
* [ <span>${stream}</span> ]
* `;
* };
* ```
*/
export declare const Value: (target: import("..").RMLTemplateExpressions.TargetEventHandler<string>) => import("..").Observer<Event>;
/**
* An Event Source Operator emitting the value of the underlying <input> element instead of a regular DOM Event object
* @returns OperatorFunction<Event, string>
*/
export declare const valueAsString: import("rxjs").OperatorFunction<Event, string>;
/**
* An Event Adapter emitting the value of the underlying <input> element instead of a regular DOM Event object
* @param handler A handler function or observer to send events to
* @returns EventSource<string>
*/
export declare const ValueAsString: (target: import("..").RMLTemplateExpressions.TargetEventHandler<string>) => import("..").Observer<Event>;
/**
* An Event Source Operator for valueAsNumber
* Emits the numeric value of the underlying <input type="number"> or <input type="range"> instead of a regular DOM Event object
* @returns OperatorFunction<Event, number | null>
*/
export declare const valueAsNumber: import("rxjs").OperatorFunction<Event, number>;
/**
* An Event Source for valueAsNumber
* Emits the numeric value of the underlying <input type="number"> or <input type="range"> instead of a regular DOM Event object
* @returns EventSource<number>
*/
export declare const ValueAsNumber: (target: import("..").RMLTemplateExpressions.TargetEventHandler<number>) => import("..").Observer<Event>;
/**
* An Event Source Operator for valueAsDate
* Emits the numeric value of the underlying `<input type="date">` instead of a regular DOM Event object
* @returns OperatorFunction<Event, Date | null>
*/
export declare const valueAsDate: import("rxjs").OperatorFunction<Event, Date | null>;
/**
* An Event Adapter for valueAsDate
* Emits the numeric value of the underlying `<input type="date">` instead of a regular DOM Event object
* @returns EventSource<Date | null>
*/
export declare const ValueAsDate: (target: import("..").RMLTemplateExpressions.TargetEventHandler<Date | null>) => import("..").Observer<Event>;
export declare const asValue: import("rxjs").OperatorFunction<Event, string | number | boolean | Date | null>;
export declare const AsValue: (target: import("..").RMLTemplateExpressions.TargetEventHandler<string>) => import("..").Observer<Event>;
export declare const asStringValue: import("rxjs").OperatorFunction<Event, string>;
export declare const AsStringValue: (target: import("..").RMLTemplateExpressions.TargetEventHandler<string>) => import("..").Observer<Event>;
export declare const asNumericValue: import("rxjs").OperatorFunction<Event, number>;
export declare const AsNumericValue: (target: import("..").RMLTemplateExpressions.TargetEventHandler<number>) => import("..").Observer<Event>;
export declare const asDateValue: import("rxjs").OperatorFunction<Event, Date | null>;
export declare const AsDateValue: (target: import("..").RMLTemplateExpressions.TargetEventHandler<Date | null>) => import("..").Observer<Event>;
//# sourceMappingURL=value-source.d.ts.map