rimmel
Version:
A Streams-Oriented UI library for the Rx.Observable Universe
59 lines (58 loc) • 2.03 kB
TypeScript
/**
* An Event Operator emitting a FormData object from the underlying form element instead of a regular DOM Event object
* @returns OperatorFunction<Event, FormData>
* @example <form onsubmit="${source(isValid, form, stream)}"> ... </form>
**/
export declare const form: import("rxjs").OperatorFunction<Event, {
[k: string]: FormDataEntryValue;
}>;
/**
* An Event Adapter emitting the underlying form's key-values
* @effect calls preventDefault() on the event
* @unstable might need to review the preventDefault() behaviour
* @unstable might need to review the checkbox behaviour (on/off vs true/false)
* @returns EventSource<string>
* @example `<form action="dialog" onsubmit="${Form(stream)}"> ... </form>`
* @example `<form action="dialog" onsubmit="${Form(handlerFn)}"> ... </form>`
*
* ## Examples
* ### Submit a form into a stream
*
* No need to call preventDefault() on the event, as this is done automatically
* ```ts
* import { rml } from 'rimmel';
*
* const Component = () => {
* const stream = new Subject<FormData>();
*
* return rml`
* <form onsubmit="${stream}">
* <input type="text" name="name">
* <input type="email" name="email">
* </form>
* `;
* }
* ```
*
* ### Submit a dialog form into a stream
* ```ts
* import { rml } from 'rimmel';
*
* const Component = () => {
* const stream = new Subject<FormData>();
*
* return rml`
* <form onsubmit="${stream}">
* <input type="text" name="name">
* <input type="email" name="email">
* </form>
* `;
* }
* ```
**/
export declare const Form: (target: import("..").RMLTemplateExpressions.TargetEventHandler<unknown>) => import("..").Observer<Event | SubmitEvent>;
export declare const asFormData: import("rxjs").OperatorFunction<Event, {
[k: string]: FormDataEntryValue;
}>;
export declare const AsFormData: (target: import("..").RMLTemplateExpressions.TargetEventHandler<unknown>) => import("..").Observer<Event | SubmitEvent>;
//# sourceMappingURL=form-data-source.d.ts.map