@foldkit/ui 0.155.0 → 0.156.0-canary.13f4f703eb6a
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/anchor.d.ts +18 -18
- package/dist/anchor/anchor.d.ts.map +1 -1
- package/dist/anchor/anchor.js +16 -16
- package/dist/animation/index.d.ts +4 -4
- package/dist/animation/index.d.ts.map +1 -1
- package/dist/animation/index.js +8 -8
- package/dist/animation/public.d.ts +1 -1
- package/dist/animation/public.d.ts.map +1 -1
- package/dist/animation/public.js +1 -1
- package/dist/animation/schema.d.ts +6 -6
- package/dist/animation/schema.d.ts.map +1 -1
- package/dist/animation/schema.js +5 -5
- package/dist/animation/update.d.ts +4 -2
- package/dist/animation/update.d.ts.map +1 -1
- package/dist/animation/update.js +18 -9
- package/dist/calendar/index.d.ts +56 -56
- package/dist/calendar/index.d.ts.map +1 -1
- package/dist/calendar/index.js +49 -37
- package/dist/checkbox/index.js +2 -2
- package/dist/combobox/multi.d.ts +19 -19
- package/dist/combobox/multi.d.ts.map +1 -1
- package/dist/combobox/multi.js +2 -2
- package/dist/combobox/shared.d.ts +61 -61
- package/dist/combobox/shared.d.ts.map +1 -1
- package/dist/combobox/shared.js +61 -61
- package/dist/combobox/single.d.ts +19 -19
- package/dist/combobox/single.d.ts.map +1 -1
- package/dist/combobox/single.js +2 -2
- package/dist/datePicker/index.d.ts +72 -72
- package/dist/datePicker/index.d.ts.map +1 -1
- package/dist/datePicker/index.js +12 -12
- package/dist/dialog/index.d.ts +14 -14
- package/dist/dialog/index.d.ts.map +1 -1
- package/dist/dialog/index.js +22 -22
- package/dist/disclosure/index.js +2 -2
- package/dist/dragAndDrop/index.d.ts +61 -61
- package/dist/dragAndDrop/index.d.ts.map +1 -1
- package/dist/dragAndDrop/index.js +85 -85
- package/dist/fileDrop/index.d.ts +6 -6
- package/dist/fileDrop/index.d.ts.map +1 -1
- package/dist/fileDrop/index.js +6 -6
- package/dist/hoverIntent/hoverIntent.d.ts +19 -16
- package/dist/hoverIntent/hoverIntent.d.ts.map +1 -1
- package/dist/hoverIntent/hoverIntent.js +49 -46
- package/dist/hoverIntent/message.d.ts +4 -4
- package/dist/hoverIntent/message.d.ts.map +1 -1
- package/dist/hoverIntent/message.js +4 -4
- package/dist/hoverIntent/public.d.ts +1 -1
- package/dist/hoverIntent/public.d.ts.map +1 -1
- package/dist/hoverIntent/public.js +1 -1
- package/dist/keyboard.js +2 -2
- package/dist/listbox/multi.d.ts +19 -19
- package/dist/listbox/multi.d.ts.map +1 -1
- package/dist/listbox/multi.js +2 -2
- package/dist/listbox/shared.d.ts +58 -58
- package/dist/listbox/shared.d.ts.map +1 -1
- package/dist/listbox/shared.js +61 -61
- package/dist/listbox/single.d.ts +19 -19
- package/dist/listbox/single.d.ts.map +1 -1
- package/dist/listbox/single.js +2 -2
- package/dist/menu/index.d.ts +67 -67
- package/dist/menu/index.d.ts.map +1 -1
- package/dist/menu/index.js +69 -66
- package/dist/popover/index.d.ts +34 -34
- package/dist/popover/index.d.ts.map +1 -1
- package/dist/popover/index.js +36 -36
- package/dist/radioGroup/index.d.ts +12 -12
- package/dist/radioGroup/index.d.ts.map +1 -1
- package/dist/radioGroup/index.js +16 -16
- package/dist/slider/index.d.ts +14 -14
- package/dist/slider/index.d.ts.map +1 -1
- package/dist/slider/index.js +31 -31
- package/dist/switch/index.js +2 -2
- package/dist/tabs/index.d.ts +14 -14
- package/dist/tabs/index.d.ts.map +1 -1
- package/dist/tabs/index.js +18 -18
- package/dist/test/apps/disabledButton.d.ts +12 -12
- package/dist/test/apps/disabledButton.d.ts.map +1 -1
- package/dist/test/apps/disabledButton.js +5 -5
- package/dist/textarea/index.d.ts +2 -2
- package/dist/textarea/index.d.ts.map +1 -1
- package/dist/toast/index.d.ts +63 -63
- package/dist/toast/index.d.ts.map +1 -1
- package/dist/toast/index.js +19 -19
- package/dist/toast/schema.d.ts +55 -55
- package/dist/toast/schema.d.ts.map +1 -1
- package/dist/toast/schema.js +29 -29
- package/dist/toast/test.d.ts.map +1 -1
- package/dist/toast/test.js +3 -3
- package/dist/toast/update.d.ts +61 -61
- package/dist/toast/update.d.ts.map +1 -1
- package/dist/toast/update.js +11 -11
- package/dist/tooltip/message.d.ts +3 -3
- package/dist/tooltip/message.d.ts.map +1 -1
- package/dist/tooltip/message.js +3 -3
- package/dist/tooltip/tooltip.d.ts +24 -24
- package/dist/tooltip/tooltip.d.ts.map +1 -1
- package/dist/tooltip/tooltip.js +13 -13
- package/dist/typeahead.d.ts.map +1 -1
- package/dist/typeahead.js +3 -3
- package/dist/virtualList/index.d.ts +16 -16
- package/dist/virtualList/index.d.ts.map +1 -1
- package/dist/virtualList/index.js +13 -13
- package/package.json +4 -4
package/dist/listbox/shared.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
|
-
import { Array, Effect, Equal, Match
|
|
2
|
+
import { Array, Effect, Equal, Match, Number, Option, Predicate, Schema, String, pipe, } from 'effect';
|
|
3
3
|
import * as Command from 'foldkit/command';
|
|
4
4
|
import * as Dom from 'foldkit/dom';
|
|
5
5
|
import { defineMessageUnion } from 'foldkit/message';
|
|
@@ -11,7 +11,7 @@ import { AnchorConfig, anchorSetup, portalToContainingRoot, } from '../anchor/in
|
|
|
11
11
|
// NOTE: Animation imports are split across schema + update to avoid a circular
|
|
12
12
|
// dependency: animation → html → runtime → devtools → listbox → animation.
|
|
13
13
|
// The barrel (../animation) imports from html, which starts the cycle.
|
|
14
|
-
import
|
|
14
|
+
import * as Animation from '../animation/schema.js';
|
|
15
15
|
import { update as animationUpdate } from '../animation/update.js';
|
|
16
16
|
import { groupContiguous } from '../group.js';
|
|
17
17
|
import * as OptionExt from '../internal/optionExtensions.js';
|
|
@@ -21,23 +21,23 @@ import { resolveTypeaheadMatch } from '../typeahead.js';
|
|
|
21
21
|
export { resolveTypeaheadMatch };
|
|
22
22
|
// MODEL
|
|
23
23
|
/** Schema for the activation trigger: whether the user interacted via mouse or keyboard. */
|
|
24
|
-
export const ActivationTrigger =
|
|
24
|
+
export const ActivationTrigger = Schema.Literals(['Pointer', 'Keyboard']);
|
|
25
25
|
/** Schema for the listbox orientation: whether items flow vertically or horizontally. */
|
|
26
|
-
export const Orientation =
|
|
27
|
-
/** Schema fields shared by all listbox variants (single-select and multi-select). Spread into each variant's `
|
|
28
|
-
export const BaseModel =
|
|
29
|
-
id:
|
|
30
|
-
isOpen:
|
|
31
|
-
isAnimated:
|
|
32
|
-
isModal:
|
|
26
|
+
export const Orientation = Schema.Literals(['Vertical', 'Horizontal']);
|
|
27
|
+
/** Schema fields shared by all listbox variants (single-select and multi-select). Spread into each variant's `Schema.Struct` to avoid duplicating field definitions. */
|
|
28
|
+
export const BaseModel = Schema.Struct({
|
|
29
|
+
id: Schema.String,
|
|
30
|
+
isOpen: Schema.Boolean,
|
|
31
|
+
isAnimated: Schema.Boolean,
|
|
32
|
+
isModal: Schema.Boolean,
|
|
33
33
|
orientation: Orientation,
|
|
34
|
-
animation:
|
|
35
|
-
maybeActiveItemIndex:
|
|
34
|
+
animation: Animation.Model,
|
|
35
|
+
maybeActiveItemIndex: Schema.Option(Schema.Number),
|
|
36
36
|
activationTrigger: ActivationTrigger,
|
|
37
|
-
searchQuery:
|
|
38
|
-
searchVersion:
|
|
39
|
-
maybeLastPointerPosition:
|
|
40
|
-
maybeLastButtonPointerType:
|
|
37
|
+
searchQuery: Schema.String,
|
|
38
|
+
searchVersion: Schema.Number,
|
|
39
|
+
maybeLastPointerPosition: Schema.Option(Schema.Struct({ screenX: Schema.Number, screenY: Schema.Number })),
|
|
40
|
+
maybeLastButtonPointerType: Schema.Option(Schema.String),
|
|
41
41
|
});
|
|
42
42
|
/** Creates the shared base fields for a listbox model from a config. Each variant spreads this and adds its selection field. */
|
|
43
43
|
export const baseInit = (config) => (__foldkitBrandViewResult(({
|
|
@@ -46,7 +46,7 @@ export const baseInit = (config) => (__foldkitBrandViewResult(({
|
|
|
46
46
|
isAnimated: config.isAnimated ?? false,
|
|
47
47
|
isModal: config.isModal ?? false,
|
|
48
48
|
orientation: config.orientation ?? 'Vertical',
|
|
49
|
-
animation:
|
|
49
|
+
animation: Animation.init({ id: `${config.id}-listbox` }),
|
|
50
50
|
maybeActiveItemIndex: Option.none(),
|
|
51
51
|
activationTrigger: 'Keyboard',
|
|
52
52
|
searchQuery: '',
|
|
@@ -57,26 +57,26 @@ export const baseInit = (config) => (__foldkitBrandViewResult(({
|
|
|
57
57
|
// MESSAGE
|
|
58
58
|
/** Union of all messages the listbox component can produce. */
|
|
59
59
|
export const Message = defineMessageUnion({
|
|
60
|
-
Opened: { maybeActiveItemIndex:
|
|
60
|
+
Opened: { maybeActiveItemIndex: Schema.Option(Schema.Number) },
|
|
61
61
|
Closed: {},
|
|
62
62
|
BlurredItems: {},
|
|
63
63
|
ActivatedItem: {
|
|
64
|
-
index:
|
|
64
|
+
index: Schema.Number,
|
|
65
65
|
activationTrigger: ActivationTrigger,
|
|
66
66
|
},
|
|
67
67
|
DeactivatedItem: {},
|
|
68
|
-
SelectedItem: { item:
|
|
68
|
+
SelectedItem: { item: Schema.String },
|
|
69
69
|
MovedPointerOverItem: {
|
|
70
|
-
index:
|
|
71
|
-
screenX:
|
|
72
|
-
screenY:
|
|
70
|
+
index: Schema.Number,
|
|
71
|
+
screenX: Schema.Number,
|
|
72
|
+
screenY: Schema.Number,
|
|
73
73
|
},
|
|
74
|
-
RequestedItemClick: { index:
|
|
74
|
+
RequestedItemClick: { index: Schema.Number },
|
|
75
75
|
Searched: {
|
|
76
|
-
key:
|
|
77
|
-
maybeTargetIndex:
|
|
76
|
+
key: Schema.String,
|
|
77
|
+
maybeTargetIndex: Schema.Option(Schema.Number),
|
|
78
78
|
},
|
|
79
|
-
CompletedDelayClearSearch: { version:
|
|
79
|
+
CompletedDelayClearSearch: { version: Schema.Number },
|
|
80
80
|
CompletedLockScroll: {},
|
|
81
81
|
CompletedUnlockScroll: {},
|
|
82
82
|
CompletedInertOthers: {},
|
|
@@ -90,15 +90,15 @@ export const Message = defineMessageUnion({
|
|
|
90
90
|
SuppressedItemCommit: {},
|
|
91
91
|
CompletedAnchorListbox: {},
|
|
92
92
|
CompletedPortalListboxBackdrop: {},
|
|
93
|
-
GotAnimationMessage: { message:
|
|
93
|
+
GotAnimationMessage: { message: Animation.Message },
|
|
94
94
|
PressedPointerOnButton: {
|
|
95
|
-
pointerType:
|
|
96
|
-
button:
|
|
95
|
+
pointerType: Schema.String,
|
|
96
|
+
button: Schema.Number,
|
|
97
97
|
},
|
|
98
98
|
});
|
|
99
99
|
/** Union of out-messages the listbox component can produce. The parent folds `Selected` into the selection it owns: single-select stores the value, multi-select toggles the value's membership. */
|
|
100
100
|
export const OutMessage = defineMessageUnion({
|
|
101
|
-
Selected: { value:
|
|
101
|
+
Selected: { value: Schema.String },
|
|
102
102
|
});
|
|
103
103
|
// CONSTANTS
|
|
104
104
|
export const SEARCH_DEBOUNCE_MILLISECONDS = 350;
|
|
@@ -136,64 +136,64 @@ export const UnlockScroll = Command.define('UnlockScroll', {
|
|
|
136
136
|
});
|
|
137
137
|
/** Marks all elements outside the listbox as inert for modal behavior. */
|
|
138
138
|
export const InertOthers = Command.define('InertOthers', {
|
|
139
|
-
args: { id:
|
|
139
|
+
args: { id: Schema.String },
|
|
140
140
|
messages: [Message.CompletedInertOthers],
|
|
141
141
|
execute: ({ id }) => __foldkitBrandViewResult((Dom.inertOthers(id, [buttonSelector(id), itemsSelector(id)]).pipe(Effect.as(Message.CompletedInertOthers()))), "@foldkit/ui/listbox/shared.js#execute"),
|
|
142
142
|
});
|
|
143
143
|
/** Removes the inert attribute from elements outside the listbox. */
|
|
144
144
|
export const RestoreInert = Command.define('RestoreInert', {
|
|
145
|
-
args: { id:
|
|
145
|
+
args: { id: Schema.String },
|
|
146
146
|
messages: [Message.CompletedRestoreInert],
|
|
147
147
|
execute: ({ id }) => __foldkitBrandViewResult((Dom.restoreInert(id).pipe(Effect.as(Message.CompletedRestoreInert()))), "@foldkit/ui/listbox/shared.js#execute~2"),
|
|
148
148
|
});
|
|
149
149
|
/** Moves focus back to the listbox button after closing. */
|
|
150
150
|
export const FocusButton = Command.define('FocusButton', {
|
|
151
|
-
args: { id:
|
|
151
|
+
args: { id: Schema.String },
|
|
152
152
|
messages: [Message.CompletedFocusButton],
|
|
153
153
|
execute: ({ id }) => __foldkitBrandViewResult((Dom.focus(buttonSelector(id)).pipe(Effect.ignore, Effect.as(Message.CompletedFocusButton()))), "@foldkit/ui/listbox/shared.js#execute~3"),
|
|
154
154
|
});
|
|
155
155
|
/** Moves focus to the listbox items container after opening. */
|
|
156
156
|
export const FocusItems = Command.define('FocusItems', {
|
|
157
|
-
args: { id:
|
|
157
|
+
args: { id: Schema.String },
|
|
158
158
|
messages: [Message.CompletedFocusItems],
|
|
159
159
|
execute: ({ id }) => __foldkitBrandViewResult((Dom.focus(itemsSelector(id)).pipe(Effect.ignore, Effect.as(Message.CompletedFocusItems()))), "@foldkit/ui/listbox/shared.js#execute~4"),
|
|
160
160
|
});
|
|
161
161
|
/** Scrolls the active listbox item into view after keyboard navigation. */
|
|
162
162
|
export const ScrollIntoView = Command.define('ScrollIntoView', {
|
|
163
|
-
args: { id:
|
|
163
|
+
args: { id: Schema.String, index: Schema.Number },
|
|
164
164
|
messages: [Message.CompletedScrollIntoView],
|
|
165
165
|
execute: ({ id, index }) => __foldkitBrandViewResult((Dom.scrollIntoView(itemSelector(id, index)).pipe(Effect.ignore, Effect.as(Message.CompletedScrollIntoView()))), "@foldkit/ui/listbox/shared.js#execute~5"),
|
|
166
166
|
});
|
|
167
167
|
/** Programmatically clicks the active listbox item's DOM element. */
|
|
168
168
|
export const ClickItem = Command.define('ClickItem', {
|
|
169
|
-
args: { id:
|
|
169
|
+
args: { id: Schema.String, index: Schema.Number },
|
|
170
170
|
messages: [Message.CompletedClickItem],
|
|
171
171
|
execute: ({ id, index }) => __foldkitBrandViewResult((Dom.clickElement(itemSelector(id, index)).pipe(Effect.ignore, Effect.as(Message.CompletedClickItem()))), "@foldkit/ui/listbox/shared.js#execute~6"),
|
|
172
172
|
});
|
|
173
173
|
/** Waits for the typeahead search debounce period before clearing the query. */
|
|
174
174
|
export const DelayClearSearch = Command.define('DelayClearSearch', {
|
|
175
|
-
args: { version:
|
|
175
|
+
args: { version: Schema.Number },
|
|
176
176
|
messages: [Message.CompletedDelayClearSearch],
|
|
177
177
|
execute: ({ version }) => __foldkitBrandViewResult((Effect.sleep(SEARCH_DEBOUNCE_MILLISECONDS).pipe(Effect.as(Message.CompletedDelayClearSearch({ version })))), "@foldkit/ui/listbox/shared.js#execute~7"),
|
|
178
178
|
});
|
|
179
179
|
/** Detects whether the listbox button moved or the leave animation ended. Whichever comes first; both outcomes signal the Animation submodel that leave is complete. */
|
|
180
180
|
export const DetectMovementOrAnimationEnd = Command.define('DetectMovementOrAnimationEnd', {
|
|
181
|
-
args: { id:
|
|
181
|
+
args: { id: Schema.String },
|
|
182
182
|
messages: [Message.GotAnimationMessage],
|
|
183
183
|
execute: ({ id }) => __foldkitBrandViewResult((Effect.raceFirst(Dom.detectElementMovement(buttonSelector(id)).pipe(Effect.as(Message.GotAnimationMessage({
|
|
184
|
-
message:
|
|
184
|
+
message: Animation.Message.EndedAnimation(),
|
|
185
185
|
}))), Dom.waitForAnimationSettled(itemsSelector(id)).pipe(Effect.as(Message.GotAnimationMessage({
|
|
186
|
-
message:
|
|
186
|
+
message: Animation.Message.EndedAnimation(),
|
|
187
187
|
}))))), "@foldkit/ui/listbox/shared.js#execute~8"),
|
|
188
188
|
});
|
|
189
189
|
export const makeUpdate = (handleSelectedItem) => {
|
|
190
|
-
const foldAnimationOutMessage =
|
|
190
|
+
const foldAnimationOutMessage = Animation.OutMessage.match({
|
|
191
191
|
StartedLeaveAnimating: () => __foldkitBrandViewResult((model => (__foldkitBrandViewResult(({
|
|
192
192
|
model,
|
|
193
193
|
commands: [DetectMovementOrAnimationEnd({ id: model.id })],
|
|
194
194
|
}), "@foldkit/ui/listbox/shared.js#anonymous"))), "@foldkit/ui/listbox/shared.js#StartedLeaveAnimating"),
|
|
195
195
|
TransitionedOut: () => __foldkitBrandViewResult((model => (__foldkitBrandViewResult(({ model }), "@foldkit/ui/listbox/shared.js#anonymous~2"))), "@foldkit/ui/listbox/shared.js#TransitionedOut"),
|
|
196
|
-
})
|
|
196
|
+
});
|
|
197
197
|
const foldAnimation = Update.foldChild({
|
|
198
198
|
update: animationUpdate,
|
|
199
199
|
read: (model) => __foldkitBrandViewResult((Option.some(model.animation)), "@foldkit/ui/listbox/shared.js#read"),
|
|
@@ -208,7 +208,7 @@ export const makeUpdate = (handleSelectedItem) => {
|
|
|
208
208
|
model: stepModel,
|
|
209
209
|
commands: openCommands,
|
|
210
210
|
}), "@foldkit/ui/listbox/shared.js#anonymous~3")),
|
|
211
|
-
foldAnimation(
|
|
211
|
+
foldAnimation(Animation.Message.Showed()),
|
|
212
212
|
stepModel => (__foldkitBrandViewResult(({
|
|
213
213
|
model: constrainedEvo(stepModel, { isOpen: () => __foldkitBrandViewResult((true), "@foldkit/ui/listbox/shared.js#isOpen~2") }),
|
|
214
214
|
}), "@foldkit/ui/listbox/shared.js#anonymous~4")),
|
|
@@ -227,7 +227,7 @@ export const makeUpdate = (handleSelectedItem) => {
|
|
|
227
227
|
if (baseModel.isAnimated) {
|
|
228
228
|
return __foldkitBrandViewResult((Update.combine(closed, [
|
|
229
229
|
stepModel => (__foldkitBrandViewResult(({ model: stepModel, commands }), "@foldkit/ui/listbox/shared.js#anonymous~5")),
|
|
230
|
-
foldAnimation(
|
|
230
|
+
foldAnimation(Animation.Message.Hid()),
|
|
231
231
|
])), "@foldkit/ui/listbox/shared.js#closeListbox");
|
|
232
232
|
}
|
|
233
233
|
return __foldkitBrandViewResult(({ model: closed, commands }), "@foldkit/ui/listbox/shared.js#closeListbox");
|
|
@@ -383,7 +383,7 @@ export const makeUpdate = (handleSelectedItem) => {
|
|
|
383
383
|
* Exposed so Scene tests can call
|
|
384
384
|
* `Scene.Mount.resolve(AnchorListbox, CompletedAnchorListbox())`. */
|
|
385
385
|
export const AnchorListbox = Mount.define('AnchorListbox', {
|
|
386
|
-
args: { buttonId:
|
|
386
|
+
args: { buttonId: Schema.String, anchor: AnchorConfig },
|
|
387
387
|
messages: [Message.CompletedAnchorListbox],
|
|
388
388
|
execute: ({ element, buttonId, anchor }) => __foldkitBrandViewResult((Effect.gen(function* () {
|
|
389
389
|
yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((anchorSetup(element, {
|
|
@@ -408,26 +408,26 @@ export const makeView = (behavior) => {
|
|
|
408
408
|
const impl = defineView((model, viewInputs, h) => {
|
|
409
409
|
const { id, isOpen, orientation, animation: { transitionState }, maybeActiveItemIndex, searchQuery, maybeLastButtonPointerType, } = model;
|
|
410
410
|
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, isReadOnly = false, isInvalid, ariaLabel, ariaLabelledBy, selectedValues, } = viewInputs;
|
|
411
|
-
const itemToValue = viewInputs.itemToValue ?? ((item) => __foldkitBrandViewResult((String(item)), "@foldkit/ui/listbox/shared.js#anonymous~17"));
|
|
411
|
+
const itemToValue = viewInputs.itemToValue ?? ((item) => __foldkitBrandViewResult((globalThis.String(item)), "@foldkit/ui/listbox/shared.js#anonymous~17"));
|
|
412
412
|
const isValueSelected = (itemValue) => __foldkitBrandViewResult((Array.contains(selectedValues, itemValue)), "@foldkit/ui/listbox/shared.js#isValueSelected");
|
|
413
413
|
const itemToSearchText = viewInputs.itemToSearchText ?? ((item) => __foldkitBrandViewResult((itemToValue(item)), "@foldkit/ui/listbox/shared.js#anonymous~18"));
|
|
414
414
|
const isLeaving = transitionState === 'LeaveStart' || transitionState === 'LeaveAnimating';
|
|
415
415
|
const isVisible = isOpen || isLeaving;
|
|
416
|
-
const animationAttributes =
|
|
416
|
+
const animationAttributes = Match.value(transitionState).pipe(Match.when('EnterStart', () => __foldkitBrandViewResult(([
|
|
417
417
|
h.DataAttribute('closed', ''),
|
|
418
418
|
h.DataAttribute('enter', ''),
|
|
419
419
|
h.DataAttribute('transition', ''),
|
|
420
|
-
]), "@foldkit/ui/listbox/shared.js#anonymous~19")),
|
|
420
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~19")), Match.when('EnterAnimating', () => __foldkitBrandViewResult(([
|
|
421
421
|
h.DataAttribute('enter', ''),
|
|
422
422
|
h.DataAttribute('transition', ''),
|
|
423
|
-
]), "@foldkit/ui/listbox/shared.js#anonymous~20")),
|
|
423
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~20")), Match.when('LeaveStart', () => __foldkitBrandViewResult(([
|
|
424
424
|
h.DataAttribute('leave', ''),
|
|
425
425
|
h.DataAttribute('transition', ''),
|
|
426
|
-
]), "@foldkit/ui/listbox/shared.js#anonymous~21")),
|
|
426
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~21")), Match.when('LeaveAnimating', () => __foldkitBrandViewResult(([
|
|
427
427
|
h.DataAttribute('closed', ''),
|
|
428
428
|
h.DataAttribute('leave', ''),
|
|
429
429
|
h.DataAttribute('transition', ''),
|
|
430
|
-
]), "@foldkit/ui/listbox/shared.js#anonymous~22")),
|
|
430
|
+
]), "@foldkit/ui/listbox/shared.js#anonymous~22")), Match.orElse(() => __foldkitBrandViewResult(([]), "@foldkit/ui/listbox/shared.js#anonymous~23")));
|
|
431
431
|
const isItemDisabledByIndex = (index) => __foldkitBrandViewResult((Predicate.isNotUndefined(isItemDisabled) &&
|
|
432
432
|
pipe(items, Array.get(index), Option.exists(item => __foldkitBrandViewResult((isItemDisabled(item, index)), "@foldkit/ui/listbox/shared.js#anonymous~24")))), "@foldkit/ui/listbox/shared.js#isItemDisabledByIndex");
|
|
433
433
|
const isButtonEffectivelyDisabled = isDisabled || isButtonDisabled;
|
|
@@ -449,11 +449,11 @@ export const makeView = (behavior) => {
|
|
|
449
449
|
if (isOpen) {
|
|
450
450
|
return __foldkitBrandViewResult((handleItemsKeyDown(key)), "@foldkit/ui/listbox/shared.js#handleButtonKeyDown");
|
|
451
451
|
}
|
|
452
|
-
return __foldkitBrandViewResult((
|
|
452
|
+
return __foldkitBrandViewResult((Match.value(key).pipe(Match.whenOr('Enter', ' ', 'ArrowDown', () => __foldkitBrandViewResult((Option.some(Message.Opened({
|
|
453
453
|
maybeActiveItemIndex: Option.orElse(selectedItemIndex, () => __foldkitBrandViewResult((Option.some(firstEnabledIndex)), "@foldkit/ui/listbox/shared.js#anonymous~28")),
|
|
454
|
-
}))), "@foldkit/ui/listbox/shared.js#anonymous~27")),
|
|
454
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~27")), Match.when('ArrowUp', () => __foldkitBrandViewResult((Option.some(Message.Opened({
|
|
455
455
|
maybeActiveItemIndex: Option.orElse(selectedItemIndex, () => __foldkitBrandViewResult((Option.some(lastEnabledIndex)), "@foldkit/ui/listbox/shared.js#anonymous~30")),
|
|
456
|
-
}))), "@foldkit/ui/listbox/shared.js#anonymous~29")),
|
|
456
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~29")), Match.orElse(() => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#anonymous~31")))), "@foldkit/ui/listbox/shared.js#handleButtonKeyDown");
|
|
457
457
|
};
|
|
458
458
|
const handleButtonPointerDown = (pointerType, button) => __foldkitBrandViewResult((Option.some(Message.PressedPointerOnButton({ pointerType, button }))), "@foldkit/ui/listbox/shared.js#handleButtonPointerDown");
|
|
459
459
|
const handleButtonClick = () => {
|
|
@@ -470,12 +470,12 @@ export const makeView = (behavior) => {
|
|
|
470
470
|
};
|
|
471
471
|
const handleSpaceKeyUp = (key) => __foldkitBrandViewResult((OptionExt.when(key === ' ', Message.SuppressedSpaceScroll())), "@foldkit/ui/listbox/shared.js#handleSpaceKeyUp");
|
|
472
472
|
const resolveActiveIndex = (key) => __foldkitBrandViewResult((Option.match(maybeActiveItemIndex, {
|
|
473
|
-
onNone: () => __foldkitBrandViewResult((
|
|
473
|
+
onNone: () => __foldkitBrandViewResult((Match.value(key).pipe(Match.whenOr(previousKey, 'End', 'PageDown', () => __foldkitBrandViewResult((lastEnabledIndex), "@foldkit/ui/listbox/shared.js#anonymous~33")), Match.orElse(() => __foldkitBrandViewResult((firstEnabledIndex), "@foldkit/ui/listbox/shared.js#anonymous~34")))), "@foldkit/ui/listbox/shared.js#onNone~2"),
|
|
474
474
|
onSome: activeIndex => __foldkitBrandViewResult((keyToIndex(nextKey, previousKey, items.length, activeIndex, isItemDisabledByIndex)(key)), "@foldkit/ui/listbox/shared.js#onSome~2"),
|
|
475
475
|
})), "@foldkit/ui/listbox/shared.js#resolveActiveIndex");
|
|
476
476
|
const searchForKey = (key) => {
|
|
477
477
|
const nextQuery = searchQuery + key;
|
|
478
|
-
const maybeTargetIndex = resolveTypeaheadMatch(items, nextQuery, maybeActiveItemIndex, isItemDisabledByIndex, itemToSearchText,
|
|
478
|
+
const maybeTargetIndex = resolveTypeaheadMatch(items, nextQuery, maybeActiveItemIndex, isItemDisabledByIndex, itemToSearchText, String.isNonEmpty(searchQuery));
|
|
479
479
|
return __foldkitBrandViewResult((Option.some(Message.Searched({ key, maybeTargetIndex }))), "@foldkit/ui/listbox/shared.js#searchForKey");
|
|
480
480
|
};
|
|
481
481
|
const resolveCommitMessage = () => {
|
|
@@ -486,12 +486,12 @@ export const makeView = (behavior) => {
|
|
|
486
486
|
return __foldkitBrandViewResult((Option.map(maybeActiveItemIndex, index => __foldkitBrandViewResult((Message.RequestedItemClick({ index })), "@foldkit/ui/listbox/shared.js#anonymous~35"))), "@foldkit/ui/listbox/shared.js#resolveCommitMessage");
|
|
487
487
|
}
|
|
488
488
|
};
|
|
489
|
-
const handleItemsKeyDown = (key) => __foldkitBrandViewResult((
|
|
489
|
+
const handleItemsKeyDown = (key) => __foldkitBrandViewResult((Match.value(key).pipe(Match.when('Escape', () => __foldkitBrandViewResult((Option.some(Message.Closed())), "@foldkit/ui/listbox/shared.js#anonymous~36")), Match.when('Enter', resolveCommitMessage), Match.when(' ', () => __foldkitBrandViewResult((String.isNonEmpty(searchQuery)
|
|
490
490
|
? searchForKey(' ')
|
|
491
|
-
: resolveCommitMessage()), "@foldkit/ui/listbox/shared.js#anonymous~37")),
|
|
491
|
+
: resolveCommitMessage()), "@foldkit/ui/listbox/shared.js#anonymous~37")), Match.when(isNavigationKey, () => __foldkitBrandViewResult((Option.some(Message.ActivatedItem({
|
|
492
492
|
index: resolveActiveIndex(key),
|
|
493
493
|
activationTrigger: 'Keyboard',
|
|
494
|
-
}))), "@foldkit/ui/listbox/shared.js#anonymous~38")),
|
|
494
|
+
}))), "@foldkit/ui/listbox/shared.js#anonymous~38")), Match.when(isPrintableKey, () => __foldkitBrandViewResult((searchForKey(key)), "@foldkit/ui/listbox/shared.js#anonymous~39")), Match.orElse(() => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/listbox/shared.js#anonymous~40")))), "@foldkit/ui/listbox/shared.js#handleItemsKeyDown");
|
|
495
495
|
const resolveButtonLabel = () => {
|
|
496
496
|
if (Predicate.isNotUndefined(ariaLabel)) {
|
|
497
497
|
return __foldkitBrandViewResult(([h.AriaLabel(ariaLabel)]), "@foldkit/ui/listbox/shared.js#resolveButtonLabel");
|
|
@@ -545,7 +545,7 @@ export const makeView = (behavior) => {
|
|
|
545
545
|
const itemsContainerAttributes = [
|
|
546
546
|
h.Id(`${id}-items`),
|
|
547
547
|
h.Role('listbox'),
|
|
548
|
-
h.AriaOrientation(
|
|
548
|
+
h.AriaOrientation(String.toLowerCase(orientation)),
|
|
549
549
|
...(behavior.ariaMultiSelectable ? [h.AriaMultiSelectable(true)] : []),
|
|
550
550
|
...(isReadOnly
|
|
551
551
|
? [h.AriaReadonly(true), h.DataAttribute('readonly', '')]
|
package/dist/listbox/single.d.ts
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import { Option, Schema
|
|
1
|
+
import { Option, Schema } from 'effect';
|
|
2
2
|
import { type Update } from 'foldkit';
|
|
3
3
|
import { type View as SubmodelView } from 'foldkit/submodel';
|
|
4
4
|
import { type BaseInitConfig, type BaseViewInputsCommon, type ItemToValueInput, Message, OutMessage } from './shared.js';
|
|
5
5
|
/** Schema for the single-select listbox's private interaction state (open/closed status, active item, activation trigger, typeahead search). The selection is owned by the parent and passed in via `ViewInputs.maybeSelectedValue`. */
|
|
6
|
-
export declare const Model:
|
|
7
|
-
readonly id:
|
|
8
|
-
readonly isOpen:
|
|
9
|
-
readonly isAnimated:
|
|
10
|
-
readonly isModal:
|
|
11
|
-
readonly orientation:
|
|
12
|
-
readonly animation:
|
|
13
|
-
readonly id:
|
|
14
|
-
readonly isShowing:
|
|
15
|
-
readonly transitionState:
|
|
6
|
+
export declare const Model: Schema.Struct<{
|
|
7
|
+
readonly id: Schema.String;
|
|
8
|
+
readonly isOpen: Schema.Boolean;
|
|
9
|
+
readonly isAnimated: Schema.Boolean;
|
|
10
|
+
readonly isModal: Schema.Boolean;
|
|
11
|
+
readonly orientation: Schema.Literals<readonly ["Vertical", "Horizontal"]>;
|
|
12
|
+
readonly animation: Schema.Struct<{
|
|
13
|
+
readonly id: Schema.String;
|
|
14
|
+
readonly isShowing: Schema.Boolean;
|
|
15
|
+
readonly transitionState: Schema.Literals<readonly ["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
|
|
16
16
|
}>;
|
|
17
|
-
readonly maybeActiveItemIndex:
|
|
18
|
-
readonly activationTrigger:
|
|
19
|
-
readonly searchQuery:
|
|
20
|
-
readonly searchVersion:
|
|
21
|
-
readonly maybeLastPointerPosition:
|
|
22
|
-
readonly screenX:
|
|
23
|
-
readonly screenY:
|
|
17
|
+
readonly maybeActiveItemIndex: Schema.Option<Schema.Number>;
|
|
18
|
+
readonly activationTrigger: Schema.Literals<readonly ["Pointer", "Keyboard"]>;
|
|
19
|
+
readonly searchQuery: Schema.String;
|
|
20
|
+
readonly searchVersion: Schema.Number;
|
|
21
|
+
readonly maybeLastPointerPosition: Schema.Option<Schema.Struct<{
|
|
22
|
+
readonly screenX: Schema.Number;
|
|
23
|
+
readonly screenY: Schema.Number;
|
|
24
24
|
}>>;
|
|
25
|
-
readonly maybeLastButtonPointerType:
|
|
25
|
+
readonly maybeLastButtonPointerType: Schema.Option<Schema.String>;
|
|
26
26
|
}>;
|
|
27
27
|
export type Model = typeof Model.Type;
|
|
28
28
|
/** Configuration for creating a single-select listbox model with `init`. `isAnimated` enables CSS transition coordination (default `false`). `isModal` locks page scroll and inerts other elements when open (default `false`). */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"single.d.ts","sourceRoot":"","sources":["../../src/listbox/single.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"single.d.ts","sourceRoot":"","sources":["../../src/listbox/single.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;AACvC,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,SAAS,CAAA;AACrC,OAAO,EAAE,KAAK,IAAI,IAAI,YAAY,EAAc,MAAM,kBAAkB,CAAA;AAExE,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,oBAAoB,EACzB,KAAK,gBAAgB,EACrB,OAAO,EACP,UAAU,EAIX,MAAM,aAAa,CAAA;AAIpB,wOAAwO;AACxO,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;EAEhB,CAAA;AAEF,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,IAAI,CAAA;AAIrC,mOAAmO;AACnO,MAAM,MAAM,UAAU,GAAG,cAAc,CAAA;AAEvC,4GAA4G;AAC5G,eAAO,MAAM,IAAI,WAAY,UAAU,KAAG,KAAyB,CAAA;AAInE;;qDAEqD;AACrD,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAElB,CAAA;AAED,KAAK,YAAY,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAA;AAE7C;6DAC6D;AAC7D,eAAO,MAAM,IAAI,UAAW,KAAK,KAAG,YACoC,CAAA;AAExE;;;eAGe;AACf,eAAO,MAAM,KAAK,UAAW,KAAK,KAAG,YACJ,CAAA;AAEjC,0IAA0I;AAC1I,eAAO,MAAM,UAAU,UAAW,KAAK,QAAQ,MAAM,KAAG,YACT,CAAA;AAI/C,uFAAuF;AACvF,MAAM,MAAM,UAAU,CACpB,IAAI,EACJ,KAAK,SAAS,MAAM,GAAG,MAAM,IAC3B,oBAAoB,CAAC,IAAI,CAAC,GAC5B,QAAQ,CAAC;IACP;;;;6CAIyC;IACzC,kBAAkB,EAAE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;CACzC,CAAC,GACF,gBAAgB,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;AAkB/B,KAAK,kBAAkB,CAAC,KAAK,SAAS,MAAM,IAAI,MAAM,CAAC,oBAAoB,CACzE,KAAK,EACL,OAAO,EACP,UAAU,CAAC,KAAK,CAAC,CAClB,CAAA;AAED;;;;uBAIuB;AACvB,MAAM,MAAM,MAAM,CAChB,IAAI,GAAG,MAAM,EACb,KAAK,SAAS,MAAM,GAAG,IAAI,SAAS,MAAM,GAAG,IAAI,GAAG,MAAM,IACxD,QAAQ,CAAC;IACX,IAAI,EAAE,YAAY,CAAC,KAAK,EAAE,OAAO,EAAE,UAAU,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAA;IAC3D,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,KAAK,kBAAkB,CAAC,KAAK,CAAC,CAAA;IACrE,UAAU,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,KAAK,kBAAkB,CAAC,KAAK,CAAC,CAAA;IACpE,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,kBAAkB,CAAC,KAAK,CAAC,CAAA;IACjD,KAAK,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,kBAAkB,CAAC,KAAK,CAAC,CAAA;CACnD,CAAC,CAAA;AAEF;;;;;;;;;;;;;;;;;;wDAkBwD;AACxD,eAAO,MAAM,MAAM,GACjB,IAAI,GAAG,MAAM,EACb,KAAK,SAAS,MAAM,GAAG,IAAI,SAAS,MAAM,GAAG,IAAI,GAAG,MAAM,OACvD,MAAM,CAAC,IAAI,EAAE,KAAK,CA2BtB,CAAA"}
|
package/dist/listbox/single.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
|
-
import { Option, Schema
|
|
2
|
+
import { Option, Schema } from 'effect';
|
|
3
3
|
import { defineView } from 'foldkit/submodel';
|
|
4
4
|
import { BaseModel, Message, OutMessage, baseInit, makeUpdate, makeView, } from './shared.js';
|
|
5
5
|
// MODEL
|
|
6
6
|
/** Schema for the single-select listbox's private interaction state (open/closed status, active item, activation trigger, typeahead search). The selection is owned by the parent and passed in via `ViewInputs.maybeSelectedValue`. */
|
|
7
|
-
export const Model =
|
|
7
|
+
export const Model = Schema.Struct({
|
|
8
8
|
...BaseModel.fields,
|
|
9
9
|
});
|
|
10
10
|
/** Creates an initial single-select listbox model from a config. Defaults to closed with no active item. */
|
package/dist/menu/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Effect, Option, Schema
|
|
1
|
+
import { Effect, Option, Schema } from 'effect';
|
|
2
2
|
import * as Command from 'foldkit/command';
|
|
3
3
|
import type { ChildAttribute, Html } from 'foldkit/html';
|
|
4
4
|
import * as Mount from 'foldkit/mount';
|
|
@@ -8,65 +8,65 @@ import { AnchorConfig } from '../anchor/index.js';
|
|
|
8
8
|
import { groupContiguous } from '../group.js';
|
|
9
9
|
import { resolveTypeaheadMatch } from '../typeahead.js';
|
|
10
10
|
/** Schema for the activation trigger: whether the user interacted via mouse or keyboard. */
|
|
11
|
-
export declare const ActivationTrigger:
|
|
11
|
+
export declare const ActivationTrigger: Schema.Literals<readonly ["Pointer", "Keyboard"]>;
|
|
12
12
|
export type ActivationTrigger = typeof ActivationTrigger.Type;
|
|
13
13
|
/** Schema for the menu component's state, tracking open/closed status, active item, activation trigger, and typeahead search. */
|
|
14
|
-
export declare const Model:
|
|
15
|
-
readonly id:
|
|
16
|
-
readonly isOpen:
|
|
17
|
-
readonly isAnimated:
|
|
18
|
-
readonly isModal:
|
|
19
|
-
readonly animation:
|
|
20
|
-
readonly id:
|
|
21
|
-
readonly isShowing:
|
|
22
|
-
readonly transitionState:
|
|
14
|
+
export declare const Model: Schema.Struct<{
|
|
15
|
+
readonly id: Schema.String;
|
|
16
|
+
readonly isOpen: Schema.Boolean;
|
|
17
|
+
readonly isAnimated: Schema.Boolean;
|
|
18
|
+
readonly isModal: Schema.Boolean;
|
|
19
|
+
readonly animation: Schema.Struct<{
|
|
20
|
+
readonly id: Schema.String;
|
|
21
|
+
readonly isShowing: Schema.Boolean;
|
|
22
|
+
readonly transitionState: Schema.Literals<readonly ["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
|
|
23
23
|
}>;
|
|
24
|
-
readonly maybeActiveItemIndex:
|
|
25
|
-
readonly activationTrigger:
|
|
26
|
-
readonly searchQuery:
|
|
27
|
-
readonly searchVersion:
|
|
28
|
-
readonly maybeLastPointerPosition:
|
|
29
|
-
readonly screenX:
|
|
30
|
-
readonly screenY:
|
|
24
|
+
readonly maybeActiveItemIndex: Schema.Option<Schema.Number>;
|
|
25
|
+
readonly activationTrigger: Schema.Literals<readonly ["Pointer", "Keyboard"]>;
|
|
26
|
+
readonly searchQuery: Schema.String;
|
|
27
|
+
readonly searchVersion: Schema.Number;
|
|
28
|
+
readonly maybeLastPointerPosition: Schema.Option<Schema.Struct<{
|
|
29
|
+
readonly screenX: Schema.Number;
|
|
30
|
+
readonly screenY: Schema.Number;
|
|
31
31
|
}>>;
|
|
32
|
-
readonly maybeLastButtonPointerType:
|
|
33
|
-
readonly maybePointerOrigin:
|
|
34
|
-
readonly screenX:
|
|
35
|
-
readonly screenY:
|
|
36
|
-
readonly timeStamp:
|
|
32
|
+
readonly maybeLastButtonPointerType: Schema.Option<Schema.String>;
|
|
33
|
+
readonly maybePointerOrigin: Schema.Option<Schema.Struct<{
|
|
34
|
+
readonly screenX: Schema.Number;
|
|
35
|
+
readonly screenY: Schema.Number;
|
|
36
|
+
readonly timeStamp: Schema.Number;
|
|
37
37
|
}>>;
|
|
38
38
|
}>;
|
|
39
39
|
export type Model = typeof Model.Type;
|
|
40
40
|
/** Union of all messages the menu component can produce. */
|
|
41
41
|
export declare const Message: import("foldkit/message").MessageUnion<{
|
|
42
42
|
readonly Opened: {
|
|
43
|
-
maybeActiveItemIndex:
|
|
43
|
+
maybeActiveItemIndex: Schema.Option<Schema.Number>;
|
|
44
44
|
};
|
|
45
45
|
readonly Closed: {};
|
|
46
46
|
readonly BlurredItems: {};
|
|
47
47
|
readonly ActivatedItem: {
|
|
48
|
-
index:
|
|
49
|
-
activationTrigger:
|
|
48
|
+
index: Schema.Number;
|
|
49
|
+
activationTrigger: Schema.Literals<readonly ["Pointer", "Keyboard"]>;
|
|
50
50
|
};
|
|
51
51
|
readonly DeactivatedItem: {};
|
|
52
52
|
readonly SelectedItem: {
|
|
53
|
-
index:
|
|
54
|
-
item:
|
|
53
|
+
index: Schema.Number;
|
|
54
|
+
item: Schema.String;
|
|
55
55
|
};
|
|
56
56
|
readonly RequestedItemClick: {
|
|
57
|
-
index:
|
|
57
|
+
index: Schema.Number;
|
|
58
58
|
};
|
|
59
59
|
readonly Searched: {
|
|
60
|
-
key:
|
|
61
|
-
maybeTargetIndex:
|
|
60
|
+
key: Schema.String;
|
|
61
|
+
maybeTargetIndex: Schema.Option<Schema.Number>;
|
|
62
62
|
};
|
|
63
63
|
readonly CompletedDelayClearSearch: {
|
|
64
|
-
version:
|
|
64
|
+
version: Schema.Number;
|
|
65
65
|
};
|
|
66
66
|
readonly MovedPointerOverItem: {
|
|
67
|
-
index:
|
|
68
|
-
screenX:
|
|
69
|
-
screenY:
|
|
67
|
+
index: Schema.Number;
|
|
68
|
+
screenX: Schema.Number;
|
|
69
|
+
screenY: Schema.Number;
|
|
70
70
|
};
|
|
71
71
|
readonly CompletedFocusItems: {};
|
|
72
72
|
readonly CompletedFocusButton: {};
|
|
@@ -89,16 +89,16 @@ export declare const Message: import("foldkit/message").MessageUnion<{
|
|
|
89
89
|
}>;
|
|
90
90
|
};
|
|
91
91
|
readonly PressedPointerOnButton: {
|
|
92
|
-
pointerType:
|
|
93
|
-
button:
|
|
94
|
-
screenX:
|
|
95
|
-
screenY:
|
|
96
|
-
timeStamp:
|
|
92
|
+
pointerType: Schema.String;
|
|
93
|
+
button: Schema.Number;
|
|
94
|
+
screenX: Schema.Number;
|
|
95
|
+
screenY: Schema.Number;
|
|
96
|
+
timeStamp: Schema.Number;
|
|
97
97
|
};
|
|
98
98
|
readonly ReleasedPointerOnItems: {
|
|
99
|
-
screenX:
|
|
100
|
-
screenY:
|
|
101
|
-
timeStamp:
|
|
99
|
+
screenX: Schema.Number;
|
|
100
|
+
screenY: Schema.Number;
|
|
101
|
+
timeStamp: Schema.Number;
|
|
102
102
|
};
|
|
103
103
|
}>;
|
|
104
104
|
export type Message = typeof Message.Type;
|
|
@@ -106,8 +106,8 @@ export type Message = typeof Message.Type;
|
|
|
106
106
|
* `Update.foldChild` config handles them through `foldOutMessage`. */
|
|
107
107
|
export declare const OutMessage: import("foldkit/message").MessageUnion<{
|
|
108
108
|
readonly Selected: {
|
|
109
|
-
value:
|
|
110
|
-
index:
|
|
109
|
+
value: Schema.String;
|
|
110
|
+
index: Schema.Number;
|
|
111
111
|
};
|
|
112
112
|
}>;
|
|
113
113
|
export type Selected<Value extends string = string> = Readonly<{
|
|
@@ -157,52 +157,52 @@ export declare const UnlockScroll: Command.CommandDefinitionNoArgs<"UnlockScroll
|
|
|
157
157
|
}, never, never>>;
|
|
158
158
|
/** Marks all elements outside the menu as inert for modal behavior. */
|
|
159
159
|
export declare const InertOthers: Command.CommandDefinitionWithArgs<"InertOthers", {
|
|
160
|
-
id:
|
|
160
|
+
id: Schema.String;
|
|
161
161
|
}, Effect.Effect<{
|
|
162
162
|
readonly _tag: "CompletedInertOthers";
|
|
163
163
|
}, never, never>>;
|
|
164
164
|
/** Removes the inert attribute from elements outside the menu. */
|
|
165
165
|
export declare const RestoreInert: Command.CommandDefinitionWithArgs<"RestoreInert", {
|
|
166
|
-
id:
|
|
166
|
+
id: Schema.String;
|
|
167
167
|
}, Effect.Effect<{
|
|
168
168
|
readonly _tag: "CompletedRestoreInert";
|
|
169
169
|
}, never, never>>;
|
|
170
170
|
/** Moves focus to the menu items container after opening. */
|
|
171
171
|
export declare const FocusItems: Command.CommandDefinitionWithArgs<"FocusItems", {
|
|
172
|
-
id:
|
|
172
|
+
id: Schema.String;
|
|
173
173
|
}, Effect.Effect<{
|
|
174
174
|
readonly _tag: "CompletedFocusItems";
|
|
175
175
|
}, never, never>>;
|
|
176
176
|
/** Moves focus back to the menu button after closing. */
|
|
177
177
|
export declare const FocusButton: Command.CommandDefinitionWithArgs<"FocusButton", {
|
|
178
|
-
id:
|
|
178
|
+
id: Schema.String;
|
|
179
179
|
}, Effect.Effect<{
|
|
180
180
|
readonly _tag: "CompletedFocusButton";
|
|
181
181
|
}, never, never>>;
|
|
182
182
|
/** Scrolls the active menu item into view after keyboard navigation. */
|
|
183
183
|
export declare const ScrollIntoView: Command.CommandDefinitionWithArgs<"ScrollIntoView", {
|
|
184
|
-
id:
|
|
185
|
-
index:
|
|
184
|
+
id: Schema.String;
|
|
185
|
+
index: Schema.Number;
|
|
186
186
|
}, Effect.Effect<{
|
|
187
187
|
readonly _tag: "CompletedScrollIntoView";
|
|
188
188
|
}, never, never>>;
|
|
189
189
|
/** Programmatically clicks the active menu item's DOM element. */
|
|
190
190
|
export declare const ClickItem: Command.CommandDefinitionWithArgs<"ClickItem", {
|
|
191
|
-
id:
|
|
192
|
-
index:
|
|
191
|
+
id: Schema.String;
|
|
192
|
+
index: Schema.Number;
|
|
193
193
|
}, Effect.Effect<{
|
|
194
194
|
readonly _tag: "CompletedClickItem";
|
|
195
195
|
}, never, never>>;
|
|
196
196
|
/** Waits for the typeahead search debounce period before clearing the query. */
|
|
197
197
|
export declare const DelayClearSearch: Command.CommandDefinitionWithArgs<"DelayClearSearch", {
|
|
198
|
-
version:
|
|
198
|
+
version: Schema.Number;
|
|
199
199
|
}, Effect.Effect<{
|
|
200
200
|
readonly _tag: "CompletedDelayClearSearch";
|
|
201
201
|
readonly version: number;
|
|
202
202
|
}, never, never>>;
|
|
203
203
|
/** Detects whether the menu button moved or the leave animation ended. Whichever comes first; both outcomes signal the Animation submodel that leave is complete. */
|
|
204
204
|
export declare const DetectMovementOrAnimationEnd: Command.CommandDefinitionWithArgs<"DetectMovementOrAnimationEnd", {
|
|
205
|
-
id:
|
|
205
|
+
id: Schema.String;
|
|
206
206
|
}, Effect.Effect<{
|
|
207
207
|
readonly _tag: "GotAnimationMessage";
|
|
208
208
|
readonly message: {
|
|
@@ -344,19 +344,19 @@ export declare const update: (model: Model, message: Message) => Readonly<{
|
|
|
344
344
|
* Exposed so Scene tests can call
|
|
345
345
|
* `Scene.Mount.resolve(AnchorMenu, Message.CompletedAnchorMenu())`. */
|
|
346
346
|
export declare const AnchorMenu: Mount.MountDefinitionWithArgs<"AnchorMenu", {
|
|
347
|
-
buttonId:
|
|
348
|
-
anchor:
|
|
349
|
-
readonly placement:
|
|
350
|
-
readonly gap:
|
|
351
|
-
readonly offset:
|
|
352
|
-
readonly padding:
|
|
353
|
-
readonly top:
|
|
354
|
-
readonly right:
|
|
355
|
-
readonly bottom:
|
|
356
|
-
readonly left:
|
|
347
|
+
buttonId: Schema.String;
|
|
348
|
+
anchor: Schema.Struct<{
|
|
349
|
+
readonly placement: Schema.optional<Schema.Literals<readonly ["top", "right", "bottom", "left", "top-start", "top-end", "right-start", "right-end", "bottom-start", "bottom-end", "left-start", "left-end"]>>;
|
|
350
|
+
readonly gap: Schema.optional<Schema.Number>;
|
|
351
|
+
readonly offset: Schema.optional<Schema.Number>;
|
|
352
|
+
readonly padding: Schema.optional<Schema.Union<readonly [Schema.Number, Schema.Struct<{
|
|
353
|
+
readonly top: Schema.optionalKey<Schema.Number>;
|
|
354
|
+
readonly right: Schema.optionalKey<Schema.Number>;
|
|
355
|
+
readonly bottom: Schema.optionalKey<Schema.Number>;
|
|
356
|
+
readonly left: Schema.optionalKey<Schema.Number>;
|
|
357
357
|
}>]>>;
|
|
358
|
-
readonly portal:
|
|
359
|
-
readonly isPlacementLocked:
|
|
358
|
+
readonly portal: Schema.optional<Schema.Boolean>;
|
|
359
|
+
readonly isPlacementLocked: Schema.optional<Schema.Boolean>;
|
|
360
360
|
}>;
|
|
361
361
|
}, {
|
|
362
362
|
readonly _tag: "CompletedAnchorMenu";
|