Skip to content

Commit 819c0db

Browse files
overskuloverskul
committed
fix(select dialog): format
1 parent 56c8198 commit 819c0db

File tree

1 file changed

+128
-126
lines changed

1 file changed

+128
-126
lines changed

‎src/dialogs/select.js‎

Lines changed: 128 additions & 126 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import tile from 'components/tile';
2-
import Checkbox from 'components/checkbox';
3-
import actionStack from 'lib/actionStack';
4-
import restoreTheme from 'lib/restoreTheme';
1+
import tile from "components/tile";
2+
import Checkbox from "components/checkbox";
3+
import actionStack from "lib/actionStack";
4+
import restoreTheme from "lib/restoreTheme";
55

66
/**
77
* @typedef {object} SelectOptions
@@ -30,128 +30,130 @@ import restoreTheme from 'lib/restoreTheme';
3030
* @returns {Promise<string>}
3131
*/
3232
function select(title, items, options = {}) {
33-
let rejectOnCancel = false;
34-
if (typeof options === 'boolean') {
35-
rejectOnCancel = options;
36-
options = {};
37-
}
38-
39-
return new Promise((res, rej) => {
40-
const { textTransform = false, hideOnSelect = true } = options;
41-
let $defaultVal;
42-
43-
// elements
44-
const $mask = <span className="mask" onclick={cancel}></span>;
45-
const $list = tag('ul', {
46-
className: 'scroll' + !textTransform ? ' no-text-transform' : ''
47-
});
48-
const $select = (
49-
<div className="prompt select">
50-
{title ? <strong className="title">{title}</strong> : ''}
51-
{$list}
52-
</div>
53-
);
54-
55-
items.map(item => {
56-
let lead,
57-
tail,
58-
itemOptions = {
59-
value: null,
60-
text: null,
61-
icon: null,
62-
disabled: false,
63-
letters: '',
64-
checkbox: null
65-
};
66-
67-
// init item options
68-
if (typeof item === 'object') {
69-
if (Array.isArray(item)) {
70-
Object.keys(itemOptions).forEach(
71-
(key, i) => (itemOptions[key] = item[i])
72-
);
73-
} else {
74-
itemOptions = Object.assign({}, itemOptions, item);
75-
}
76-
} else {
77-
itemOptions.value = item;
78-
itemOptions.text = item;
79-
}
80-
81-
// handle icon
82-
if (itemOptions.icon) {
83-
if (itemOptions.icon === 'letters' && !!itemOptions.letters) {
84-
lead = <i className="icon letters" data-letters={itemOptions.letters}></i>
85-
} else {
86-
lead = <i className={`icon ${itemOptions.icon}`}></i>;
87-
}
88-
}
89-
90-
// handle checkbox
91-
if (itemOptions.checkbox != null) {
92-
tail = Checkbox({
93-
checked: itemOptions.checkbox
94-
});
95-
}
96-
97-
const $item = tile({
98-
lead,
99-
tail,
100-
text: <span className="text" innerHTML={itemOptions.text}></span>
101-
});
102-
103-
$item.tabIndex = '0';
104-
if (itemOptions.disabled) $item.classList.add('disabled');
105-
if (options.default === itemOptions.value) {
106-
$item.classList.add('selected');
107-
$defaultVal = $item;
108-
}
109-
110-
// handle events
111-
$item.onclick = function () {
112-
if (!itemOptions.value) return;
113-
if (hideOnSelect) hide();
114-
res(itemOptions.value);
115-
};
116-
117-
$list.append($item);
118-
});
119-
120-
actionStack.push({
121-
id: 'select',
122-
action: cancel
123-
});
124-
125-
app.append($select, $mask);
126-
if ($defaultVal) $defaultVal.scrollIntoView();
127-
128-
const $firstChild = $defaultVal || $list.firstChild;
129-
if ($firstChild && $firstChild.focus) $firstChild.focus();
130-
restoreTheme(true);
131-
132-
function cancel() {
133-
hide();
134-
if (typeof options.onCancel === 'function') options.onCancel();
135-
if (rejectOnCancel) reject();
136-
}
137-
138-
function hideSelect() {
139-
$select.classList.add('hide');
140-
restoreTheme();
141-
setTimeout(() => {
142-
$select.remove();
143-
$mask.remove();
144-
}, 300);
145-
}
146-
147-
function hide() {
148-
if (typeof options.onHide === 'function') options.onHide();
149-
actionStack.remove('select');
150-
hideSelect();
151-
let listItems = [...$list.children];
152-
listItems.map(item => (item.onclick = null));
153-
}
154-
});
33+
let rejectOnCancel = false;
34+
if (typeof options === "boolean") {
35+
rejectOnCancel = options;
36+
options = {};
37+
}
38+
39+
return new Promise((res, rej) => {
40+
const { textTransform = false, hideOnSelect = true } = options;
41+
let $defaultVal;
42+
43+
// elements
44+
const $mask = <span className="mask" onclick={cancel}></span>;
45+
const $list = tag("ul", {
46+
className: "scroll" + !textTransform ? " no-text-transform" : "",
47+
});
48+
const $select = (
49+
<div className="prompt select">
50+
{title ? <strong className="title">{title}</strong> : ""}
51+
{$list}
52+
</div>
53+
);
54+
55+
items.map((item) => {
56+
let lead,
57+
tail,
58+
itemOptions = {
59+
value: null,
60+
text: null,
61+
icon: null,
62+
disabled: false,
63+
letters: "",
64+
checkbox: null,
65+
};
66+
67+
// init item options
68+
if (typeof item === "object") {
69+
if (Array.isArray(item)) {
70+
Object.keys(itemOptions).forEach(
71+
(key, i) => (itemOptions[key] = item[i]),
72+
);
73+
} else {
74+
itemOptions = Object.assign({}, itemOptions, item);
75+
}
76+
} else {
77+
itemOptions.value = item;
78+
itemOptions.text = item;
79+
}
80+
81+
// handle icon
82+
if (itemOptions.icon) {
83+
if (itemOptions.icon === "letters" && !!itemOptions.letters) {
84+
lead = (
85+
<i className="icon letters" data-letters={itemOptions.letters}></i>
86+
);
87+
} else {
88+
lead = <i className={`icon ${itemOptions.icon}`}></i>;
89+
}
90+
}
91+
92+
// handle checkbox
93+
if (itemOptions.checkbox != null) {
94+
tail = Checkbox({
95+
checked: itemOptions.checkbox,
96+
});
97+
}
98+
99+
const $item = tile({
100+
lead,
101+
tail,
102+
text: <span className="text" innerHTML={itemOptions.text}></span>,
103+
});
104+
105+
$item.tabIndex = "0";
106+
if (itemOptions.disabled) $item.classList.add("disabled");
107+
if (options.default === itemOptions.value) {
108+
$item.classList.add("selected");
109+
$defaultVal = $item;
110+
}
111+
112+
// handle events
113+
$item.onclick = function () {
114+
if (!itemOptions.value) return;
115+
if (hideOnSelect) hide();
116+
res(itemOptions.value);
117+
};
118+
119+
$list.append($item);
120+
});
121+
122+
actionStack.push({
123+
id: "select",
124+
action: cancel,
125+
});
126+
127+
app.append($select, $mask);
128+
if ($defaultVal) $defaultVal.scrollIntoView();
129+
130+
const $firstChild = $defaultVal || $list.firstChild;
131+
if ($firstChild && $firstChild.focus) $firstChild.focus();
132+
restoreTheme(true);
133+
134+
function cancel() {
135+
hide();
136+
if (typeof options.onCancel === "function") options.onCancel();
137+
if (rejectOnCancel) reject();
138+
}
139+
140+
function hideSelect() {
141+
$select.classList.add("hide");
142+
restoreTheme();
143+
setTimeout(() => {
144+
$select.remove();
145+
$mask.remove();
146+
}, 300);
147+
}
148+
149+
function hide() {
150+
if (typeof options.onHide === "function") options.onHide();
151+
actionStack.remove("select");
152+
hideSelect();
153+
let listItems = [...$list.children];
154+
listItems.map((item) => (item.onclick = null));
155+
}
156+
});
155157
}
156158

157159
export default select;

0 commit comments

Comments
 (0)