Parley.js is a small utility replacing window.prompt
and window.confirm
.
Needs | Version | MDN | |
---|---|---|---|
ECMAScript | Promise |
ES2015 | see |
HTML | <dialog> |
HTML5 | see |
Without Babel, code also needs async
and await
keywords (ES2017).
import * as Parley from "parley.js";
import "parley.js/dist/default.css";
// ...
If you have a bundler that supports SCSS and TypeScript, you can import the source files directly:
import * as Parley from "parley.js/src";
// ...
Also, you can use UNPKG:
<link rel="stylesheet" href="https://unpkg.com/parley.js/dist/default.css" />
<script type="module">
import * as Parley from "https://unpkg.com/parley.js";
// ...
</script>
Parley.fire
It takes configuration and responds with a Promise. Depending on the input type, configuration and output vary. But if the parley was cancelled (by the cancel button or the escape key) the output is always false.
Name | Description | Default |
---|---|---|
title |
The title displayed in parley. Supports HTML | "" |
message |
The HTML message of the parley. | "" |
cancelButtonHTML |
The HTML content of the cancel button. | Cancel" |
confirmButtonHTML |
The HTML content of the confirm button. | "OK" |
value |
The default value. | undefined |
inputOptions |
The input-type-specific; see bellow | {} |
Input types | Configuration type | Output / Defaut value type |
---|---|---|
"number" "range" |
NumberOptions |
number |
"textarea" |
TextareaOptions |
string |
"tel" "text" "email" "search" "password" |
TextOptions |
string |
"checkbox" "select" "radio" |
SelectOptions |
string , string[] for checkbox |
"none |
never |
boolean |
interface NumberOptions {
min?: number;
max?: number;
step?: number;
placeholder?: string;
}
interface TextareaOptions {
rows?: number;
cols?: number;
placeholder?: string;
}
interface TextOptions {
/**
* Regular expression used to validate the input
*/
pattern?: RegExp;
placeholder?: string;
}
interface SelectionOptions {
/**
* The key is the value of the input.
* The value is the label html of the input.
*/
[value: string]: string;
}
Parley.close
and Parley.cancel
Both functions close the parley immediately. While Parley.cancel()
causes to return false
,
Parley.close()
returns the user value.
Generated using TypeDoc