@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/menu/index.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';
|
|
@@ -162,7 +163,7 @@ const LEFT_MOUSE_BUTTON = 0;
|
|
|
162
163
|
const POINTER_HOLD_THRESHOLD_MILLISECONDS = 200;
|
|
163
164
|
const POINTER_MOVEMENT_THRESHOLD_PIXELS = 5;
|
|
164
165
|
/** Creates an initial menu model from a config. Defaults to closed with no active item. */
|
|
165
|
-
export const init = (config) => ({
|
|
166
|
+
export const init = (config) => (__foldkitBrandViewResult(({
|
|
166
167
|
id: config.id,
|
|
167
168
|
isOpen: false,
|
|
168
169
|
isAnimated: config.isAnimated ?? false,
|
|
@@ -175,63 +176,63 @@ export const init = (config) => ({
|
|
|
175
176
|
maybeLastPointerPosition: Option.none(),
|
|
176
177
|
maybeLastButtonPointerType: Option.none(),
|
|
177
178
|
maybePointerOrigin: Option.none(),
|
|
178
|
-
});
|
|
179
|
+
}), "@foldkit/ui/menu/index.js#init"));
|
|
179
180
|
// UPDATE
|
|
180
|
-
const closedModel = (model) => evo(model, {
|
|
181
|
-
isOpen: () => false,
|
|
182
|
-
maybeActiveItemIndex: () => Option.none(),
|
|
183
|
-
searchQuery: () => '',
|
|
184
|
-
searchVersion: () => 0,
|
|
185
|
-
maybeLastPointerPosition: () => Option.none(),
|
|
186
|
-
maybeLastButtonPointerType: () => Option.none(),
|
|
187
|
-
maybePointerOrigin: () => Option.none(),
|
|
188
|
-
});
|
|
181
|
+
const closedModel = (model) => __foldkitBrandViewResult((evo(model, {
|
|
182
|
+
isOpen: () => __foldkitBrandViewResult((false), "@foldkit/ui/menu/index.js#isOpen"),
|
|
183
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeActiveItemIndex"),
|
|
184
|
+
searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/menu/index.js#searchQuery"),
|
|
185
|
+
searchVersion: () => __foldkitBrandViewResult((0), "@foldkit/ui/menu/index.js#searchVersion"),
|
|
186
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeLastPointerPosition"),
|
|
187
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeLastButtonPointerType"),
|
|
188
|
+
maybePointerOrigin: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybePointerOrigin"),
|
|
189
|
+
})), "@foldkit/ui/menu/index.js#closedModel");
|
|
189
190
|
/** Returns the bare DOM id of the menu trigger button, derived from the
|
|
190
191
|
* menu's base id. Use this to associate an external label with the trigger
|
|
191
192
|
* via a native `<label for={Menu.buttonId(id)}>` or an `aria-labelledby`
|
|
192
193
|
* reference. */
|
|
193
|
-
export const buttonId = (id) => `${id}-button
|
|
194
|
-
const buttonSelector = (id) => idSelector(`${id}-button`);
|
|
195
|
-
const itemsSelector = (id) => idSelector(`${id}-items`);
|
|
196
|
-
const itemSelector = (id, index) => idSelector(`${id}-item-${index}`);
|
|
194
|
+
export const buttonId = (id) => __foldkitBrandViewResult((`${id}-button`), "@foldkit/ui/menu/index.js#buttonId");
|
|
195
|
+
const buttonSelector = (id) => __foldkitBrandViewResult((idSelector(`${id}-button`)), "@foldkit/ui/menu/index.js#buttonSelector");
|
|
196
|
+
const itemsSelector = (id) => __foldkitBrandViewResult((idSelector(`${id}-items`)), "@foldkit/ui/menu/index.js#itemsSelector");
|
|
197
|
+
const itemSelector = (id, index) => __foldkitBrandViewResult((idSelector(`${id}-item-${index}`)), "@foldkit/ui/menu/index.js#itemSelector");
|
|
197
198
|
const withUpdateReturn = M.withReturnType();
|
|
198
199
|
/** Prevents page scrolling while the menu is open. */
|
|
199
200
|
export const LockScroll = Command.define('LockScroll', CompletedLockScroll)(Dom.lockScroll.pipe(Effect.as(CompletedLockScroll())));
|
|
200
201
|
/** Re-enables page scrolling after the menu closes. */
|
|
201
202
|
export const UnlockScroll = Command.define('UnlockScroll', CompletedUnlockScroll)(Dom.unlockScroll.pipe(Effect.as(CompletedUnlockScroll())));
|
|
202
203
|
/** Marks all elements outside the menu as inert for modal behavior. */
|
|
203
|
-
export const InertOthers = Command.define('InertOthers', { id: S.String }, CompletedInertOthers)(({ id }) => Dom.inertOthers(id, [buttonSelector(id), itemsSelector(id)]).pipe(Effect.as(CompletedInertOthers())));
|
|
204
|
+
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/menu/index.js#anonymous"));
|
|
204
205
|
/** Removes the inert attribute from elements outside the menu. */
|
|
205
|
-
export const RestoreInert = Command.define('RestoreInert', { id: S.String }, CompletedRestoreInert)(({ id }) => Dom.restoreInert(id).pipe(Effect.as(CompletedRestoreInert())));
|
|
206
|
+
export const RestoreInert = Command.define('RestoreInert', { id: S.String }, CompletedRestoreInert)(({ id }) => __foldkitBrandViewResult((Dom.restoreInert(id).pipe(Effect.as(CompletedRestoreInert()))), "@foldkit/ui/menu/index.js#anonymous~2"));
|
|
206
207
|
/** Moves focus to the menu items container after opening. */
|
|
207
|
-
export const FocusItems = Command.define('FocusItems', { id: S.String }, CompletedFocusItems)(({ id }) => Dom.focus(itemsSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusItems())));
|
|
208
|
+
export const FocusItems = Command.define('FocusItems', { id: S.String }, CompletedFocusItems)(({ id }) => __foldkitBrandViewResult((Dom.focus(itemsSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusItems()))), "@foldkit/ui/menu/index.js#anonymous~3"));
|
|
208
209
|
/** Moves focus back to the menu button after closing. */
|
|
209
|
-
export const FocusButton = Command.define('FocusButton', { id: S.String }, CompletedFocusButton)(({ id }) => Dom.focus(buttonSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton())));
|
|
210
|
+
export const FocusButton = Command.define('FocusButton', { id: S.String }, CompletedFocusButton)(({ id }) => __foldkitBrandViewResult((Dom.focus(buttonSelector(id)).pipe(Effect.ignore, Effect.as(CompletedFocusButton()))), "@foldkit/ui/menu/index.js#anonymous~4"));
|
|
210
211
|
/** Scrolls the active menu item into view after keyboard navigation. */
|
|
211
|
-
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())));
|
|
212
|
+
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/menu/index.js#anonymous~5"));
|
|
212
213
|
/** Programmatically clicks the active menu item's DOM element. */
|
|
213
|
-
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())));
|
|
214
|
+
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/menu/index.js#anonymous~6"));
|
|
214
215
|
/** Waits for the typeahead search debounce period before clearing the query. */
|
|
215
|
-
export const DelayClearSearch = Command.define('DelayClearSearch', { version: S.Number }, ClearedSearch)(({ version }) => Effect.sleep(SEARCH_DEBOUNCE_MILLISECONDS).pipe(Effect.as(ClearedSearch({ version }))));
|
|
216
|
+
export const DelayClearSearch = Command.define('DelayClearSearch', { version: S.Number }, ClearedSearch)(({ version }) => __foldkitBrandViewResult((Effect.sleep(SEARCH_DEBOUNCE_MILLISECONDS).pipe(Effect.as(ClearedSearch({ version })))), "@foldkit/ui/menu/index.js#anonymous~7"));
|
|
216
217
|
/** Detects whether the menu button moved or the leave animation ended. Whichever comes first; both outcomes signal the Animation submodel that leave is complete. */
|
|
217
|
-
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() })))));
|
|
218
|
+
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/menu/index.js#anonymous~8"));
|
|
218
219
|
const delegateToAnimation = (model, animationMessage) => {
|
|
219
220
|
const [nextAnimation, animationCommands, maybeOutMessage] = animationUpdate(model.animation, animationMessage);
|
|
220
|
-
const mappedCommands = Command.mapMessages(animationCommands, message => GotAnimationMessage({ message }));
|
|
221
|
+
const mappedCommands = Command.mapMessages(animationCommands, message => __foldkitBrandViewResult((GotAnimationMessage({ message })), "@foldkit/ui/menu/index.js#anonymous~9"));
|
|
221
222
|
const additionalCommands = Option.match(maybeOutMessage, {
|
|
222
|
-
onNone: () => [],
|
|
223
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/menu/index.js#onNone"),
|
|
223
224
|
onSome: M.type().pipe(M.tagsExhaustive({
|
|
224
|
-
StartedLeaveAnimating: () => [
|
|
225
|
+
StartedLeaveAnimating: () => __foldkitBrandViewResult(([
|
|
225
226
|
DetectMovementOrAnimationEnd({ id: model.id }),
|
|
226
|
-
],
|
|
227
|
-
TransitionedOut: () => [],
|
|
227
|
+
]), "@foldkit/ui/menu/index.js#StartedLeaveAnimating"),
|
|
228
|
+
TransitionedOut: () => __foldkitBrandViewResult(([]), "@foldkit/ui/menu/index.js#TransitionedOut"),
|
|
228
229
|
})),
|
|
229
230
|
});
|
|
230
|
-
return [
|
|
231
|
-
evo(model, { animation: () => nextAnimation }),
|
|
231
|
+
return __foldkitBrandViewResult(([
|
|
232
|
+
evo(model, { animation: () => __foldkitBrandViewResult((nextAnimation), "@foldkit/ui/menu/index.js#animation") }),
|
|
232
233
|
[...mappedCommands, ...additionalCommands],
|
|
233
234
|
Option.none(),
|
|
234
|
-
];
|
|
235
|
+
]), "@foldkit/ui/menu/index.js#delegateToAnimation");
|
|
235
236
|
};
|
|
236
237
|
/** Processes a menu message and returns the next model and commands. */
|
|
237
238
|
export const update = (model, message) => {
|
|
@@ -254,139 +255,139 @@ export const update = (model, message) => {
|
|
|
254
255
|
const openMenu = (baseModel) => {
|
|
255
256
|
if (model.isAnimated) {
|
|
256
257
|
const [nextModel, animationCommands] = delegateToAnimation(baseModel, AnimationShowed());
|
|
257
|
-
return [
|
|
258
|
-
evo(nextModel, { isOpen: () => true }),
|
|
258
|
+
return __foldkitBrandViewResult(([
|
|
259
|
+
evo(nextModel, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/menu/index.js#isOpen~2") }),
|
|
259
260
|
[...openCommands, ...animationCommands],
|
|
260
261
|
Option.none(),
|
|
261
|
-
];
|
|
262
|
+
]), "@foldkit/ui/menu/index.js#openMenu");
|
|
262
263
|
}
|
|
263
|
-
return [evo(baseModel, { isOpen: () => true }), openCommands, Option.none()];
|
|
264
|
+
return __foldkitBrandViewResult(([evo(baseModel, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/menu/index.js#isOpen~3") }), openCommands, Option.none()]), "@foldkit/ui/menu/index.js#openMenu");
|
|
264
265
|
};
|
|
265
266
|
const closeMenu = (baseModel, commands, maybeOutMessage = Option.none()) => {
|
|
266
267
|
const closed = closedModel(baseModel);
|
|
267
268
|
if (model.isAnimated) {
|
|
268
269
|
const [nextModel, animationCommands] = delegateToAnimation(closed, AnimationHid());
|
|
269
|
-
return [nextModel, [...commands, ...animationCommands], maybeOutMessage];
|
|
270
|
+
return __foldkitBrandViewResult(([nextModel, [...commands, ...animationCommands], maybeOutMessage]), "@foldkit/ui/menu/index.js#closeMenu");
|
|
270
271
|
}
|
|
271
|
-
return [closed, commands, maybeOutMessage];
|
|
272
|
+
return __foldkitBrandViewResult(([closed, commands, maybeOutMessage]), "@foldkit/ui/menu/index.js#closeMenu");
|
|
272
273
|
};
|
|
273
|
-
return M.value(message).pipe(withUpdateReturn, M.tag('CompletedFocusItems', 'CompletedFocusButton', 'CompletedLockScroll', 'CompletedUnlockScroll', 'CompletedInertOthers', 'CompletedRestoreInert', 'CompletedScrollIntoView', 'CompletedClickItem', 'SuppressedSpaceScroll', 'CompletedAnchorMenu', 'CompletedPortalMenuBackdrop', () => [model, [], Option.none()]), M.tagsExhaustive({
|
|
274
|
-
Opened: ({ maybeActiveItemIndex }) => openMenu(evo(model, {
|
|
275
|
-
maybeActiveItemIndex: () => maybeActiveItemIndex,
|
|
276
|
-
activationTrigger: () => Option.match(maybeActiveItemIndex, {
|
|
277
|
-
onNone: () => 'Pointer',
|
|
278
|
-
onSome: () => 'Keyboard',
|
|
279
|
-
}),
|
|
280
|
-
searchQuery: () => '',
|
|
281
|
-
searchVersion: () => 0,
|
|
282
|
-
maybeLastPointerPosition: () => Option.none(),
|
|
283
|
-
})),
|
|
284
|
-
Closed: () => closeMenu(model, closeWithFocusCommands),
|
|
274
|
+
return __foldkitBrandViewResult((M.value(message).pipe(withUpdateReturn, M.tag('CompletedFocusItems', 'CompletedFocusButton', 'CompletedLockScroll', 'CompletedUnlockScroll', 'CompletedInertOthers', 'CompletedRestoreInert', 'CompletedScrollIntoView', 'CompletedClickItem', 'SuppressedSpaceScroll', 'CompletedAnchorMenu', 'CompletedPortalMenuBackdrop', () => __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/menu/index.js#anonymous~10")), M.tagsExhaustive({
|
|
275
|
+
Opened: ({ maybeActiveItemIndex }) => __foldkitBrandViewResult((openMenu(evo(model, {
|
|
276
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((maybeActiveItemIndex), "@foldkit/ui/menu/index.js#maybeActiveItemIndex~2"),
|
|
277
|
+
activationTrigger: () => __foldkitBrandViewResult((Option.match(maybeActiveItemIndex, {
|
|
278
|
+
onNone: () => __foldkitBrandViewResult(('Pointer'), "@foldkit/ui/menu/index.js#onNone~2"),
|
|
279
|
+
onSome: () => __foldkitBrandViewResult(('Keyboard'), "@foldkit/ui/menu/index.js#onSome"),
|
|
280
|
+
})), "@foldkit/ui/menu/index.js#activationTrigger"),
|
|
281
|
+
searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/menu/index.js#searchQuery~2"),
|
|
282
|
+
searchVersion: () => __foldkitBrandViewResult((0), "@foldkit/ui/menu/index.js#searchVersion~2"),
|
|
283
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeLastPointerPosition~2"),
|
|
284
|
+
}))), "@foldkit/ui/menu/index.js#Opened"),
|
|
285
|
+
Closed: () => __foldkitBrandViewResult((closeMenu(model, closeWithFocusCommands)), "@foldkit/ui/menu/index.js#Closed"),
|
|
285
286
|
BlurredItems: () => {
|
|
286
287
|
if (Option.exists(model.maybeLastButtonPointerType, Equal.equals('mouse'))) {
|
|
287
|
-
return [model, [], Option.none()];
|
|
288
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/menu/index.js#BlurredItems");
|
|
288
289
|
}
|
|
289
|
-
return closeMenu(model, closeWithoutFocusCommands);
|
|
290
|
+
return __foldkitBrandViewResult((closeMenu(model, closeWithoutFocusCommands)), "@foldkit/ui/menu/index.js#BlurredItems");
|
|
290
291
|
},
|
|
291
|
-
ActivatedItem: ({ index, activationTrigger }) => [
|
|
292
|
+
ActivatedItem: ({ index, activationTrigger }) => __foldkitBrandViewResult(([
|
|
292
293
|
evo(model, {
|
|
293
|
-
maybeActiveItemIndex: () => Option.some(index),
|
|
294
|
-
activationTrigger: () => activationTrigger,
|
|
294
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.some(index)), "@foldkit/ui/menu/index.js#maybeActiveItemIndex~3"),
|
|
295
|
+
activationTrigger: () => __foldkitBrandViewResult((activationTrigger), "@foldkit/ui/menu/index.js#activationTrigger~2"),
|
|
295
296
|
}),
|
|
296
297
|
activationTrigger === 'Keyboard'
|
|
297
298
|
? [ScrollIntoView({ id: model.id, index })]
|
|
298
299
|
: [],
|
|
299
300
|
Option.none(),
|
|
300
|
-
],
|
|
301
|
+
]), "@foldkit/ui/menu/index.js#ActivatedItem"),
|
|
301
302
|
MovedPointerOverItem: ({ index, screenX, screenY }) => {
|
|
302
|
-
const isSamePosition = Option.exists(model.maybeLastPointerPosition, position => position.screenX === screenX && position.screenY === screenY);
|
|
303
|
+
const isSamePosition = Option.exists(model.maybeLastPointerPosition, position => __foldkitBrandViewResult((position.screenX === screenX && position.screenY === screenY), "@foldkit/ui/menu/index.js#anonymous~11"));
|
|
303
304
|
if (isSamePosition) {
|
|
304
|
-
return [model, [], Option.none()];
|
|
305
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/menu/index.js#MovedPointerOverItem");
|
|
305
306
|
}
|
|
306
|
-
return [
|
|
307
|
+
return __foldkitBrandViewResult(([
|
|
307
308
|
evo(model, {
|
|
308
|
-
maybeActiveItemIndex: () => Option.some(index),
|
|
309
|
-
activationTrigger: () => 'Pointer',
|
|
310
|
-
maybeLastPointerPosition: () => Option.some({ screenX, screenY }),
|
|
309
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.some(index)), "@foldkit/ui/menu/index.js#maybeActiveItemIndex~4"),
|
|
310
|
+
activationTrigger: () => __foldkitBrandViewResult(('Pointer'), "@foldkit/ui/menu/index.js#activationTrigger~3"),
|
|
311
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.some({ screenX, screenY })), "@foldkit/ui/menu/index.js#maybeLastPointerPosition~3"),
|
|
311
312
|
}),
|
|
312
313
|
[],
|
|
313
314
|
Option.none(),
|
|
314
|
-
];
|
|
315
|
+
]), "@foldkit/ui/menu/index.js#MovedPointerOverItem");
|
|
315
316
|
},
|
|
316
|
-
DeactivatedItem: () => model.activationTrigger === 'Pointer'
|
|
317
|
+
DeactivatedItem: () => __foldkitBrandViewResult((model.activationTrigger === 'Pointer'
|
|
317
318
|
? [
|
|
318
|
-
evo(model, { maybeActiveItemIndex: () => Option.none() }),
|
|
319
|
+
evo(model, { maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeActiveItemIndex~5") }),
|
|
319
320
|
[],
|
|
320
321
|
Option.none(),
|
|
321
322
|
]
|
|
322
|
-
: [model, [], Option.none()],
|
|
323
|
-
SelectedItem: ({ index, item }) => closeMenu(model, closeWithFocusCommands, Option.some(Selected({ value: item, index }))),
|
|
324
|
-
RequestedItemClick: ({ index }) => [
|
|
323
|
+
: [model, [], Option.none()]), "@foldkit/ui/menu/index.js#DeactivatedItem"),
|
|
324
|
+
SelectedItem: ({ index, item }) => __foldkitBrandViewResult((closeMenu(model, closeWithFocusCommands, Option.some(Selected({ value: item, index })))), "@foldkit/ui/menu/index.js#SelectedItem"),
|
|
325
|
+
RequestedItemClick: ({ index }) => __foldkitBrandViewResult(([
|
|
325
326
|
model,
|
|
326
327
|
[ClickItem({ id: model.id, index })],
|
|
327
328
|
Option.none(),
|
|
328
|
-
],
|
|
329
|
+
]), "@foldkit/ui/menu/index.js#RequestedItemClick"),
|
|
329
330
|
Searched: ({ key, maybeTargetIndex }) => {
|
|
330
331
|
const nextSearchQuery = model.searchQuery + key;
|
|
331
332
|
const nextSearchVersion = model.searchVersion + 1;
|
|
332
|
-
return [
|
|
333
|
+
return __foldkitBrandViewResult(([
|
|
333
334
|
evo(model, {
|
|
334
|
-
searchQuery: () => nextSearchQuery,
|
|
335
|
-
searchVersion: () => nextSearchVersion,
|
|
336
|
-
maybeActiveItemIndex: () => Option.orElse(maybeTargetIndex, () => model.maybeActiveItemIndex),
|
|
335
|
+
searchQuery: () => __foldkitBrandViewResult((nextSearchQuery), "@foldkit/ui/menu/index.js#searchQuery~3"),
|
|
336
|
+
searchVersion: () => __foldkitBrandViewResult((nextSearchVersion), "@foldkit/ui/menu/index.js#searchVersion~3"),
|
|
337
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.orElse(maybeTargetIndex, () => __foldkitBrandViewResult((model.maybeActiveItemIndex), "@foldkit/ui/menu/index.js#anonymous~12"))), "@foldkit/ui/menu/index.js#maybeActiveItemIndex~6"),
|
|
337
338
|
}),
|
|
338
339
|
[DelayClearSearch({ version: nextSearchVersion })],
|
|
339
340
|
Option.none(),
|
|
340
|
-
];
|
|
341
|
+
]), "@foldkit/ui/menu/index.js#Searched");
|
|
341
342
|
},
|
|
342
343
|
ClearedSearch: ({ version }) => {
|
|
343
344
|
if (version !== model.searchVersion) {
|
|
344
|
-
return [model, [], Option.none()];
|
|
345
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/menu/index.js#ClearedSearch");
|
|
345
346
|
}
|
|
346
|
-
return [evo(model, { searchQuery: () => '' }), [], Option.none()];
|
|
347
|
+
return __foldkitBrandViewResult(([evo(model, { searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/menu/index.js#searchQuery~4") }), [], Option.none()]), "@foldkit/ui/menu/index.js#ClearedSearch");
|
|
347
348
|
},
|
|
348
|
-
GotAnimationMessage: ({ message: animationMessage }) => delegateToAnimation(model, animationMessage),
|
|
349
|
+
GotAnimationMessage: ({ message: animationMessage }) => __foldkitBrandViewResult((delegateToAnimation(model, animationMessage)), "@foldkit/ui/menu/index.js#GotAnimationMessage"),
|
|
349
350
|
PressedPointerOnButton: ({ pointerType, button, screenX, screenY, timeStamp, }) => {
|
|
350
351
|
const withPointerType = evo(model, {
|
|
351
|
-
maybeLastButtonPointerType: () => Option.some(pointerType),
|
|
352
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.some(pointerType)), "@foldkit/ui/menu/index.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/menu/index.js#PressedPointerOnButton");
|
|
355
356
|
}
|
|
356
357
|
if (model.isOpen) {
|
|
357
358
|
const [closed, commands] = closeMenu(withPointerType, closeWithFocusCommands);
|
|
358
|
-
return [
|
|
359
|
+
return __foldkitBrandViewResult(([
|
|
359
360
|
evo(closed, {
|
|
360
|
-
maybeLastButtonPointerType: () => Option.some(pointerType),
|
|
361
|
+
maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.some(pointerType)), "@foldkit/ui/menu/index.js#maybeLastButtonPointerType~3"),
|
|
361
362
|
}),
|
|
362
363
|
commands,
|
|
363
364
|
Option.none(),
|
|
364
|
-
];
|
|
365
|
+
]), "@foldkit/ui/menu/index.js#PressedPointerOnButton");
|
|
365
366
|
}
|
|
366
|
-
return openMenu(evo(withPointerType, {
|
|
367
|
-
maybeActiveItemIndex: () => Option.none(),
|
|
368
|
-
activationTrigger: () => 'Pointer',
|
|
369
|
-
searchQuery: () => '',
|
|
370
|
-
searchVersion: () => 0,
|
|
371
|
-
maybeLastPointerPosition: () => Option.none(),
|
|
372
|
-
maybePointerOrigin: () => Option.some({ screenX, screenY, timeStamp }),
|
|
373
|
-
}));
|
|
367
|
+
return __foldkitBrandViewResult((openMenu(evo(withPointerType, {
|
|
368
|
+
maybeActiveItemIndex: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeActiveItemIndex~7"),
|
|
369
|
+
activationTrigger: () => __foldkitBrandViewResult(('Pointer'), "@foldkit/ui/menu/index.js#activationTrigger~4"),
|
|
370
|
+
searchQuery: () => __foldkitBrandViewResult((''), "@foldkit/ui/menu/index.js#searchQuery~5"),
|
|
371
|
+
searchVersion: () => __foldkitBrandViewResult((0), "@foldkit/ui/menu/index.js#searchVersion~4"),
|
|
372
|
+
maybeLastPointerPosition: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeLastPointerPosition~4"),
|
|
373
|
+
maybePointerOrigin: () => __foldkitBrandViewResult((Option.some({ screenX, screenY, timeStamp })), "@foldkit/ui/menu/index.js#maybePointerOrigin~2"),
|
|
374
|
+
}))), "@foldkit/ui/menu/index.js#PressedPointerOnButton");
|
|
374
375
|
},
|
|
375
376
|
ReleasedPointerOnItems: ({ screenX, screenY, timeStamp }) => {
|
|
376
377
|
const hasNoOrigin = Option.isNone(model.maybePointerOrigin);
|
|
377
378
|
const hasNoActiveItem = Option.isNone(model.maybeActiveItemIndex);
|
|
378
|
-
const isMovementBelowThreshold = Option.exists(model.maybePointerOrigin, origin => Math.abs(screenX - origin.screenX) <
|
|
379
|
+
const isMovementBelowThreshold = Option.exists(model.maybePointerOrigin, origin => __foldkitBrandViewResult((Math.abs(screenX - origin.screenX) <
|
|
379
380
|
POINTER_MOVEMENT_THRESHOLD_PIXELS &&
|
|
380
381
|
Math.abs(screenY - origin.screenY) <
|
|
381
|
-
POINTER_MOVEMENT_THRESHOLD_PIXELS);
|
|
382
|
-
const isHoldTimeBelowThreshold = Option.exists(model.maybePointerOrigin, origin => timeStamp - origin.timeStamp < POINTER_HOLD_THRESHOLD_MILLISECONDS);
|
|
382
|
+
POINTER_MOVEMENT_THRESHOLD_PIXELS), "@foldkit/ui/menu/index.js#anonymous~13"));
|
|
383
|
+
const isHoldTimeBelowThreshold = Option.exists(model.maybePointerOrigin, origin => __foldkitBrandViewResult((timeStamp - origin.timeStamp < POINTER_HOLD_THRESHOLD_MILLISECONDS), "@foldkit/ui/menu/index.js#anonymous~14"));
|
|
383
384
|
if (hasNoOrigin ||
|
|
384
385
|
isMovementBelowThreshold ||
|
|
385
386
|
isHoldTimeBelowThreshold ||
|
|
386
387
|
hasNoActiveItem) {
|
|
387
|
-
return [model, [], Option.none()];
|
|
388
|
+
return __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/menu/index.js#ReleasedPointerOnItems");
|
|
388
389
|
}
|
|
389
|
-
return [
|
|
390
|
+
return __foldkitBrandViewResult(([
|
|
390
391
|
model,
|
|
391
392
|
[
|
|
392
393
|
ClickItem({
|
|
@@ -395,119 +396,119 @@ export const update = (model, message) => {
|
|
|
395
396
|
}),
|
|
396
397
|
],
|
|
397
398
|
Option.none(),
|
|
398
|
-
];
|
|
399
|
+
]), "@foldkit/ui/menu/index.js#ReleasedPointerOnItems");
|
|
399
400
|
},
|
|
400
|
-
IgnoredMouseClick: () => [
|
|
401
|
-
evo(model, { maybeLastButtonPointerType: () => Option.none() }),
|
|
401
|
+
IgnoredMouseClick: () => __foldkitBrandViewResult(([
|
|
402
|
+
evo(model, { maybeLastButtonPointerType: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#maybeLastButtonPointerType~4") }),
|
|
402
403
|
[],
|
|
403
404
|
Option.none(),
|
|
404
|
-
],
|
|
405
|
-
}));
|
|
405
|
+
]), "@foldkit/ui/menu/index.js#IgnoredMouseClick"),
|
|
406
|
+
}))), "@foldkit/ui/menu/index.js#update");
|
|
406
407
|
};
|
|
407
408
|
/** The anchor-positioning Mount this Menu renders on its panel. The panel is
|
|
408
409
|
* always anchored to the button via Floating UI and portaled to the document
|
|
409
410
|
* body (opt out of portaling with `anchor.portal: false`), so it escapes
|
|
410
411
|
* ancestor stacking contexts and overflow clipping. Exposed so Scene tests
|
|
411
412
|
* can call `Scene.Mount.resolve(AnchorMenu, CompletedAnchorMenu())`. */
|
|
412
|
-
export const AnchorMenu = Mount.define('AnchorMenu', { buttonId: S.String, anchor: AnchorConfig }, CompletedAnchorMenu)(({ buttonId, anchor }) => element => Effect.gen(function* () {
|
|
413
|
-
yield* Effect.acquireRelease(Effect.sync(() => anchorSetup({ buttonId, anchor })(element)), cleanup => Effect.sync(cleanup));
|
|
414
|
-
return CompletedAnchorMenu();
|
|
415
|
-
}));
|
|
413
|
+
export const AnchorMenu = Mount.define('AnchorMenu', { buttonId: S.String, anchor: AnchorConfig }, CompletedAnchorMenu)(({ buttonId, anchor }) => __foldkitBrandViewResult((element => __foldkitBrandViewResult((Effect.gen(function* () {
|
|
414
|
+
yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((anchorSetup({ buttonId, anchor })(element)), "@foldkit/ui/menu/index.js#anonymous~18")), cleanup => __foldkitBrandViewResult((Effect.sync(cleanup)), "@foldkit/ui/menu/index.js#anonymous~19"));
|
|
415
|
+
return __foldkitBrandViewResult((CompletedAnchorMenu()), "@foldkit/ui/menu/index.js#anonymous~17");
|
|
416
|
+
})), "@foldkit/ui/menu/index.js#anonymous~16")), "@foldkit/ui/menu/index.js#anonymous~15"));
|
|
416
417
|
/** The backdrop-portaling Mount this Menu renders. Exposed so Scene tests can
|
|
417
418
|
* call `Scene.Mount.resolve(PortalMenuBackdrop, CompletedPortalMenuBackdrop())` to
|
|
418
419
|
* acknowledge the mount produced by the rendered backdrop. */
|
|
419
|
-
export const PortalMenuBackdrop = Mount.define('PortalMenuBackdrop', CompletedPortalMenuBackdrop)(element => Effect.gen(function* () {
|
|
420
|
-
yield* Effect.acquireRelease(Effect.sync(() => portalToContainingRoot(element)), cleanup => Effect.sync(cleanup));
|
|
421
|
-
return CompletedPortalMenuBackdrop();
|
|
422
|
-
}));
|
|
420
|
+
export const PortalMenuBackdrop = Mount.define('PortalMenuBackdrop', CompletedPortalMenuBackdrop)(element => __foldkitBrandViewResult((Effect.gen(function* () {
|
|
421
|
+
yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((portalToContainingRoot(element)), "@foldkit/ui/menu/index.js#anonymous~22")), cleanup => __foldkitBrandViewResult((Effect.sync(cleanup)), "@foldkit/ui/menu/index.js#anonymous~23"));
|
|
422
|
+
return __foldkitBrandViewResult((CompletedPortalMenuBackdrop()), "@foldkit/ui/menu/index.js#anonymous~21");
|
|
423
|
+
})), "@foldkit/ui/menu/index.js#anonymous~20"));
|
|
423
424
|
/** Programmatically opens the menu, updating the model and returning
|
|
424
425
|
* focus and modal commands. Use this in domain-event handlers to open the menu. */
|
|
425
|
-
export const open = (model) => update(model, Opened({ maybeActiveItemIndex: Option.none() }));
|
|
426
|
+
export const open = (model) => __foldkitBrandViewResult((update(model, Opened({ maybeActiveItemIndex: Option.none() }))), "@foldkit/ui/menu/index.js#open");
|
|
426
427
|
/** Programmatically closes the menu, updating the model and returning
|
|
427
428
|
* focus and modal commands. Use this in domain-event handlers to close the menu. */
|
|
428
|
-
export const close = (model) => update(model, Closed());
|
|
429
|
+
export const close = (model) => __foldkitBrandViewResult((update(model, Closed())), "@foldkit/ui/menu/index.js#close");
|
|
429
430
|
/** Programmatically selects a menu item, closing the menu and returning
|
|
430
431
|
* focus commands plus a `Selected` OutMessage. Use this in domain-event handlers. */
|
|
431
|
-
export const selectItem = (model, item, index) => update(model, SelectedItem({ index, item }));
|
|
432
|
+
export const selectItem = (model, item, index) => __foldkitBrandViewResult((update(model, SelectedItem({ index, item }))), "@foldkit/ui/menu/index.js#selectItem");
|
|
432
433
|
export { groupContiguous, resolveTypeaheadMatch };
|
|
433
|
-
const itemId = (id, index) => `${id}-item-${index}
|
|
434
|
+
const itemId = (id, index) => __foldkitBrandViewResult((`${id}-item-${index}`), "@foldkit/ui/menu/index.js#itemId");
|
|
434
435
|
const internalView = () =>
|
|
435
436
|
/* eslint-disable-next-line @typescript-eslint/consistent-type-assertions */
|
|
436
|
-
menuViewImpl;
|
|
437
|
+
__foldkitBrandViewResult((menuViewImpl), "@foldkit/ui/menu/index.js#internalView");
|
|
437
438
|
const menuViewImpl = defineView((model, viewInputs) => {
|
|
438
439
|
const h = html();
|
|
439
440
|
const { id, isOpen, animation: { transitionState }, maybeActiveItemIndex, searchQuery, maybeLastButtonPointerType, } = model;
|
|
440
|
-
const { items, itemToConfig, isItemDisabled, itemToSearchText = (item) => item, isButtonDisabled, buttonContent, buttonClassName, buttonAttributes = [], itemsClassName, itemsAttributes = [], itemsScrollClassName, itemsScrollAttributes = [], backdropClassName, backdropAttributes = [], className, attributes = [], itemGroupKey, groupToHeading, groupClassName, groupAttributes = [], separatorClassName, separatorAttributes = [], anchor = {}, ariaLabel, ariaLabelledBy, } = viewInputs;
|
|
441
|
-
const dispatchSelectedItem = (item, index) => SelectedItem({ index, item });
|
|
441
|
+
const { items, itemToConfig, isItemDisabled, itemToSearchText = (item) => __foldkitBrandViewResult((item), "@foldkit/ui/menu/index.js#anonymous~25"), isButtonDisabled, buttonContent, buttonClassName, buttonAttributes = [], itemsClassName, itemsAttributes = [], itemsScrollClassName, itemsScrollAttributes = [], backdropClassName, backdropAttributes = [], className, attributes = [], itemGroupKey, groupToHeading, groupClassName, groupAttributes = [], separatorClassName, separatorAttributes = [], anchor = {}, ariaLabel, ariaLabelledBy, } = viewInputs;
|
|
442
|
+
const dispatchSelectedItem = (item, index) => __foldkitBrandViewResult((SelectedItem({ index, item })), "@foldkit/ui/menu/index.js#dispatchSelectedItem");
|
|
442
443
|
const isLeaving = transitionState === 'LeaveStart' || transitionState === 'LeaveAnimating';
|
|
443
444
|
const isVisible = isOpen || isLeaving;
|
|
444
|
-
const animationAttributes = M.value(transitionState).pipe(M.when('EnterStart', () => [
|
|
445
|
+
const animationAttributes = M.value(transitionState).pipe(M.when('EnterStart', () => __foldkitBrandViewResult(([
|
|
445
446
|
h.DataAttribute('closed', ''),
|
|
446
447
|
h.DataAttribute('enter', ''),
|
|
447
448
|
h.DataAttribute('transition', ''),
|
|
448
|
-
]), M.when('EnterAnimating', () => [
|
|
449
|
+
]), "@foldkit/ui/menu/index.js#anonymous~26")), M.when('EnterAnimating', () => __foldkitBrandViewResult(([
|
|
449
450
|
h.DataAttribute('enter', ''),
|
|
450
451
|
h.DataAttribute('transition', ''),
|
|
451
|
-
]), M.when('LeaveStart', () => [
|
|
452
|
+
]), "@foldkit/ui/menu/index.js#anonymous~27")), M.when('LeaveStart', () => __foldkitBrandViewResult(([
|
|
452
453
|
h.DataAttribute('leave', ''),
|
|
453
454
|
h.DataAttribute('transition', ''),
|
|
454
|
-
]), M.when('LeaveAnimating', () => [
|
|
455
|
+
]), "@foldkit/ui/menu/index.js#anonymous~28")), M.when('LeaveAnimating', () => __foldkitBrandViewResult(([
|
|
455
456
|
h.DataAttribute('closed', ''),
|
|
456
457
|
h.DataAttribute('leave', ''),
|
|
457
458
|
h.DataAttribute('transition', ''),
|
|
458
|
-
]), M.orElse(() => []));
|
|
459
|
-
const isDisabled = (index) => Predicate.isNotUndefined(isItemDisabled) &&
|
|
460
|
-
pipe(items, Array.get(index), Option.exists(item => isItemDisabled(item, index)));
|
|
459
|
+
]), "@foldkit/ui/menu/index.js#anonymous~29")), M.orElse(() => __foldkitBrandViewResult(([]), "@foldkit/ui/menu/index.js#anonymous~30")));
|
|
460
|
+
const isDisabled = (index) => __foldkitBrandViewResult((Predicate.isNotUndefined(isItemDisabled) &&
|
|
461
|
+
pipe(items, Array.get(index), Option.exists(item => __foldkitBrandViewResult((isItemDisabled(item, index)), "@foldkit/ui/menu/index.js#anonymous~31")))), "@foldkit/ui/menu/index.js#isDisabled");
|
|
461
462
|
const firstEnabledIndex = findFirstEnabledIndex(items.length, 0, isDisabled)(0, 1);
|
|
462
463
|
const lastEnabledIndex = findFirstEnabledIndex(items.length, 0, isDisabled)(items.length - 1, -1);
|
|
463
464
|
const handleButtonKeyDown = (key) => {
|
|
464
465
|
if (isOpen) {
|
|
465
|
-
return handleItemsKeyDown(key);
|
|
466
|
+
return __foldkitBrandViewResult((handleItemsKeyDown(key)), "@foldkit/ui/menu/index.js#handleButtonKeyDown");
|
|
466
467
|
}
|
|
467
|
-
return M.value(key).pipe(M.whenOr('Enter', ' ', 'ArrowDown', () => Option.some(Opened({ maybeActiveItemIndex: Option.some(firstEnabledIndex) }))), M.when('ArrowUp', () => Option.some(Opened({ maybeActiveItemIndex: Option.some(lastEnabledIndex) }))), M.orElse(() => Option.none()));
|
|
468
|
+
return __foldkitBrandViewResult((M.value(key).pipe(M.whenOr('Enter', ' ', 'ArrowDown', () => __foldkitBrandViewResult((Option.some(Opened({ maybeActiveItemIndex: Option.some(firstEnabledIndex) }))), "@foldkit/ui/menu/index.js#anonymous~32")), M.when('ArrowUp', () => __foldkitBrandViewResult((Option.some(Opened({ maybeActiveItemIndex: Option.some(lastEnabledIndex) }))), "@foldkit/ui/menu/index.js#anonymous~33")), M.orElse(() => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#anonymous~34")))), "@foldkit/ui/menu/index.js#handleButtonKeyDown");
|
|
468
469
|
};
|
|
469
|
-
const handleButtonPointerDown = (pointerType, button, screenX, screenY, timeStamp) => Option.some(PressedPointerOnButton({
|
|
470
|
+
const handleButtonPointerDown = (pointerType, button, screenX, screenY, timeStamp) => __foldkitBrandViewResult((Option.some(PressedPointerOnButton({
|
|
470
471
|
pointerType,
|
|
471
472
|
button,
|
|
472
473
|
screenX,
|
|
473
474
|
screenY,
|
|
474
475
|
timeStamp,
|
|
475
|
-
}));
|
|
476
|
+
}))), "@foldkit/ui/menu/index.js#handleButtonPointerDown");
|
|
476
477
|
const handleButtonClick = () => {
|
|
477
|
-
const isMouse = Option.exists(maybeLastButtonPointerType, type => type === 'mouse');
|
|
478
|
+
const isMouse = Option.exists(maybeLastButtonPointerType, type => __foldkitBrandViewResult((type === 'mouse'), "@foldkit/ui/menu/index.js#anonymous~35"));
|
|
478
479
|
if (isMouse) {
|
|
479
|
-
return IgnoredMouseClick();
|
|
480
|
+
return __foldkitBrandViewResult((IgnoredMouseClick()), "@foldkit/ui/menu/index.js#handleButtonClick");
|
|
480
481
|
}
|
|
481
482
|
else if (isOpen) {
|
|
482
|
-
return Closed();
|
|
483
|
+
return __foldkitBrandViewResult((Closed()), "@foldkit/ui/menu/index.js#handleButtonClick");
|
|
483
484
|
}
|
|
484
485
|
else {
|
|
485
|
-
return Opened({ maybeActiveItemIndex: Option.none() });
|
|
486
|
+
return __foldkitBrandViewResult((Opened({ maybeActiveItemIndex: Option.none() })), "@foldkit/ui/menu/index.js#handleButtonClick");
|
|
486
487
|
}
|
|
487
488
|
};
|
|
488
|
-
const handleSpaceKeyUp = (key) => OptionExt.when(key === ' ', SuppressedSpaceScroll());
|
|
489
|
-
const resolveActiveIndex = keyToIndex('ArrowDown', 'ArrowUp', items.length, Option.getOrElse(maybeActiveItemIndex, () => 0), isDisabled);
|
|
489
|
+
const handleSpaceKeyUp = (key) => __foldkitBrandViewResult((OptionExt.when(key === ' ', SuppressedSpaceScroll())), "@foldkit/ui/menu/index.js#handleSpaceKeyUp");
|
|
490
|
+
const resolveActiveIndex = keyToIndex('ArrowDown', 'ArrowUp', items.length, Option.getOrElse(maybeActiveItemIndex, () => __foldkitBrandViewResult((0), "@foldkit/ui/menu/index.js#anonymous~36")), isDisabled);
|
|
490
491
|
const searchForKey = (key) => {
|
|
491
492
|
const nextQuery = searchQuery + key;
|
|
492
493
|
const maybeTargetIndex = resolveTypeaheadMatch(items, nextQuery, maybeActiveItemIndex, isDisabled, itemToSearchText, Str.isNonEmpty(searchQuery));
|
|
493
|
-
return Option.some(Searched({ key, maybeTargetIndex }));
|
|
494
|
+
return __foldkitBrandViewResult((Option.some(Searched({ key, maybeTargetIndex }))), "@foldkit/ui/menu/index.js#searchForKey");
|
|
494
495
|
};
|
|
495
|
-
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)
|
|
496
|
+
const handleItemsKeyDown = (key) => __foldkitBrandViewResult((M.value(key).pipe(M.when('Escape', () => __foldkitBrandViewResult((Option.some(Closed())), "@foldkit/ui/menu/index.js#anonymous~37")), M.when('Enter', () => __foldkitBrandViewResult((Option.map(maybeActiveItemIndex, index => __foldkitBrandViewResult((RequestedItemClick({ index })), "@foldkit/ui/menu/index.js#anonymous~39"))), "@foldkit/ui/menu/index.js#anonymous~38")), M.when(' ', () => __foldkitBrandViewResult((Str.isNonEmpty(searchQuery)
|
|
496
497
|
? searchForKey(' ')
|
|
497
|
-
: Option.map(maybeActiveItemIndex, index => RequestedItemClick({ index }))), M.whenOr('ArrowDown', 'ArrowUp', 'Home', 'End', 'PageUp', 'PageDown', () => Option.some(ActivatedItem({
|
|
498
|
+
: Option.map(maybeActiveItemIndex, index => __foldkitBrandViewResult((RequestedItemClick({ index })), "@foldkit/ui/menu/index.js#anonymous~41"))), "@foldkit/ui/menu/index.js#anonymous~40")), M.whenOr('ArrowDown', 'ArrowUp', 'Home', 'End', 'PageUp', 'PageDown', () => __foldkitBrandViewResult((Option.some(ActivatedItem({
|
|
498
499
|
index: resolveActiveIndex(key),
|
|
499
500
|
activationTrigger: 'Keyboard',
|
|
500
|
-
}))), M.when(isPrintableKey, () => searchForKey(key)), M.orElse(() => Option.none()));
|
|
501
|
-
const handleItemsPointerUp = (screenX, screenY, pointerType, timeStamp) => OptionExt.when(pointerType === 'mouse', ReleasedPointerOnItems({ screenX, screenY, timeStamp }));
|
|
501
|
+
}))), "@foldkit/ui/menu/index.js#anonymous~42")), M.when(isPrintableKey, () => __foldkitBrandViewResult((searchForKey(key)), "@foldkit/ui/menu/index.js#anonymous~43")), M.orElse(() => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/menu/index.js#anonymous~44")))), "@foldkit/ui/menu/index.js#handleItemsKeyDown");
|
|
502
|
+
const handleItemsPointerUp = (screenX, screenY, pointerType, timeStamp) => __foldkitBrandViewResult((OptionExt.when(pointerType === 'mouse', ReleasedPointerOnItems({ screenX, screenY, timeStamp }))), "@foldkit/ui/menu/index.js#handleItemsPointerUp");
|
|
502
503
|
const resolveButtonLabel = () => {
|
|
503
504
|
if (Predicate.isNotUndefined(ariaLabel)) {
|
|
504
|
-
return [h.AriaLabel(ariaLabel)];
|
|
505
|
+
return __foldkitBrandViewResult(([h.AriaLabel(ariaLabel)]), "@foldkit/ui/menu/index.js#resolveButtonLabel");
|
|
505
506
|
}
|
|
506
507
|
else if (Predicate.isNotUndefined(ariaLabelledBy)) {
|
|
507
|
-
return [h.AriaLabelledBy(ariaLabelledBy)];
|
|
508
|
+
return __foldkitBrandViewResult(([h.AriaLabelledBy(ariaLabelledBy)]), "@foldkit/ui/menu/index.js#resolveButtonLabel");
|
|
508
509
|
}
|
|
509
510
|
else {
|
|
510
|
-
return [];
|
|
511
|
+
return __foldkitBrandViewResult(([]), "@foldkit/ui/menu/index.js#resolveButtonLabel");
|
|
511
512
|
}
|
|
512
513
|
};
|
|
513
514
|
const buttonLabelAttributes = resolveButtonLabel();
|
|
@@ -536,8 +537,8 @@ const menuViewImpl = defineView((model, viewInputs) => {
|
|
|
536
537
|
...buttonAttributes,
|
|
537
538
|
];
|
|
538
539
|
const maybeActiveDescendant = Option.match(maybeActiveItemIndex, {
|
|
539
|
-
onNone: () => [],
|
|
540
|
-
onSome: index => [h.AriaActiveDescendant(itemId(id, index))],
|
|
540
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/menu/index.js#onNone~3"),
|
|
541
|
+
onSome: index => __foldkitBrandViewResult(([h.AriaActiveDescendant(itemId(id, index))]), "@foldkit/ui/menu/index.js#onSome~2"),
|
|
541
542
|
});
|
|
542
543
|
const anchorAttributes = [
|
|
543
544
|
h.Style({ position: 'absolute', margin: '0', visibility: 'hidden' }),
|
|
@@ -563,14 +564,14 @@ const menuViewImpl = defineView((model, viewInputs) => {
|
|
|
563
564
|
...itemsAttributes,
|
|
564
565
|
];
|
|
565
566
|
const menuItems = Array.map(items, (item, index) => {
|
|
566
|
-
const isActiveItem = Option.exists(maybeActiveItemIndex, activeIndex => activeIndex === index);
|
|
567
|
+
const isActiveItem = Option.exists(maybeActiveItemIndex, activeIndex => __foldkitBrandViewResult((activeIndex === index), "@foldkit/ui/menu/index.js#anonymous~46"));
|
|
567
568
|
const isDisabledItem = isDisabled(index);
|
|
568
569
|
const itemConfig = itemToConfig(item, {
|
|
569
570
|
isActive: isActiveItem,
|
|
570
571
|
isDisabled: isDisabledItem,
|
|
571
572
|
});
|
|
572
573
|
const isInteractive = !isDisabledItem && !isLeaving;
|
|
573
|
-
return h.keyed('div')(itemId(id, index), [
|
|
574
|
+
return __foldkitBrandViewResult((h.keyed('div')(itemId(id, index), [
|
|
574
575
|
h.Id(itemId(id, index)),
|
|
575
576
|
h.Role('menuitem'),
|
|
576
577
|
...(isActiveItem ? [h.DataAttribute('active', '')] : []),
|
|
@@ -583,34 +584,34 @@ const menuViewImpl = defineView((model, viewInputs) => {
|
|
|
583
584
|
...(isActiveItem
|
|
584
585
|
? []
|
|
585
586
|
: [
|
|
586
|
-
h.OnPointerMove((screenX, screenY, pointerType) => OptionExt.when(pointerType !== 'touch', MovedPointerOverItem({ index, screenX, screenY }))),
|
|
587
|
+
h.OnPointerMove((screenX, screenY, pointerType) => __foldkitBrandViewResult((OptionExt.when(pointerType !== 'touch', MovedPointerOverItem({ index, screenX, screenY }))), "@foldkit/ui/menu/index.js#anonymous~47")),
|
|
587
588
|
]),
|
|
588
|
-
h.OnPointerLeave(pointerType => OptionExt.when(pointerType !== 'touch', DeactivatedItem())),
|
|
589
|
+
h.OnPointerLeave(pointerType => __foldkitBrandViewResult((OptionExt.when(pointerType !== 'touch', DeactivatedItem())), "@foldkit/ui/menu/index.js#anonymous~48")),
|
|
589
590
|
]
|
|
590
591
|
: []),
|
|
591
592
|
...(itemConfig.className ? [h.Class(itemConfig.className)] : []),
|
|
592
|
-
], [itemConfig.content]);
|
|
593
|
+
], [itemConfig.content])), "@foldkit/ui/menu/index.js#anonymous~45");
|
|
593
594
|
});
|
|
594
595
|
const renderGroupedItems = () => {
|
|
595
596
|
if (!itemGroupKey) {
|
|
596
|
-
return menuItems;
|
|
597
|
+
return __foldkitBrandViewResult((menuItems), "@foldkit/ui/menu/index.js#renderGroupedItems");
|
|
597
598
|
}
|
|
598
|
-
const segments = groupContiguous(menuItems, (_, index) => Array.get(items, index).pipe(Option.match({
|
|
599
|
-
onNone: () => '',
|
|
600
|
-
onSome: item => itemGroupKey(item, index),
|
|
601
|
-
})));
|
|
602
|
-
return Array.flatMap(segments, (segment, segmentIndex) => {
|
|
599
|
+
const segments = groupContiguous(menuItems, (_, index) => __foldkitBrandViewResult((Array.get(items, index).pipe(Option.match({
|
|
600
|
+
onNone: () => __foldkitBrandViewResult((''), "@foldkit/ui/menu/index.js#onNone~4"),
|
|
601
|
+
onSome: item => __foldkitBrandViewResult((itemGroupKey(item, index)), "@foldkit/ui/menu/index.js#onSome~3"),
|
|
602
|
+
}))), "@foldkit/ui/menu/index.js#anonymous~49"));
|
|
603
|
+
return __foldkitBrandViewResult((Array.flatMap(segments, (segment, segmentIndex) => {
|
|
603
604
|
const maybeHeading = Option.fromNullishOr(groupToHeading && groupToHeading(segment.key));
|
|
604
605
|
const headingId = `${id}-heading-${segment.key}`;
|
|
605
606
|
const headingElement = Option.match(maybeHeading, {
|
|
606
|
-
onNone: () => [],
|
|
607
|
-
onSome: heading => [
|
|
607
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/menu/index.js#onNone~5"),
|
|
608
|
+
onSome: heading => __foldkitBrandViewResult(([
|
|
608
609
|
h.keyed('div')(headingId, [
|
|
609
610
|
h.Id(headingId),
|
|
610
611
|
h.Role('presentation'),
|
|
611
612
|
...(heading.className ? [h.Class(heading.className)] : []),
|
|
612
613
|
], [heading.content]),
|
|
613
|
-
],
|
|
614
|
+
]), "@foldkit/ui/menu/index.js#onSome~4"),
|
|
614
615
|
});
|
|
615
616
|
const groupContent = [...headingElement, ...segment.items];
|
|
616
617
|
const groupElement = h.keyed('div')(`${id}-group-${segment.key}`, [
|
|
@@ -634,8 +635,8 @@ const menuViewImpl = defineView((model, viewInputs) => {
|
|
|
634
635
|
], []),
|
|
635
636
|
]
|
|
636
637
|
: [];
|
|
637
|
-
return [...separator, groupElement];
|
|
638
|
-
});
|
|
638
|
+
return __foldkitBrandViewResult(([...separator, groupElement]), "@foldkit/ui/menu/index.js#anonymous~50");
|
|
639
|
+
})), "@foldkit/ui/menu/index.js#renderGroupedItems");
|
|
639
640
|
};
|
|
640
641
|
const backdrop = h.keyed('div')(`${id}-backdrop`, [
|
|
641
642
|
h.OnMount(PortalMenuBackdrop()),
|
|
@@ -664,12 +665,12 @@ const menuViewImpl = defineView((model, viewInputs) => {
|
|
|
664
665
|
...attributes,
|
|
665
666
|
...(isVisible ? [h.DataAttribute('open', '')] : []),
|
|
666
667
|
];
|
|
667
|
-
return h.div(wrapperAttributes, [
|
|
668
|
+
return __foldkitBrandViewResult((h.div(wrapperAttributes, [
|
|
668
669
|
h.keyed('button')(`${id}-button`, resolvedButtonAttributes, [
|
|
669
670
|
buttonContent,
|
|
670
671
|
]),
|
|
671
672
|
...(isVisible ? visibleContent : []),
|
|
672
|
-
]);
|
|
673
|
+
])), "@foldkit/ui/menu/index.js#anonymous~24");
|
|
673
674
|
});
|
|
674
675
|
/** Pairs the menu's `view` and `update` (and programmatic helpers)
|
|
675
676
|
* behind a single Item-typed entry point. Declaring the menu once at
|
|
@@ -690,12 +691,12 @@ const menuViewImpl = defineView((model, viewInputs) => {
|
|
|
690
691
|
export const create = () => {
|
|
691
692
|
const cast = (result) =>
|
|
692
693
|
/* eslint-disable-next-line @typescript-eslint/consistent-type-assertions */
|
|
693
|
-
result;
|
|
694
|
-
return {
|
|
694
|
+
__foldkitBrandViewResult((result), "@foldkit/ui/menu/index.js#cast");
|
|
695
|
+
return __foldkitBrandViewResult(({
|
|
695
696
|
view: internalView(),
|
|
696
|
-
update: (model, message) => cast(update(model, message)),
|
|
697
|
-
selectItem: (model, item, index) => cast(selectItem(model, item, index)),
|
|
698
|
-
open: model => cast(open(model)),
|
|
699
|
-
close: model => cast(close(model)),
|
|
700
|
-
};
|
|
697
|
+
update: (model, message) => __foldkitBrandViewResult((cast(update(model, message))), "@foldkit/ui/menu/index.js#update~2"),
|
|
698
|
+
selectItem: (model, item, index) => __foldkitBrandViewResult((cast(selectItem(model, item, index))), "@foldkit/ui/menu/index.js#selectItem~2"),
|
|
699
|
+
open: model => __foldkitBrandViewResult((cast(open(model))), "@foldkit/ui/menu/index.js#open~2"),
|
|
700
|
+
close: model => __foldkitBrandViewResult((cast(close(model))), "@foldkit/ui/menu/index.js#close~2"),
|
|
701
|
+
}), "@foldkit/ui/menu/index.js#create");
|
|
701
702
|
};
|