@foldkit/ui 0.129.0 → 0.131.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/anchor.js +12 -11
- package/dist/animation/index.js +11 -10
- package/dist/animation/schema.js +3 -2
- package/dist/animation/update.js +26 -25
- package/dist/button/index.js +3 -2
- package/dist/calendar/index.js +159 -158
- package/dist/checkbox/index.js +9 -8
- package/dist/combobox/multi.js +20 -19
- package/dist/combobox/shared.js +169 -168
- package/dist/combobox/single.js +23 -22
- package/dist/datePicker/index.js +69 -68
- package/dist/dialog/index.js +52 -51
- package/dist/disclosure/index.js +11 -10
- package/dist/dragAndDrop/index.js +122 -121
- package/dist/fieldset/index.js +5 -4
- package/dist/fileDrop/index.js +23 -22
- package/dist/group.js +7 -6
- package/dist/input/index.js +4 -3
- package/dist/internal/optionExtensions.js +2 -1
- package/dist/internal/selectors.js +2 -1
- package/dist/keyboard.js +5 -4
- package/dist/listbox/multi.js +12 -11
- package/dist/listbox/shared.js +171 -170
- package/dist/listbox/single.js +13 -12
- package/dist/menu/index.js +167 -166
- package/dist/nav/index.js +7 -6
- package/dist/popover/index.js +87 -86
- package/dist/radioGroup/index.js +23 -22
- package/dist/select/index.js +4 -3
- package/dist/slider/index.js +72 -71
- package/dist/switch/index.js +6 -5
- package/dist/tabs/index.js +34 -33
- package/dist/test/apps/disabledButton.js +17 -16
- package/dist/textarea/index.js +4 -3
- package/dist/toast/index.js +19 -18
- package/dist/toast/schema.js +10 -9
- package/dist/toast/test.js +2 -1
- package/dist/toast/update.js +79 -78
- package/dist/tooltip/index.js +59 -58
- package/dist/typeahead.js +6 -5
- package/dist/virtualList/index.js +66 -65
- package/package.json +4 -3
package/dist/listbox/shared.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
1
2
|
import { Array, Effect, Equal, Match as M, Option, Predicate, Schema as S, String as Str, pipe, } from 'effect';
|
|
2
3
|
import * as Command from 'foldkit/command';
|
|
3
4
|
import * as Dom from 'foldkit/dom';
|
|
@@ -39,7 +40,7 @@ export const BaseModel = S.Struct({
|
|
|
39
40
|
maybeLastButtonPointerType: S.Option(S.String),
|
|
40
41
|
});
|
|
41
42
|
/** Creates the shared base fields for a listbox model from a config. Each variant spreads this and adds its selection field. */
|
|
42
|
-
export const baseInit = (config) => ({
|
|
43
|
+
export const baseInit = (config) => (__foldkitBrandViewResult(({
|
|
43
44
|
id: config.id,
|
|
44
45
|
isOpen: false,
|
|
45
46
|
isAnimated: config.isAnimated ?? false,
|
|
@@ -52,7 +53,7 @@ export const baseInit = (config) => ({
|
|
|
52
53
|
searchVersion: 0,
|
|
53
54
|
maybeLastPointerPosition: Option.none(),
|
|
54
55
|
maybeLastButtonPointerType: Option.none(),
|
|
55
|
-
});
|
|
56
|
+
}), "@foldkit/ui/listbox/shared.js#baseInit"));
|
|
56
57
|
// MESSAGE
|
|
57
58
|
/** Sent when the listbox opens via button click or keyboard. Contains an optional initial active item index: None for pointer, Some for keyboard. */
|
|
58
59
|
export const Opened = m('Opened', {
|
|
@@ -159,88 +160,88 @@ export const OutMessage = S.Union([Selected]);
|
|
|
159
160
|
export const SEARCH_DEBOUNCE_MILLISECONDS = 350;
|
|
160
161
|
export const LEFT_MOUSE_BUTTON = 0;
|
|
161
162
|
// SELECTORS
|
|
162
|
-
export const buttonSelector = (id) => idSelector(`${id}-button`);
|
|
163
|
+
export const buttonSelector = (id) => __foldkitBrandViewResult((idSelector(`${id}-button`)), "@foldkit/ui/listbox/shared.js#buttonSelector");
|
|
163
164
|
/** Returns the bare DOM id of the listbox trigger button, derived from the
|
|
164
165
|
* listbox's base id. Use this to associate an external label with the
|
|
165
166
|
* trigger via a native `<label for={Listbox.buttonId(id)}>` or an
|
|
166
167
|
* `aria-labelledby` reference. Mirrors `buttonSelector`, which returns the
|
|
167
168
|
* CSS selector form (`#${id}-button`) rather than the bare id. */
|
|
168
|
-
export const buttonId = (id) => `${id}-button
|
|
169
|
-
export const itemsSelector = (id) => idSelector(`${id}-items`);
|
|
170
|
-
export const itemSelector = (id, index) => idSelector(`${id}-item-${index}`);
|
|
171
|
-
export const itemId = (id, index) => `${id}-item-${index}
|
|
169
|
+
export const buttonId = (id) => __foldkitBrandViewResult((`${id}-button`), "@foldkit/ui/listbox/shared.js#buttonId");
|
|
170
|
+
export const itemsSelector = (id) => __foldkitBrandViewResult((idSelector(`${id}-items`)), "@foldkit/ui/listbox/shared.js#itemsSelector");
|
|
171
|
+
export const itemSelector = (id, index) => __foldkitBrandViewResult((idSelector(`${id}-item-${index}`)), "@foldkit/ui/listbox/shared.js#itemSelector");
|
|
172
|
+
export const itemId = (id, index) => __foldkitBrandViewResult((`${id}-item-${index}`), "@foldkit/ui/listbox/shared.js#itemId");
|
|
172
173
|
// HELPERS
|
|
173
174
|
const constrainedEvo = makeConstrainedEvo();
|
|
174
|
-
export const closedModel = (model) => constrainedEvo(model, {
|
|
175
|
-
isOpen: () => false,
|
|
176
|
-
maybeActiveItemIndex: () => Option.none(),
|
|
177
|
-
searchQuery: () => '',
|
|
178
|
-
searchVersion: () => 0,
|
|
179
|
-
maybeLastPointerPosition: () => Option.none(),
|
|
180
|
-
maybeLastButtonPointerType: () => Option.none(),
|
|
181
|
-
});
|
|
175
|
+
export const closedModel = (model) => __foldkitBrandViewResult((constrainedEvo(model, {
|
|
176
|
+
isOpen: () => __foldkitBrandViewResult((false), "@foldkit/ui/listbox/shared.js#isOpen"),
|
|
177
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex"),
|
|
178
|
+
searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/listbox/shared.js#searchQuery"),
|
|
179
|
+
searchVersion: () => __foldkitBrandViewResult((0), "@foldkit/ui/listbox/shared.js#searchVersion"),
|
|
180
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeLastPointerPosition"),
|
|
181
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeLastButtonPointerType"),
|
|
182
|
+
})), "@foldkit/ui/listbox/shared.js#closedModel");
|
|
182
183
|
/** Prevents page scrolling while the listbox is open in modal mode. */
|
|
183
184
|
export const LockScroll = Command.define('LockScroll', CompletedLockScroll)(Dom.lockScroll.pipe(Effect.as(CompletedLockScroll())));
|
|
184
185
|
/** Re-enables page scrolling after the listbox closes. */
|
|
185
186
|
export const UnlockScroll = Command.define('UnlockScroll', CompletedUnlockScroll)(Dom.unlockScroll.pipe(Effect.as(CompletedUnlockScroll())));
|
|
186
187
|
/** Marks all elements outside the listbox as inert for modal behavior. */
|
|
187
|
-
export const InertOthers = Command.define('InertOthers', { id: S.String }, CompletedInertOthers)(({ id }) => Dom.inertOthers(id, [buttonSelector(id), itemsSelector(id)]).pipe(Effect.as(CompletedInertOthers())));
|
|
188
|
+
export const InertOthers = Command.define('InertOthers', { id: S.String }, CompletedInertOthers)(({ id }) => __foldkitBrandViewResult((Dom.inertOthers(id, [buttonSelector(id), itemsSelector(id)]).pipe(Effect.as(CompletedInertOthers()))), "@foldkit/ui/listbox/shared.js#anonymous"));
|
|
188
189
|
/** Removes the inert attribute from elements outside the listbox. */
|
|
189
|
-
export const RestoreInert = Command.define('RestoreInert', { id: S.String }, CompletedRestoreInert)(({ id }) => Dom.restoreInert(id).pipe(Effect.as(CompletedRestoreInert())));
|
|
190
|
+
export const RestoreInert = Command.define('RestoreInert', { id: S.String }, CompletedRestoreInert)(({ id }) => __foldkitBrandViewResult((Dom.restoreInert(id).pipe(Effect.as(CompletedRestoreInert()))), "@foldkit/ui/listbox/shared.js#anonymous~2"));
|
|
190
191
|
/** Moves focus back to the listbox button after closing. */
|
|
191
|
-
export const FocusButton = Command.define('FocusButton', { id: S.String }, CompletedFocusButton)(({ id }) => Dom.focus(buttonSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton())));
|
|
192
|
+
export const FocusButton = Command.define('FocusButton', { id: S.String }, CompletedFocusButton)(({ id }) => __foldkitBrandViewResult((Dom.focus(buttonSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton()))), "@foldkit/ui/listbox/shared.js#anonymous~3"));
|
|
192
193
|
/** Moves focus to the listbox items container after opening. */
|
|
193
|
-
export const FocusItems = Command.define('FocusItems', { id: S.String }, CompletedFocusItems)(({ id }) => Dom.focus(itemsSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusItems())));
|
|
194
|
+
export const FocusItems = Command.define('FocusItems', { id: S.String }, CompletedFocusItems)(({ id }) => __foldkitBrandViewResult((Dom.focus(itemsSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusItems()))), "@foldkit/ui/listbox/shared.js#anonymous~4"));
|
|
194
195
|
/** Scrolls the active listbox item into view after keyboard navigation. */
|
|
195
|
-
export const ScrollIntoView = Command.define('ScrollIntoView', { id: S.String, index: S.Number }, CompletedScrollIntoView)(({ id, index }) => Dom.scrollIntoView(itemSelector(id, index)).pipe(Effect.ignore, Effect.as(CompletedScrollIntoView())));
|
|
196
|
+
export const ScrollIntoView = Command.define('ScrollIntoView', { id: S.String, index: S.Number }, CompletedScrollIntoView)(({ id, index }) => __foldkitBrandViewResult((Dom.scrollIntoView(itemSelector(id, index)).pipe(Effect.ignore, Effect.as(CompletedScrollIntoView()))), "@foldkit/ui/listbox/shared.js#anonymous~5"));
|
|
196
197
|
/** Programmatically clicks the active listbox item's DOM element. */
|
|
197
|
-
export const ClickItem = Command.define('ClickItem', { id: S.String, index: S.Number }, CompletedClickItem)(({ id, index }) => Dom.clickElement(itemSelector(id, index)).pipe(Effect.ignore, Effect.as(CompletedClickItem())));
|
|
198
|
+
export const ClickItem = Command.define('ClickItem', { id: S.String, index: S.Number }, CompletedClickItem)(({ id, index }) => __foldkitBrandViewResult((Dom.clickElement(itemSelector(id, index)).pipe(Effect.ignore, Effect.as(CompletedClickItem()))), "@foldkit/ui/listbox/shared.js#anonymous~6"));
|
|
198
199
|
/** Waits for the typeahead search debounce period before clearing the query. */
|
|
199
|
-
export const DelayClearSearch = Command.define('DelayClearSearch', { version: S.Number }, ClearedSearch)(({ version }) => Effect.sleep(SEARCH_DEBOUNCE_MILLISECONDS).pipe(Effect.as(ClearedSearch({ version }))));
|
|
200
|
+
export const DelayClearSearch = Command.define('DelayClearSearch', { version: S.Number }, ClearedSearch)(({ version }) => __foldkitBrandViewResult((Effect.sleep(SEARCH_DEBOUNCE_MILLISECONDS).pipe(Effect.as(ClearedSearch({ version })))), "@foldkit/ui/listbox/shared.js#anonymous~7"));
|
|
200
201
|
/** Detects whether the listbox button moved or the leave animation ended. Whichever comes first; both outcomes signal the Animation submodel that leave is complete. */
|
|
201
|
-
export const DetectMovementOrAnimationEnd = Command.define('DetectMovementOrAnimationEnd', { id: S.String }, GotAnimationMessage)(({ id }) => Effect.raceFirst(Dom.detectElementMovement(buttonSelector(id)).pipe(Effect.as(GotAnimationMessage({ message: AnimationEndedAnimation() }))), Dom.waitForAnimationSettled(itemsSelector(id)).pipe(Effect.as(GotAnimationMessage({ message: AnimationEndedAnimation() })))));
|
|
202
|
+
export const DetectMovementOrAnimationEnd = Command.define('DetectMovementOrAnimationEnd', { id: S.String }, GotAnimationMessage)(({ id }) => __foldkitBrandViewResult((Effect.raceFirst(Dom.detectElementMovement(buttonSelector(id)).pipe(Effect.as(GotAnimationMessage({ message: AnimationEndedAnimation() }))), Dom.waitForAnimationSettled(itemsSelector(id)).pipe(Effect.as(GotAnimationMessage({ message: AnimationEndedAnimation() }))))), "@foldkit/ui/listbox/shared.js#anonymous~8"));
|
|
202
203
|
export const makeUpdate = (handleSelectedItem) => {
|
|
203
204
|
const withUpdateReturn = M.withReturnType();
|
|
204
205
|
const delegateToAnimation = (model, animationMessage) => {
|
|
205
206
|
const [nextAnimation, animationCommands, maybeOutMessage] = animationUpdate(model.animation, animationMessage);
|
|
206
|
-
const mappedCommands = Command.mapMessages(animationCommands, message => GotAnimationMessage({ message }));
|
|
207
|
+
const mappedCommands = Command.mapMessages(animationCommands, message => __foldkitBrandViewResult((GotAnimationMessage({ message })), "@foldkit/ui/listbox/shared.js#anonymous~9"));
|
|
207
208
|
const additionalCommands = Option.match(maybeOutMessage, {
|
|
208
|
-
onNone: () => [],
|
|
209
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#onNone"),
|
|
209
210
|
onSome: M.type().pipe(M.tagsExhaustive({
|
|
210
|
-
StartedLeaveAnimating: () => [
|
|
211
|
+
StartedLeaveAnimating: () => __foldkitBrandViewResult(([
|
|
211
212
|
DetectMovementOrAnimationEnd({ id: model.id }),
|
|
212
|
-
],
|
|
213
|
-
TransitionedOut: () => [],
|
|
213
|
+
]), "@foldkit/ui/listbox/shared.js#StartedLeaveAnimating"),
|
|
214
|
+
TransitionedOut: () => __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#TransitionedOut"),
|
|
214
215
|
})),
|
|
215
216
|
});
|
|
216
|
-
return [
|
|
217
|
-
constrainedEvo(model, { animation: () => nextAnimation }),
|
|
217
|
+
return __foldkitBrandViewResult(([
|
|
218
|
+
constrainedEvo(model, { animation: () => __foldkitBrandViewResult((nextAnimation), "@foldkit/ui/listbox/shared.js#animation") }),
|
|
218
219
|
[...mappedCommands, ...additionalCommands],
|
|
219
220
|
Option.none(),
|
|
220
|
-
];
|
|
221
|
+
]), "@foldkit/ui/listbox/shared.js#delegateToAnimation");
|
|
221
222
|
};
|
|
222
223
|
const openListbox = (baseModel, openCommands) => {
|
|
223
224
|
if (baseModel.isAnimated) {
|
|
224
225
|
const [nextModel, animationCommands] = delegateToAnimation(baseModel, AnimationShowed());
|
|
225
|
-
return [
|
|
226
|
-
constrainedEvo(nextModel, { isOpen: () => true }),
|
|
226
|
+
return __foldkitBrandViewResult(([
|
|
227
|
+
constrainedEvo(nextModel, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/listbox/shared.js#isOpen~2") }),
|
|
227
228
|
[...openCommands, ...animationCommands],
|
|
228
229
|
Option.none(),
|
|
229
|
-
];
|
|
230
|
+
]), "@foldkit/ui/listbox/shared.js#openListbox");
|
|
230
231
|
}
|
|
231
|
-
return [
|
|
232
|
-
constrainedEvo(baseModel, { isOpen: () => true }),
|
|
232
|
+
return __foldkitBrandViewResult(([
|
|
233
|
+
constrainedEvo(baseModel, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/listbox/shared.js#isOpen~3") }),
|
|
233
234
|
openCommands,
|
|
234
235
|
Option.none(),
|
|
235
|
-
];
|
|
236
|
+
]), "@foldkit/ui/listbox/shared.js#openListbox");
|
|
236
237
|
};
|
|
237
238
|
const closeListbox = (baseModel, commands, maybeOutMessage = Option.none()) => {
|
|
238
239
|
const closed = closedModel(baseModel);
|
|
239
240
|
if (baseModel.isAnimated) {
|
|
240
241
|
const [nextModel, animationCommands] = delegateToAnimation(closed, AnimationHid());
|
|
241
|
-
return [nextModel, [...commands, ...animationCommands], maybeOutMessage];
|
|
242
|
+
return __foldkitBrandViewResult(([nextModel, [...commands, ...animationCommands], maybeOutMessage]), "@foldkit/ui/listbox/shared.js#closeListbox");
|
|
242
243
|
}
|
|
243
|
-
return [closed, commands, maybeOutMessage];
|
|
244
|
+
return __foldkitBrandViewResult(([closed, commands, maybeOutMessage]), "@foldkit/ui/listbox/shared.js#closeListbox");
|
|
244
245
|
};
|
|
245
246
|
const internalUpdate = (model, message) => {
|
|
246
247
|
const maybeLockScroll = OptionExt.when(model.isModal, LockScroll());
|
|
@@ -261,126 +262,126 @@ export const makeUpdate = (handleSelectedItem) => {
|
|
|
261
262
|
maybeUnlockScroll,
|
|
262
263
|
maybeRestoreInert,
|
|
263
264
|
]);
|
|
264
|
-
return M.value(message).pipe(withUpdateReturn, M.tag('CompletedLockScroll', 'CompletedUnlockScroll', 'CompletedInertOthers', 'CompletedRestoreInert', 'CompletedFocusButton', 'CompletedFocusItems', 'CompletedScrollIntoView', 'CompletedClickItem', 'SuppressedSpaceScroll', 'CompletedAnchorListbox', 'CompletedPortalListboxBackdrop', () => [model, [], Option.none()]), M.tagsExhaustive({
|
|
265
|
-
Opened: ({ maybeActiveItemIndex }) => openListbox(constrainedEvo(model, {
|
|
266
|
-
maybeActiveItemIndex: () => maybeActiveItemIndex,
|
|
267
|
-
activationTrigger: () => Option.match(maybeActiveItemIndex, {
|
|
268
|
-
onNone: () => 'Pointer',
|
|
269
|
-
onSome: () => 'Keyboard',
|
|
270
|
-
}),
|
|
271
|
-
searchQuery: () => '',
|
|
272
|
-
searchVersion: () => 0,
|
|
273
|
-
maybeLastPointerPosition: () => Option.none(),
|
|
274
|
-
}), openCommands),
|
|
275
|
-
Closed: () => closeListbox(model, closeWithFocusCommands),
|
|
265
|
+
return __foldkitBrandViewResult((M.value(message).pipe(withUpdateReturn, M.tag('CompletedLockScroll', 'CompletedUnlockScroll', 'CompletedInertOthers', 'CompletedRestoreInert', 'CompletedFocusButton', 'CompletedFocusItems', 'CompletedScrollIntoView', 'CompletedClickItem', 'SuppressedSpaceScroll', 'CompletedAnchorListbox', 'CompletedPortalListboxBackdrop', () => __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/listbox/shared.js#anonymous~10")), M.tagsExhaustive({
|
|
266
|
+
Opened: ({ maybeActiveItemIndex }) => __foldkitBrandViewResult((openListbox(constrainedEvo(model, {
|
|
267
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((maybeActiveItemIndex), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex~2"),
|
|
268
|
+
activationTrigger: () => __foldkitBrandViewResult((Option.match(maybeActiveItemIndex, {
|
|
269
|
+
onNone: () => __foldkitBrandViewResult(('Pointer'), "@foldkit/ui/listbox/shared.js#onNone~2"),
|
|
270
|
+
onSome: () => __foldkitBrandViewResult(('Keyboard'), "@foldkit/ui/listbox/shared.js#onSome"),
|
|
271
|
+
})), "@foldkit/ui/listbox/shared.js#activationTrigger"),
|
|
272
|
+
searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/listbox/shared.js#searchQuery~2"),
|
|
273
|
+
searchVersion: () => __foldkitBrandViewResult((0), "@foldkit/ui/listbox/shared.js#searchVersion~2"),
|
|
274
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeLastPointerPosition~2"),
|
|
275
|
+
}), openCommands)), "@foldkit/ui/listbox/shared.js#Opened"),
|
|
276
|
+
Closed: () => __foldkitBrandViewResult((closeListbox(model, closeWithFocusCommands)), "@foldkit/ui/listbox/shared.js#Closed"),
|
|
276
277
|
BlurredItems: () => {
|
|
277
278
|
if (Option.exists(model.maybeLastButtonPointerType, Equal.equals('mouse'))) {
|
|
278
|
-
return [model, [], Option.none()];
|
|
279
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/listbox/shared.js#BlurredItems");
|
|
279
280
|
}
|
|
280
|
-
return closeListbox(model, closeWithoutFocusCommands);
|
|
281
|
+
return __foldkitBrandViewResult((closeListbox(model, closeWithoutFocusCommands)), "@foldkit/ui/listbox/shared.js#BlurredItems");
|
|
281
282
|
},
|
|
282
|
-
ActivatedItem: ({ index, activationTrigger }) => [
|
|
283
|
+
ActivatedItem: ({ index, activationTrigger }) => __foldkitBrandViewResult(([
|
|
283
284
|
constrainedEvo(model, {
|
|
284
|
-
maybeActiveItemIndex: () => Option.some(index),
|
|
285
|
-
activationTrigger: () => activationTrigger,
|
|
285
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.some(index)), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex~3"),
|
|
286
|
+
activationTrigger: () => __foldkitBrandViewResult((activationTrigger), "@foldkit/ui/listbox/shared.js#activationTrigger~2"),
|
|
286
287
|
}),
|
|
287
288
|
activationTrigger === 'Keyboard'
|
|
288
289
|
? [ScrollIntoView({ id: model.id, index })]
|
|
289
290
|
: [],
|
|
290
291
|
Option.none(),
|
|
291
|
-
],
|
|
292
|
+
]), "@foldkit/ui/listbox/shared.js#ActivatedItem"),
|
|
292
293
|
MovedPointerOverItem: ({ index, screenX, screenY }) => {
|
|
293
|
-
const isSamePosition = Option.exists(model.maybeLastPointerPosition, position => position.screenX === screenX && position.screenY === screenY);
|
|
294
|
+
const isSamePosition = Option.exists(model.maybeLastPointerPosition, position => __foldkitBrandViewResult((position.screenX === screenX && position.screenY === screenY), "@foldkit/ui/listbox/shared.js#anonymous~11"));
|
|
294
295
|
if (isSamePosition) {
|
|
295
|
-
return [model, [], Option.none()];
|
|
296
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/listbox/shared.js#MovedPointerOverItem");
|
|
296
297
|
}
|
|
297
|
-
return [
|
|
298
|
+
return __foldkitBrandViewResult(([
|
|
298
299
|
constrainedEvo(model, {
|
|
299
|
-
maybeActiveItemIndex: () => Option.some(index),
|
|
300
|
-
activationTrigger: () => 'Pointer',
|
|
301
|
-
maybeLastPointerPosition: () => Option.some({ screenX, screenY }),
|
|
300
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.some(index)), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex~4"),
|
|
301
|
+
activationTrigger: () => __foldkitBrandViewResult(('Pointer'), "@foldkit/ui/listbox/shared.js#activationTrigger~3"),
|
|
302
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.some({ screenX, screenY })), "@foldkit/ui/listbox/shared.js#maybeLastPointerPosition~3"),
|
|
302
303
|
}),
|
|
303
304
|
[],
|
|
304
305
|
Option.none(),
|
|
305
|
-
];
|
|
306
|
+
]), "@foldkit/ui/listbox/shared.js#MovedPointerOverItem");
|
|
306
307
|
},
|
|
307
|
-
DeactivatedItem: () => model.activationTrigger === 'Pointer'
|
|
308
|
+
DeactivatedItem: () => __foldkitBrandViewResult((model.activationTrigger === 'Pointer'
|
|
308
309
|
? [
|
|
309
310
|
constrainedEvo(model, {
|
|
310
|
-
maybeActiveItemIndex: () => Option.none(),
|
|
311
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex~5"),
|
|
311
312
|
}),
|
|
312
313
|
[],
|
|
313
314
|
Option.none(),
|
|
314
315
|
]
|
|
315
|
-
: [model, [], Option.none()],
|
|
316
|
-
SelectedItem: ({ item }) => handleSelectedItem(model, item, {
|
|
317
|
-
closeWithFocus: (closeModel, maybeOutMessage = Option.none()) => closeListbox(closeModel, closeWithFocusCommands, maybeOutMessage),
|
|
318
|
-
closeWithoutFocus: (closeModel, maybeOutMessage = Option.none()) => closeListbox(closeModel, closeWithoutFocusCommands, maybeOutMessage),
|
|
319
|
-
}),
|
|
320
|
-
RequestedItemClick: ({ index }) => [
|
|
316
|
+
: [model, [], Option.none()]), "@foldkit/ui/listbox/shared.js#DeactivatedItem"),
|
|
317
|
+
SelectedItem: ({ item }) => __foldkitBrandViewResult((handleSelectedItem(model, item, {
|
|
318
|
+
closeWithFocus: (closeModel, maybeOutMessage = Option.none()) => __foldkitBrandViewResult((closeListbox(closeModel, closeWithFocusCommands, maybeOutMessage)), "@foldkit/ui/listbox/shared.js#closeWithFocus"),
|
|
319
|
+
closeWithoutFocus: (closeModel, maybeOutMessage = Option.none()) => __foldkitBrandViewResult((closeListbox(closeModel, closeWithoutFocusCommands, maybeOutMessage)), "@foldkit/ui/listbox/shared.js#closeWithoutFocus"),
|
|
320
|
+
})), "@foldkit/ui/listbox/shared.js#SelectedItem"),
|
|
321
|
+
RequestedItemClick: ({ index }) => __foldkitBrandViewResult(([
|
|
321
322
|
model,
|
|
322
323
|
[ClickItem({ id: model.id, index })],
|
|
323
324
|
Option.none(),
|
|
324
|
-
],
|
|
325
|
+
]), "@foldkit/ui/listbox/shared.js#RequestedItemClick"),
|
|
325
326
|
Searched: ({ key, maybeTargetIndex }) => {
|
|
326
327
|
const nextSearchQuery = model.searchQuery + key;
|
|
327
328
|
const nextSearchVersion = model.searchVersion + 1;
|
|
328
|
-
return [
|
|
329
|
+
return __foldkitBrandViewResult(([
|
|
329
330
|
constrainedEvo(model, {
|
|
330
|
-
searchQuery: () => nextSearchQuery,
|
|
331
|
-
searchVersion: () => nextSearchVersion,
|
|
332
|
-
maybeActiveItemIndex: () => Option.orElse(maybeTargetIndex, () => model.maybeActiveItemIndex),
|
|
331
|
+
searchQuery: () => __foldkitBrandViewResult((nextSearchQuery), "@foldkit/ui/listbox/shared.js#searchQuery~3"),
|
|
332
|
+
searchVersion: () => __foldkitBrandViewResult((nextSearchVersion), "@foldkit/ui/listbox/shared.js#searchVersion~3"),
|
|
333
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.orElse(maybeTargetIndex, () => __foldkitBrandViewResult((model.maybeActiveItemIndex), "@foldkit/ui/listbox/shared.js#anonymous~12"))), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex~6"),
|
|
333
334
|
}),
|
|
334
335
|
[DelayClearSearch({ version: nextSearchVersion })],
|
|
335
336
|
Option.none(),
|
|
336
|
-
];
|
|
337
|
+
]), "@foldkit/ui/listbox/shared.js#Searched");
|
|
337
338
|
},
|
|
338
339
|
ClearedSearch: ({ version }) => {
|
|
339
340
|
if (version !== model.searchVersion) {
|
|
340
|
-
return [model, [], Option.none()];
|
|
341
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/listbox/shared.js#ClearedSearch");
|
|
341
342
|
}
|
|
342
|
-
return [
|
|
343
|
-
constrainedEvo(model, { searchQuery: () => '' }),
|
|
343
|
+
return __foldkitBrandViewResult(([
|
|
344
|
+
constrainedEvo(model, { searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/listbox/shared.js#searchQuery~4") }),
|
|
344
345
|
[],
|
|
345
346
|
Option.none(),
|
|
346
|
-
];
|
|
347
|
+
]), "@foldkit/ui/listbox/shared.js#ClearedSearch");
|
|
347
348
|
},
|
|
348
|
-
GotAnimationMessage: ({ message: animationMessage }) => delegateToAnimation(model, animationMessage),
|
|
349
|
+
GotAnimationMessage: ({ message: animationMessage }) => __foldkitBrandViewResult((delegateToAnimation(model, animationMessage)), "@foldkit/ui/listbox/shared.js#GotAnimationMessage"),
|
|
349
350
|
PressedPointerOnButton: ({ pointerType, button }) => {
|
|
350
351
|
const withPointerType = constrainedEvo(model, {
|
|
351
|
-
maybeLastButtonPointerType: () => Option.some(pointerType),
|
|
352
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.some(pointerType)), "@foldkit/ui/listbox/shared.js#maybeLastButtonPointerType~2"),
|
|
352
353
|
});
|
|
353
354
|
if (pointerType !== 'mouse' || button !== LEFT_MOUSE_BUTTON) {
|
|
354
|
-
return [withPointerType, [], Option.none()];
|
|
355
|
+
return __foldkitBrandViewResult(([withPointerType, [], Option.none()]), "@foldkit/ui/listbox/shared.js#PressedPointerOnButton");
|
|
355
356
|
}
|
|
356
357
|
if (model.isOpen) {
|
|
357
358
|
const [closed, commands] = closeListbox(withPointerType, closeWithFocusCommands);
|
|
358
|
-
return [
|
|
359
|
+
return __foldkitBrandViewResult(([
|
|
359
360
|
constrainedEvo(closed, {
|
|
360
|
-
maybeLastButtonPointerType: () => Option.some(pointerType),
|
|
361
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.some(pointerType)), "@foldkit/ui/listbox/shared.js#maybeLastButtonPointerType~3"),
|
|
361
362
|
}),
|
|
362
363
|
commands,
|
|
363
364
|
Option.none(),
|
|
364
|
-
];
|
|
365
|
+
]), "@foldkit/ui/listbox/shared.js#PressedPointerOnButton");
|
|
365
366
|
}
|
|
366
|
-
return openListbox(constrainedEvo(withPointerType, {
|
|
367
|
-
maybeActiveItemIndex: () => Option.none(),
|
|
368
|
-
activationTrigger: () => 'Pointer',
|
|
369
|
-
searchQuery: () => '',
|
|
370
|
-
searchVersion: () => 0,
|
|
371
|
-
maybeLastPointerPosition: () => Option.none(),
|
|
372
|
-
}), openCommands);
|
|
367
|
+
return __foldkitBrandViewResult((openListbox(constrainedEvo(withPointerType, {
|
|
368
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeActiveItemIndex~7"),
|
|
369
|
+
activationTrigger: () => __foldkitBrandViewResult(('Pointer'), "@foldkit/ui/listbox/shared.js#activationTrigger~4"),
|
|
370
|
+
searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/listbox/shared.js#searchQuery~5"),
|
|
371
|
+
searchVersion: () => __foldkitBrandViewResult((0), "@foldkit/ui/listbox/shared.js#searchVersion~4"),
|
|
372
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeLastPointerPosition~4"),
|
|
373
|
+
}), openCommands)), "@foldkit/ui/listbox/shared.js#PressedPointerOnButton");
|
|
373
374
|
},
|
|
374
|
-
IgnoredMouseClick: () => [
|
|
375
|
+
IgnoredMouseClick: () => __foldkitBrandViewResult(([
|
|
375
376
|
constrainedEvo(model, {
|
|
376
|
-
maybeLastButtonPointerType: () => Option.none(),
|
|
377
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#maybeLastButtonPointerType~4"),
|
|
377
378
|
}),
|
|
378
379
|
[],
|
|
379
380
|
Option.none(),
|
|
380
|
-
],
|
|
381
|
-
}));
|
|
381
|
+
]), "@foldkit/ui/listbox/shared.js#IgnoredMouseClick"),
|
|
382
|
+
}))), "@foldkit/ui/listbox/shared.js#internalUpdate");
|
|
382
383
|
};
|
|
383
|
-
return internalUpdate;
|
|
384
|
+
return __foldkitBrandViewResult((internalUpdate), "@foldkit/ui/listbox/shared.js#makeUpdate");
|
|
384
385
|
};
|
|
385
386
|
/** The anchor-positioning Mount this Listbox renders on its items panel.
|
|
386
387
|
* The panel is always anchored to the button via Floating UI and portaled
|
|
@@ -388,44 +389,44 @@ export const makeUpdate = (handleSelectedItem) => {
|
|
|
388
389
|
* so it escapes ancestor stacking contexts and overflow clipping. Exposed
|
|
389
390
|
* so Scene tests can call
|
|
390
391
|
* `Scene.Mount.resolve(AnchorListbox, CompletedAnchorListbox())`. */
|
|
391
|
-
export const AnchorListbox = Mount.define('AnchorListbox', { buttonId: S.String, anchor: AnchorConfig }, CompletedAnchorListbox)(({ buttonId, anchor }) => element => Effect.gen(function* () {
|
|
392
|
-
yield* Effect.acquireRelease(Effect.sync(() => anchorSetup({ buttonId, anchor })(element)), cleanup => Effect.sync(cleanup));
|
|
393
|
-
return CompletedAnchorListbox();
|
|
394
|
-
}));
|
|
392
|
+
export const AnchorListbox = Mount.define('AnchorListbox', { buttonId: S.String, anchor: AnchorConfig }, CompletedAnchorListbox)(({ buttonId, anchor }) => __foldkitBrandViewResult((element => __foldkitBrandViewResult((Effect.gen(function* () {
|
|
393
|
+
yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((anchorSetup({ buttonId, anchor })(element)), "@foldkit/ui/listbox/shared.js#anonymous~16")), cleanup => __foldkitBrandViewResult((Effect.sync(cleanup)), "@foldkit/ui/listbox/shared.js#anonymous~17"));
|
|
394
|
+
return __foldkitBrandViewResult((CompletedAnchorListbox()), "@foldkit/ui/listbox/shared.js#anonymous~15");
|
|
395
|
+
})), "@foldkit/ui/listbox/shared.js#anonymous~14")), "@foldkit/ui/listbox/shared.js#anonymous~13"));
|
|
395
396
|
/** The backdrop-portaling Mount this Listbox renders. Exposed so Scene tests can
|
|
396
397
|
* call `Scene.Mount.resolve(PortalListboxBackdrop, CompletedPortalListboxBackdrop())` to
|
|
397
398
|
* acknowledge the mount produced by the rendered backdrop. */
|
|
398
|
-
export const PortalListboxBackdrop = Mount.define('PortalListboxBackdrop', CompletedPortalListboxBackdrop)(element => Effect.gen(function* () {
|
|
399
|
-
yield* Effect.acquireRelease(Effect.sync(() => portalToContainingRoot(element)), cleanup => Effect.sync(cleanup));
|
|
400
|
-
return CompletedPortalListboxBackdrop();
|
|
401
|
-
}));
|
|
399
|
+
export const PortalListboxBackdrop = Mount.define('PortalListboxBackdrop', CompletedPortalListboxBackdrop)(element => __foldkitBrandViewResult((Effect.gen(function* () {
|
|
400
|
+
yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((portalToContainingRoot(element)), "@foldkit/ui/listbox/shared.js#anonymous~20")), cleanup => __foldkitBrandViewResult((Effect.sync(cleanup)), "@foldkit/ui/listbox/shared.js#anonymous~21"));
|
|
401
|
+
return __foldkitBrandViewResult((CompletedPortalListboxBackdrop()), "@foldkit/ui/listbox/shared.js#anonymous~19");
|
|
402
|
+
})), "@foldkit/ui/listbox/shared.js#anonymous~18"));
|
|
402
403
|
export const makeView = (behavior) => {
|
|
403
404
|
const impl = defineView((model, viewInputs) => {
|
|
404
405
|
const h = html();
|
|
405
406
|
const { id, isOpen, orientation, animation: { transitionState }, maybeActiveItemIndex, searchQuery, maybeLastButtonPointerType, } = model;
|
|
406
407
|
const { items, itemToConfig, isItemDisabled, isButtonDisabled, buttonContent, buttonClassName, buttonAttributes = [], itemsClassName, itemsAttributes = [], itemsScrollClassName, itemsScrollAttributes = [], backdropClassName, backdropAttributes = [], className, attributes = [], itemGroupKey, groupToHeading, groupClassName, groupAttributes = [], separatorClassName, separatorAttributes = [], anchor = {}, name, form, isDisabled, isInvalid, ariaLabel, ariaLabelledBy, selectedValues, } = viewInputs;
|
|
407
|
-
const itemToValue = viewInputs.itemToValue ?? ((item) => String(item));
|
|
408
|
-
const isValueSelected = (itemValue) => Array.contains(selectedValues, itemValue);
|
|
409
|
-
const itemToSearchText = viewInputs.itemToSearchText ?? ((item) => itemToValue(item));
|
|
408
|
+
const itemToValue = viewInputs.itemToValue ?? ((item) => __foldkitBrandViewResult((String(item)), "@foldkit/ui/listbox/shared.js#anonymous~23"));
|
|
409
|
+
const isValueSelected = (itemValue) => __foldkitBrandViewResult((Array.contains(selectedValues, itemValue)), "@foldkit/ui/listbox/shared.js#isValueSelected");
|
|
410
|
+
const itemToSearchText = viewInputs.itemToSearchText ?? ((item) => __foldkitBrandViewResult((itemToValue(item)), "@foldkit/ui/listbox/shared.js#anonymous~24"));
|
|
410
411
|
const isLeaving = transitionState === 'LeaveStart' || transitionState === 'LeaveAnimating';
|
|
411
412
|
const isVisible = isOpen || isLeaving;
|
|
412
|
-
const animationAttributes = M.value(transitionState).pipe(M.when('EnterStart', () => [
|
|
413
|
+
const animationAttributes = M.value(transitionState).pipe(M.when('EnterStart', () => __foldkitBrandViewResult(([
|
|
413
414
|
h.DataAttribute('closed', ''),
|
|
414
415
|
h.DataAttribute('enter', ''),
|
|
415
416
|
h.DataAttribute('transition', ''),
|
|
416
|
-
]), M.when('EnterAnimating', () => [
|
|
417
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~25")), M.when('EnterAnimating', () => __foldkitBrandViewResult(([
|
|
417
418
|
h.DataAttribute('enter', ''),
|
|
418
419
|
h.DataAttribute('transition', ''),
|
|
419
|
-
]), M.when('LeaveStart', () => [
|
|
420
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~26")), M.when('LeaveStart', () => __foldkitBrandViewResult(([
|
|
420
421
|
h.DataAttribute('leave', ''),
|
|
421
422
|
h.DataAttribute('transition', ''),
|
|
422
|
-
]), M.when('LeaveAnimating', () => [
|
|
423
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~27")), M.when('LeaveAnimating', () => __foldkitBrandViewResult(([
|
|
423
424
|
h.DataAttribute('closed', ''),
|
|
424
425
|
h.DataAttribute('leave', ''),
|
|
425
426
|
h.DataAttribute('transition', ''),
|
|
426
|
-
]), M.orElse(() => []));
|
|
427
|
-
const isItemDisabledByIndex = (index) => Predicate.isNotUndefined(isItemDisabled) &&
|
|
428
|
-
pipe(items, Array.get(index), Option.exists(item => isItemDisabled(item, index)));
|
|
427
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~28")), M.orElse(() => __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#anonymous~29")));
|
|
428
|
+
const isItemDisabledByIndex = (index) => __foldkitBrandViewResult((Predicate.isNotUndefined(isItemDisabled) &&
|
|
429
|
+
pipe(items, Array.get(index), Option.exists(item => __foldkitBrandViewResult((isItemDisabled(item, index)), "@foldkit/ui/listbox/shared.js#anonymous~30")))), "@foldkit/ui/listbox/shared.js#isItemDisabledByIndex");
|
|
429
430
|
const isButtonEffectivelyDisabled = isDisabled || isButtonDisabled;
|
|
430
431
|
const nextKey = orientation === 'Horizontal' ? 'ArrowRight' : 'ArrowDown';
|
|
431
432
|
const previousKey = orientation === 'Horizontal' ? 'ArrowLeft' : 'ArrowUp';
|
|
@@ -437,58 +438,58 @@ export const makeView = (behavior) => {
|
|
|
437
438
|
'PageUp',
|
|
438
439
|
'PageDown',
|
|
439
440
|
];
|
|
440
|
-
const isNavigationKey = (key) => Array.contains(navigationKeys, key);
|
|
441
|
+
const isNavigationKey = (key) => __foldkitBrandViewResult((Array.contains(navigationKeys, key)), "@foldkit/ui/listbox/shared.js#isNavigationKey");
|
|
441
442
|
const firstEnabledIndex = findFirstEnabledIndex(items.length, 0, isItemDisabledByIndex)(0, 1);
|
|
442
443
|
const lastEnabledIndex = findFirstEnabledIndex(items.length, 0, isItemDisabledByIndex)(items.length - 1, -1);
|
|
443
|
-
const selectedItemIndex = pipe(selectedValues, Array.head, Option.flatMap(selectedValue => Array.findFirstIndex(items, item => itemToValue(item) === selectedValue)));
|
|
444
|
+
const selectedItemIndex = pipe(selectedValues, Array.head, Option.flatMap(selectedValue => __foldkitBrandViewResult((Array.findFirstIndex(items, item => __foldkitBrandViewResult((itemToValue(item) === selectedValue), "@foldkit/ui/listbox/shared.js#anonymous~32"))), "@foldkit/ui/listbox/shared.js#anonymous~31")));
|
|
444
445
|
const handleButtonKeyDown = (key) => {
|
|
445
446
|
if (isOpen) {
|
|
446
|
-
return handleItemsKeyDown(key);
|
|
447
|
+
return __foldkitBrandViewResult((handleItemsKeyDown(key)), "@foldkit/ui/listbox/shared.js#handleButtonKeyDown");
|
|
447
448
|
}
|
|
448
|
-
return M.value(key).pipe(M.whenOr('Enter', ' ', 'ArrowDown', () => Option.some(Opened({
|
|
449
|
-
maybeActiveItemIndex: Option.orElse(selectedItemIndex, () => Option.some(firstEnabledIndex)),
|
|
450
|
-
}))), M.when('ArrowUp', () => Option.some(Opened({
|
|
451
|
-
maybeActiveItemIndex: Option.orElse(selectedItemIndex, () => Option.some(lastEnabledIndex)),
|
|
452
|
-
}))), M.orElse(() => Option.none()));
|
|
449
|
+
return __foldkitBrandViewResult((M.value(key).pipe(M.whenOr('Enter', ' ', 'ArrowDown', () => __foldkitBrandViewResult((Option.some(Opened({
|
|
450
|
+
maybeActiveItemIndex: Option.orElse(selectedItemIndex, () => __foldkitBrandViewResult((Option.some(firstEnabledIndex)), "@foldkit/ui/listbox/shared.js#anonymous~34")),
|
|
451
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~33")), M.when('ArrowUp', () => __foldkitBrandViewResult((Option.some(Opened({
|
|
452
|
+
maybeActiveItemIndex: Option.orElse(selectedItemIndex, () => __foldkitBrandViewResult((Option.some(lastEnabledIndex)), "@foldkit/ui/listbox/shared.js#anonymous~36")),
|
|
453
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~35")), M.orElse(() => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#anonymous~37")))), "@foldkit/ui/listbox/shared.js#handleButtonKeyDown");
|
|
453
454
|
};
|
|
454
|
-
const handleButtonPointerDown = (pointerType, button) => Option.some(PressedPointerOnButton({ pointerType, button }));
|
|
455
|
+
const handleButtonPointerDown = (pointerType, button) => __foldkitBrandViewResult((Option.some(PressedPointerOnButton({ pointerType, button }))), "@foldkit/ui/listbox/shared.js#handleButtonPointerDown");
|
|
455
456
|
const handleButtonClick = () => {
|
|
456
|
-
const isMouse = Option.exists(maybeLastButtonPointerType, type => type === 'mouse');
|
|
457
|
+
const isMouse = Option.exists(maybeLastButtonPointerType, type => __foldkitBrandViewResult((type === 'mouse'), "@foldkit/ui/listbox/shared.js#anonymous~38"));
|
|
457
458
|
if (isMouse) {
|
|
458
|
-
return IgnoredMouseClick();
|
|
459
|
+
return __foldkitBrandViewResult((IgnoredMouseClick()), "@foldkit/ui/listbox/shared.js#handleButtonClick");
|
|
459
460
|
}
|
|
460
461
|
else if (isOpen) {
|
|
461
|
-
return Closed();
|
|
462
|
+
return __foldkitBrandViewResult((Closed()), "@foldkit/ui/listbox/shared.js#handleButtonClick");
|
|
462
463
|
}
|
|
463
464
|
else {
|
|
464
|
-
return Opened({ maybeActiveItemIndex: Option.none() });
|
|
465
|
+
return __foldkitBrandViewResult((Opened({ maybeActiveItemIndex: Option.none() })), "@foldkit/ui/listbox/shared.js#handleButtonClick");
|
|
465
466
|
}
|
|
466
467
|
};
|
|
467
|
-
const handleSpaceKeyUp = (key) => OptionExt.when(key === ' ', SuppressedSpaceScroll());
|
|
468
|
-
const resolveActiveIndex = (key) => Option.match(maybeActiveItemIndex, {
|
|
469
|
-
onNone: () => M.value(key).pipe(M.whenOr(previousKey, 'End', 'PageDown', () => lastEnabledIndex), M.orElse(() => firstEnabledIndex)),
|
|
470
|
-
onSome: activeIndex => keyToIndex(nextKey, previousKey, items.length, activeIndex, isItemDisabledByIndex)(key),
|
|
471
|
-
});
|
|
468
|
+
const handleSpaceKeyUp = (key) => __foldkitBrandViewResult((OptionExt.when(key === ' ', SuppressedSpaceScroll())), "@foldkit/ui/listbox/shared.js#handleSpaceKeyUp");
|
|
469
|
+
const resolveActiveIndex = (key) => __foldkitBrandViewResult((Option.match(maybeActiveItemIndex, {
|
|
470
|
+
onNone: () => __foldkitBrandViewResult((M.value(key).pipe(M.whenOr(previousKey, 'End', 'PageDown', () => __foldkitBrandViewResult((lastEnabledIndex), "@foldkit/ui/listbox/shared.js#anonymous~39")), M.orElse(() => __foldkitBrandViewResult((firstEnabledIndex), "@foldkit/ui/listbox/shared.js#anonymous~40")))), "@foldkit/ui/listbox/shared.js#onNone~3"),
|
|
471
|
+
onSome: activeIndex => __foldkitBrandViewResult((keyToIndex(nextKey, previousKey, items.length, activeIndex, isItemDisabledByIndex)(key)), "@foldkit/ui/listbox/shared.js#onSome~2"),
|
|
472
|
+
})), "@foldkit/ui/listbox/shared.js#resolveActiveIndex");
|
|
472
473
|
const searchForKey = (key) => {
|
|
473
474
|
const nextQuery = searchQuery + key;
|
|
474
475
|
const maybeTargetIndex = resolveTypeaheadMatch(items, nextQuery, maybeActiveItemIndex, isItemDisabledByIndex, itemToSearchText, Str.isNonEmpty(searchQuery));
|
|
475
|
-
return Option.some(Searched({ key, maybeTargetIndex }));
|
|
476
|
+
return __foldkitBrandViewResult((Option.some(Searched({ key, maybeTargetIndex }))), "@foldkit/ui/listbox/shared.js#searchForKey");
|
|
476
477
|
};
|
|
477
|
-
const handleItemsKeyDown = (key) => M.value(key).pipe(M.when('Escape', () => Option.some(Closed())), M.when('Enter', () => Option.map(maybeActiveItemIndex, index => RequestedItemClick({ index }))), M.when(' ', () => Str.isNonEmpty(searchQuery)
|
|
478
|
+
const handleItemsKeyDown = (key) => __foldkitBrandViewResult((M.value(key).pipe(M.when('Escape', () => __foldkitBrandViewResult((Option.some(Closed())), "@foldkit/ui/listbox/shared.js#anonymous~41")), M.when('Enter', () => __foldkitBrandViewResult((Option.map(maybeActiveItemIndex, index => __foldkitBrandViewResult((RequestedItemClick({ index })), "@foldkit/ui/listbox/shared.js#anonymous~43"))), "@foldkit/ui/listbox/shared.js#anonymous~42")), M.when(' ', () => __foldkitBrandViewResult((Str.isNonEmpty(searchQuery)
|
|
478
479
|
? searchForKey(' ')
|
|
479
|
-
: Option.map(maybeActiveItemIndex, index => RequestedItemClick({ index }))), M.when(isNavigationKey, () => Option.some(ActivatedItem({
|
|
480
|
+
: Option.map(maybeActiveItemIndex, index => __foldkitBrandViewResult((RequestedItemClick({ index })), "@foldkit/ui/listbox/shared.js#anonymous~45"))), "@foldkit/ui/listbox/shared.js#anonymous~44")), M.when(isNavigationKey, () => __foldkitBrandViewResult((Option.some(ActivatedItem({
|
|
480
481
|
index: resolveActiveIndex(key),
|
|
481
482
|
activationTrigger: 'Keyboard',
|
|
482
|
-
}))), M.when(isPrintableKey, () => searchForKey(key)), M.orElse(() => Option.none()));
|
|
483
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~46")), M.when(isPrintableKey, () => __foldkitBrandViewResult((searchForKey(key)), "@foldkit/ui/listbox/shared.js#anonymous~47")), M.orElse(() => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#anonymous~48")))), "@foldkit/ui/listbox/shared.js#handleItemsKeyDown");
|
|
483
484
|
const resolveButtonLabel = () => {
|
|
484
485
|
if (Predicate.isNotUndefined(ariaLabel)) {
|
|
485
|
-
return [h.AriaLabel(ariaLabel)];
|
|
486
|
+
return __foldkitBrandViewResult(([h.AriaLabel(ariaLabel)]), "@foldkit/ui/listbox/shared.js#resolveButtonLabel");
|
|
486
487
|
}
|
|
487
488
|
else if (Predicate.isNotUndefined(ariaLabelledBy)) {
|
|
488
|
-
return [h.AriaLabelledBy(ariaLabelledBy)];
|
|
489
|
+
return __foldkitBrandViewResult(([h.AriaLabelledBy(ariaLabelledBy)]), "@foldkit/ui/listbox/shared.js#resolveButtonLabel");
|
|
489
490
|
}
|
|
490
491
|
else {
|
|
491
|
-
return [];
|
|
492
|
+
return __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#resolveButtonLabel");
|
|
492
493
|
}
|
|
493
494
|
};
|
|
494
495
|
const buttonLabelAttributes = resolveButtonLabel();
|
|
@@ -518,8 +519,8 @@ export const makeView = (behavior) => {
|
|
|
518
519
|
...buttonAttributes,
|
|
519
520
|
];
|
|
520
521
|
const maybeActiveDescendant = Option.match(maybeActiveItemIndex, {
|
|
521
|
-
onNone: () => [],
|
|
522
|
-
onSome: index => [h.AriaActiveDescendant(itemId(id, index))],
|
|
522
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#onNone~4"),
|
|
523
|
+
onSome: index => __foldkitBrandViewResult(([h.AriaActiveDescendant(itemId(id, index))]), "@foldkit/ui/listbox/shared.js#onSome~3"),
|
|
523
524
|
});
|
|
524
525
|
const anchorAttributes = [
|
|
525
526
|
h.Style({
|
|
@@ -550,7 +551,7 @@ export const makeView = (behavior) => {
|
|
|
550
551
|
...itemsAttributes,
|
|
551
552
|
];
|
|
552
553
|
const listboxItems = Array.map(items, (item, index) => {
|
|
553
|
-
const isActiveItem = Option.exists(maybeActiveItemIndex, activeIndex => activeIndex === index);
|
|
554
|
+
const isActiveItem = Option.exists(maybeActiveItemIndex, activeIndex => __foldkitBrandViewResult((activeIndex === index), "@foldkit/ui/listbox/shared.js#anonymous~50"));
|
|
554
555
|
const isDisabledItem = isItemDisabledByIndex(index);
|
|
555
556
|
const isSelectedItem = isValueSelected(itemToValue(item));
|
|
556
557
|
const itemConfig = itemToConfig(item, {
|
|
@@ -559,7 +560,7 @@ export const makeView = (behavior) => {
|
|
|
559
560
|
isSelected: isSelectedItem,
|
|
560
561
|
});
|
|
561
562
|
const isInteractive = !isDisabledItem && !isLeaving;
|
|
562
|
-
return h.keyed('div')(itemId(id, index), [
|
|
563
|
+
return __foldkitBrandViewResult((h.keyed('div')(itemId(id, index), [
|
|
563
564
|
h.Id(itemId(id, index)),
|
|
564
565
|
h.Role('option'),
|
|
565
566
|
h.AriaSelected(isSelectedItem),
|
|
@@ -574,38 +575,38 @@ export const makeView = (behavior) => {
|
|
|
574
575
|
...(isActiveItem
|
|
575
576
|
? []
|
|
576
577
|
: [
|
|
577
|
-
h.OnPointerMove((screenX, screenY, pointerType) => OptionExt.when(pointerType !== 'touch', MovedPointerOverItem({
|
|
578
|
+
h.OnPointerMove((screenX, screenY, pointerType) => __foldkitBrandViewResult((OptionExt.when(pointerType !== 'touch', MovedPointerOverItem({
|
|
578
579
|
index,
|
|
579
580
|
screenX,
|
|
580
581
|
screenY,
|
|
581
|
-
}))),
|
|
582
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~51")),
|
|
582
583
|
]),
|
|
583
|
-
h.OnPointerLeave(pointerType => OptionExt.when(pointerType !== 'touch', DeactivatedItem())),
|
|
584
|
+
h.OnPointerLeave(pointerType => __foldkitBrandViewResult((OptionExt.when(pointerType !== 'touch', DeactivatedItem())), "@foldkit/ui/listbox/shared.js#anonymous~52")),
|
|
584
585
|
]
|
|
585
586
|
: []),
|
|
586
587
|
...(itemConfig.className ? [h.Class(itemConfig.className)] : []),
|
|
587
|
-
], [itemConfig.content]);
|
|
588
|
+
], [itemConfig.content])), "@foldkit/ui/listbox/shared.js#anonymous~49");
|
|
588
589
|
});
|
|
589
590
|
const renderGroupedItems = () => {
|
|
590
591
|
if (!itemGroupKey) {
|
|
591
|
-
return listboxItems;
|
|
592
|
+
return __foldkitBrandViewResult((listboxItems), "@foldkit/ui/listbox/shared.js#renderGroupedItems");
|
|
592
593
|
}
|
|
593
|
-
const segments = groupContiguous(listboxItems, (_, index) => Array.get(items, index).pipe(Option.match({
|
|
594
|
-
onNone: () => '',
|
|
595
|
-
onSome: item => itemGroupKey(item, index),
|
|
596
|
-
})));
|
|
597
|
-
return Array.flatMap(segments, (segment, segmentIndex) => {
|
|
594
|
+
const segments = groupContiguous(listboxItems, (_, index) => __foldkitBrandViewResult((Array.get(items, index).pipe(Option.match({
|
|
595
|
+
onNone: () => __foldkitBrandViewResult((''), "@foldkit/ui/listbox/shared.js#onNone~5"),
|
|
596
|
+
onSome: item => __foldkitBrandViewResult((itemGroupKey(item, index)), "@foldkit/ui/listbox/shared.js#onSome~4"),
|
|
597
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~53"));
|
|
598
|
+
return __foldkitBrandViewResult((Array.flatMap(segments, (segment, segmentIndex) => {
|
|
598
599
|
const maybeHeading = Option.fromNullishOr(groupToHeading?.(segment.key));
|
|
599
600
|
const headingId = `${id}-heading-${segment.key}`;
|
|
600
601
|
const headingElement = Option.match(maybeHeading, {
|
|
601
|
-
onNone: () => [],
|
|
602
|
-
onSome: heading => [
|
|
602
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#onNone~6"),
|
|
603
|
+
onSome: heading => __foldkitBrandViewResult(([
|
|
603
604
|
h.keyed('div')(headingId, [
|
|
604
605
|
h.Id(headingId),
|
|
605
606
|
h.Role('presentation'),
|
|
606
607
|
...(heading.className ? [h.Class(heading.className)] : []),
|
|
607
608
|
], [heading.content]),
|
|
608
|
-
],
|
|
609
|
+
]), "@foldkit/ui/listbox/shared.js#onSome~5"),
|
|
609
610
|
});
|
|
610
611
|
const groupContent = [...headingElement, ...segment.items];
|
|
611
612
|
const groupElement = h.keyed('div')(`${id}-group-${segment.key}`, [
|
|
@@ -629,8 +630,8 @@ export const makeView = (behavior) => {
|
|
|
629
630
|
], []),
|
|
630
631
|
]
|
|
631
632
|
: [];
|
|
632
|
-
return [...separator, groupElement];
|
|
633
|
-
});
|
|
633
|
+
return __foldkitBrandViewResult(([...separator, groupElement]), "@foldkit/ui/listbox/shared.js#anonymous~54");
|
|
634
|
+
})), "@foldkit/ui/listbox/shared.js#renderGroupedItems");
|
|
634
635
|
};
|
|
635
636
|
const backdrop = h.keyed('div')(`${id}-backdrop`, [
|
|
636
637
|
h.OnMount(PortalListboxBackdrop()),
|
|
@@ -657,15 +658,15 @@ export const makeView = (behavior) => {
|
|
|
657
658
|
const formAttribute = form ? [h.Attribute('form', form)] : [];
|
|
658
659
|
const hiddenInputs = name
|
|
659
660
|
? Array.match(selectedValues, {
|
|
660
|
-
onEmpty: () => [
|
|
661
|
+
onEmpty: () => __foldkitBrandViewResult(([
|
|
661
662
|
h.input([h.Type('hidden'), h.Name(name), ...formAttribute]),
|
|
662
|
-
],
|
|
663
|
-
onNonEmpty: Array.map(selectedValue => h.input([
|
|
663
|
+
]), "@foldkit/ui/listbox/shared.js#onEmpty"),
|
|
664
|
+
onNonEmpty: Array.map(selectedValue => __foldkitBrandViewResult((h.input([
|
|
664
665
|
h.Type('hidden'),
|
|
665
666
|
h.Name(name),
|
|
666
667
|
h.Value(selectedValue),
|
|
667
668
|
...formAttribute,
|
|
668
|
-
])),
|
|
669
|
+
])), "@foldkit/ui/listbox/shared.js#anonymous~55")),
|
|
669
670
|
})
|
|
670
671
|
: [];
|
|
671
672
|
const wrapperAttributes = [
|
|
@@ -675,15 +676,15 @@ export const makeView = (behavior) => {
|
|
|
675
676
|
...(isDisabled ? [h.DataAttribute('disabled', '')] : []),
|
|
676
677
|
...(isInvalid ? [h.DataAttribute('invalid', '')] : []),
|
|
677
678
|
];
|
|
678
|
-
return h.div(wrapperAttributes, [
|
|
679
|
+
return __foldkitBrandViewResult((h.div(wrapperAttributes, [
|
|
679
680
|
h.keyed('button')(`${id}-button`, resolvedButtonAttributes, [
|
|
680
681
|
buttonContent,
|
|
681
682
|
]),
|
|
682
683
|
...hiddenInputs,
|
|
683
684
|
...(isVisible ? visibleContent : []),
|
|
684
|
-
]);
|
|
685
|
+
])), "@foldkit/ui/listbox/shared.js#anonymous~22");
|
|
685
686
|
});
|
|
686
|
-
return () =>
|
|
687
|
+
return __foldkitBrandViewResult((() =>
|
|
687
688
|
/* eslint-disable-next-line @typescript-eslint/consistent-type-assertions */
|
|
688
|
-
impl;
|
|
689
|
+
__foldkitBrandViewResult((impl), "@foldkit/ui/listbox/shared.js#anonymous~56")), "@foldkit/ui/listbox/shared.js#makeView");
|
|
689
690
|
};
|