@foldkit/ui 0.148.2 → 0.149.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/animation/index.d.ts +3 -3
- package/dist/animation/index.d.ts.map +1 -1
- package/dist/animation/index.js +2 -2
- 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 +12 -21
- package/dist/animation/schema.d.ts.map +1 -1
- package/dist/animation/schema.js +11 -15
- package/dist/animation/update.d.ts +1 -1
- package/dist/animation/update.d.ts.map +1 -1
- package/dist/animation/update.js +9 -9
- package/dist/calendar/index.d.ts +50 -105
- package/dist/calendar/index.d.ts.map +1 -1
- package/dist/calendar/index.js +61 -98
- package/dist/calendar/public.d.ts +1 -1
- package/dist/calendar/public.d.ts.map +1 -1
- package/dist/calendar/public.js +1 -1
- package/dist/combobox/multi.d.ts +9 -9
- package/dist/combobox/multi.d.ts.map +1 -1
- package/dist/combobox/multi.js +9 -9
- package/dist/combobox/public.d.ts +1 -1
- package/dist/combobox/public.d.ts.map +1 -1
- package/dist/combobox/public.js +1 -1
- package/dist/combobox/shared.d.ts +93 -137
- package/dist/combobox/shared.d.ts.map +1 -1
- package/dist/combobox/shared.js +108 -153
- package/dist/combobox/single.d.ts +9 -9
- package/dist/combobox/single.d.ts.map +1 -1
- package/dist/combobox/single.js +10 -10
- package/dist/datePicker/index.d.ts +88 -84
- package/dist/datePicker/index.d.ts.map +1 -1
- package/dist/datePicker/index.js +33 -63
- package/dist/datePicker/public.d.ts +1 -1
- package/dist/datePicker/public.d.ts.map +1 -1
- package/dist/datePicker/public.js +1 -1
- package/dist/dialog/index.d.ts +28 -49
- package/dist/dialog/index.d.ts.map +1 -1
- package/dist/dialog/index.js +39 -67
- package/dist/dialog/public.d.ts +1 -1
- package/dist/dialog/public.d.ts.map +1 -1
- package/dist/dialog/public.js +1 -1
- package/dist/dragAndDrop/index.d.ts +45 -72
- package/dist/dragAndDrop/index.d.ts.map +1 -1
- package/dist/dragAndDrop/index.js +72 -93
- package/dist/dragAndDrop/public.d.ts +1 -1
- package/dist/dragAndDrop/public.d.ts.map +1 -1
- package/dist/dragAndDrop/public.js +1 -1
- package/dist/fileDrop/index.d.ts +14 -35
- package/dist/fileDrop/index.d.ts.map +1 -1
- package/dist/fileDrop/index.js +20 -46
- package/dist/fileDrop/public.d.ts +1 -1
- package/dist/fileDrop/public.d.ts.map +1 -1
- package/dist/fileDrop/public.js +1 -1
- package/dist/listbox/multi.d.ts +7 -7
- package/dist/listbox/multi.d.ts.map +1 -1
- package/dist/listbox/multi.js +8 -8
- package/dist/listbox/public.d.ts +1 -1
- package/dist/listbox/public.d.ts.map +1 -1
- package/dist/listbox/public.js +1 -1
- package/dist/listbox/shared.d.ts +80 -127
- package/dist/listbox/shared.d.ts.map +1 -1
- package/dist/listbox/shared.js +92 -149
- package/dist/listbox/single.d.ts +7 -7
- package/dist/listbox/single.d.ts.map +1 -1
- package/dist/listbox/single.js +8 -8
- package/dist/menu/index.d.ts +86 -134
- package/dist/menu/index.d.ts.map +1 -1
- package/dist/menu/index.js +141 -189
- package/dist/menu/public.d.ts +1 -1
- package/dist/menu/public.d.ts.map +1 -1
- package/dist/menu/public.js +1 -1
- package/dist/popover/index.d.ts +39 -65
- package/dist/popover/index.d.ts.map +1 -1
- package/dist/popover/index.js +68 -98
- package/dist/popover/public.d.ts +1 -1
- package/dist/popover/public.d.ts.map +1 -1
- package/dist/popover/public.js +1 -1
- package/dist/radioGroup/index.d.ts +18 -29
- package/dist/radioGroup/index.d.ts.map +1 -1
- package/dist/radioGroup/index.js +22 -27
- package/dist/radioGroup/public.d.ts +1 -1
- package/dist/radioGroup/public.d.ts.map +1 -1
- package/dist/radioGroup/public.js +1 -1
- package/dist/slider/index.d.ts +29 -51
- package/dist/slider/index.d.ts.map +1 -1
- package/dist/slider/index.js +36 -56
- package/dist/slider/public.d.ts +1 -1
- package/dist/slider/public.d.ts.map +1 -1
- package/dist/slider/public.js +1 -1
- package/dist/tabs/index.d.ts +18 -28
- package/dist/tabs/index.d.ts.map +1 -1
- package/dist/tabs/index.js +22 -26
- package/dist/tabs/public.d.ts +1 -1
- package/dist/tabs/public.d.ts.map +1 -1
- package/dist/tabs/public.js +1 -1
- package/dist/test/apps/disabledButton.d.ts +71 -14
- package/dist/test/apps/disabledButton.d.ts.map +1 -1
- package/dist/test/apps/disabledButton.js +14 -13
- package/dist/toast/index.d.ts +124 -109
- package/dist/toast/index.d.ts.map +1 -1
- package/dist/toast/index.js +5 -5
- package/dist/toast/public.d.ts +1 -1
- package/dist/toast/public.d.ts.map +1 -1
- package/dist/toast/public.js +1 -1
- package/dist/toast/schema.d.ts +72 -84
- package/dist/toast/schema.d.ts.map +1 -1
- package/dist/toast/schema.js +31 -41
- package/dist/toast/test.d.ts.map +1 -1
- package/dist/toast/test.js +6 -3
- package/dist/toast/update.d.ts +104 -89
- package/dist/toast/update.d.ts.map +1 -1
- package/dist/toast/update.js +19 -20
- package/dist/tooltip/message.d.ts +26 -47
- package/dist/tooltip/message.d.ts.map +1 -1
- package/dist/tooltip/message.js +15 -40
- package/dist/tooltip/public.d.ts +1 -1
- package/dist/tooltip/public.d.ts.map +1 -1
- package/dist/tooltip/public.js +1 -1
- package/dist/tooltip/tooltip.d.ts +1 -1
- package/dist/tooltip/tooltip.d.ts.map +1 -1
- package/dist/tooltip/tooltip.js +15 -16
- package/dist/virtualList/index.d.ts +46 -23
- package/dist/virtualList/index.d.ts.map +1 -1
- package/dist/virtualList/index.js +12 -23
- package/dist/virtualList/public.d.ts +1 -1
- package/dist/virtualList/public.d.ts.map +1 -1
- package/dist/virtualList/public.js +1 -1
- package/package.json +3 -3
|
@@ -3,7 +3,7 @@ import { Array, Effect, Equal, Equivalence, Match as M, Option, Queue, Schema as
|
|
|
3
3
|
import * as Command from 'foldkit/command';
|
|
4
4
|
import * as Dom from 'foldkit/dom';
|
|
5
5
|
import { inertHtml as ih } from 'foldkit/html';
|
|
6
|
-
import {
|
|
6
|
+
import { defineMessageUnion } from 'foldkit/message';
|
|
7
7
|
import { ts } from 'foldkit/schema';
|
|
8
8
|
import { evo } from 'foldkit/struct';
|
|
9
9
|
import * as Subscription from 'foldkit/subscription';
|
|
@@ -53,80 +53,59 @@ export const Model = S.Struct({
|
|
|
53
53
|
dragState: DragState,
|
|
54
54
|
});
|
|
55
55
|
// MESSAGE
|
|
56
|
-
/** The user pressed a pointer on a draggable item. */
|
|
57
|
-
export const PressedDraggable = m('PressedDraggable', {
|
|
58
|
-
itemId: S.String,
|
|
59
|
-
containerId: S.String,
|
|
60
|
-
index: S.Number,
|
|
61
|
-
screenX: S.Number,
|
|
62
|
-
screenY: S.Number,
|
|
63
|
-
});
|
|
64
|
-
/** The pointer moved during a drag, with collision detection results. */
|
|
65
|
-
export const MovedPointer = m('MovedPointer', {
|
|
66
|
-
screenX: S.Number,
|
|
67
|
-
screenY: S.Number,
|
|
68
|
-
clientX: S.Number,
|
|
69
|
-
clientY: S.Number,
|
|
70
|
-
maybeDropTarget: S.Option(DropTarget),
|
|
71
|
-
});
|
|
72
|
-
/** The pointer was released. */
|
|
73
|
-
export const ReleasedPointer = m('ReleasedPointer');
|
|
74
|
-
/** Escape was pressed during a drag. */
|
|
75
|
-
export const CancelledDrag = m('CancelledDrag');
|
|
76
|
-
/** The user activated keyboard drag with Space or Enter on a focused draggable. */
|
|
77
|
-
export const ActivatedKeyboardDrag = m('ActivatedKeyboardDrag', {
|
|
78
|
-
itemId: S.String,
|
|
79
|
-
containerId: S.String,
|
|
80
|
-
index: S.Number,
|
|
81
|
-
});
|
|
82
|
-
/** The ResolveKeyboardMove Command resolved the next keyboard drag position. */
|
|
83
|
-
export const CompletedResolveKeyboardMove = m('CompletedResolveKeyboardMove', {
|
|
84
|
-
targetContainerId: S.String,
|
|
85
|
-
targetIndex: S.Number,
|
|
86
|
-
});
|
|
87
|
-
/** The user confirmed a keyboard drop with Space or Enter. */
|
|
88
|
-
export const ConfirmedKeyboardDrop = m('ConfirmedKeyboardDrop');
|
|
89
|
-
/** The user pressed an arrow key during keyboard drag. */
|
|
90
|
-
export const PressedArrowKey = m('PressedArrowKey', {
|
|
91
|
-
direction: S.Literals([
|
|
92
|
-
'Up',
|
|
93
|
-
'Down',
|
|
94
|
-
'Left',
|
|
95
|
-
'Right',
|
|
96
|
-
'NextContainer',
|
|
97
|
-
'PreviousContainer',
|
|
98
|
-
]),
|
|
99
|
-
});
|
|
100
|
-
/** An animation frame fired during auto-scroll. */
|
|
101
|
-
export const AdvancedAutoScrollFrame = m('AdvancedAutoScrollFrame');
|
|
102
|
-
/** The FocusItem Command completed. */
|
|
103
|
-
export const CompletedFocusItem = m('CompletedFocusItem');
|
|
104
56
|
/** Union of all messages the drag-and-drop component can produce. */
|
|
105
|
-
export const Message =
|
|
106
|
-
PressedDraggable
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
57
|
+
export const Message = defineMessageUnion({
|
|
58
|
+
PressedDraggable: {
|
|
59
|
+
itemId: S.String,
|
|
60
|
+
containerId: S.String,
|
|
61
|
+
index: S.Number,
|
|
62
|
+
screenX: S.Number,
|
|
63
|
+
screenY: S.Number,
|
|
64
|
+
},
|
|
65
|
+
MovedPointer: {
|
|
66
|
+
screenX: S.Number,
|
|
67
|
+
screenY: S.Number,
|
|
68
|
+
clientX: S.Number,
|
|
69
|
+
clientY: S.Number,
|
|
70
|
+
maybeDropTarget: S.Option(DropTarget),
|
|
71
|
+
},
|
|
72
|
+
ReleasedPointer: {},
|
|
73
|
+
CancelledDrag: {},
|
|
74
|
+
ActivatedKeyboardDrag: {
|
|
75
|
+
itemId: S.String,
|
|
76
|
+
containerId: S.String,
|
|
77
|
+
index: S.Number,
|
|
78
|
+
},
|
|
79
|
+
CompletedResolveKeyboardMove: {
|
|
80
|
+
targetContainerId: S.String,
|
|
81
|
+
targetIndex: S.Number,
|
|
82
|
+
},
|
|
83
|
+
ConfirmedKeyboardDrop: {},
|
|
84
|
+
PressedArrowKey: {
|
|
85
|
+
direction: S.Literals([
|
|
86
|
+
'Up',
|
|
87
|
+
'Down',
|
|
88
|
+
'Left',
|
|
89
|
+
'Right',
|
|
90
|
+
'NextContainer',
|
|
91
|
+
'PreviousContainer',
|
|
92
|
+
]),
|
|
93
|
+
},
|
|
94
|
+
AdvancedAutoScrollFrame: {},
|
|
95
|
+
CompletedFocusItem: {},
|
|
125
96
|
});
|
|
126
|
-
|
|
127
|
-
export const Cancelled = m('Cancelled');
|
|
97
|
+
// OUT MESSAGE
|
|
128
98
|
/** Union of all out-messages the drag-and-drop component can emit to its parent. */
|
|
129
|
-
export const OutMessage =
|
|
99
|
+
export const OutMessage = defineMessageUnion({
|
|
100
|
+
Reordered: {
|
|
101
|
+
itemId: S.String,
|
|
102
|
+
fromContainerId: S.String,
|
|
103
|
+
fromIndex: S.Number,
|
|
104
|
+
toContainerId: S.String,
|
|
105
|
+
toIndex: S.Number,
|
|
106
|
+
},
|
|
107
|
+
Cancelled: {},
|
|
108
|
+
});
|
|
130
109
|
// INIT
|
|
131
110
|
/** Configuration for creating a drag-and-drop model with `init`. */
|
|
132
111
|
const DEFAULT_ACTIVATION_THRESHOLD_PIXELS = 5;
|
|
@@ -140,13 +119,13 @@ export const init = (config) => (__foldkitBrandViewResult(({
|
|
|
140
119
|
/** Focuses a draggable item by ID after a keyboard move, drop, or cancel. */
|
|
141
120
|
export const FocusItem = Command.define('FocusItem', {
|
|
142
121
|
args: { itemId: S.String },
|
|
143
|
-
messages: [CompletedFocusItem],
|
|
144
|
-
execute: ({ itemId }) => __foldkitBrandViewResult((Dom.focus(attributeSelector('data-draggable-id', itemId)).pipe(Effect.ignore, Effect.as(CompletedFocusItem()))), "@foldkit/ui/dragAndDrop/index.js#execute"),
|
|
122
|
+
messages: [Message.CompletedFocusItem],
|
|
123
|
+
execute: ({ itemId }) => __foldkitBrandViewResult((Dom.focus(attributeSelector('data-draggable-id', itemId)).pipe(Effect.ignore, Effect.as(Message.CompletedFocusItem()))), "@foldkit/ui/dragAndDrop/index.js#execute"),
|
|
145
124
|
});
|
|
146
125
|
const resolveWithinContainer = (config) => {
|
|
147
126
|
const container = document.querySelector(attributeSelector('data-droppable-id', config.containerId));
|
|
148
127
|
if (!container) {
|
|
149
|
-
return __foldkitBrandViewResult((CompletedResolveKeyboardMove({
|
|
128
|
+
return __foldkitBrandViewResult((Message.CompletedResolveKeyboardMove({
|
|
150
129
|
targetContainerId: config.containerId,
|
|
151
130
|
targetIndex: config.currentIndex,
|
|
152
131
|
})), "@foldkit/ui/dragAndDrop/index.js#resolveWithinContainer");
|
|
@@ -155,7 +134,7 @@ const resolveWithinContainer = (config) => {
|
|
|
155
134
|
const nextIndex = config.isForward
|
|
156
135
|
? Math.min(config.currentIndex + 1, itemCount)
|
|
157
136
|
: Math.max(config.currentIndex - 1, 0);
|
|
158
|
-
return __foldkitBrandViewResult((CompletedResolveKeyboardMove({
|
|
137
|
+
return __foldkitBrandViewResult((Message.CompletedResolveKeyboardMove({
|
|
159
138
|
targetContainerId: config.containerId,
|
|
160
139
|
targetIndex: nextIndex,
|
|
161
140
|
})), "@foldkit/ui/dragAndDrop/index.js#resolveWithinContainer");
|
|
@@ -168,7 +147,7 @@ const resolveBetweenContainers = (config) => {
|
|
|
168
147
|
: Math.max(currentContainerIndex - 1, 0);
|
|
169
148
|
const nextContainerId = allContainers[nextContainerIndex]?.dataset['droppableId'] ??
|
|
170
149
|
config.currentContainerId;
|
|
171
|
-
return __foldkitBrandViewResult((CompletedResolveKeyboardMove({
|
|
150
|
+
return __foldkitBrandViewResult((Message.CompletedResolveKeyboardMove({
|
|
172
151
|
targetContainerId: nextContainerId,
|
|
173
152
|
targetIndex: 0,
|
|
174
153
|
})), "@foldkit/ui/dragAndDrop/index.js#resolveBetweenContainers");
|
|
@@ -205,12 +184,12 @@ export const ResolveKeyboardMove = Command.define('ResolveKeyboardMove', {
|
|
|
205
184
|
'PreviousContainer',
|
|
206
185
|
]),
|
|
207
186
|
},
|
|
208
|
-
messages: [CompletedResolveKeyboardMove],
|
|
187
|
+
messages: [Message.CompletedResolveKeyboardMove],
|
|
209
188
|
execute: resolveKeyboardMoveTarget,
|
|
210
189
|
});
|
|
211
190
|
const withUpdateReturn = M.withReturnType();
|
|
212
191
|
/** Processes a drag-and-drop message and returns the next model, commands, and an optional out-message for the parent. */
|
|
213
|
-
export const update = (model, message) => __foldkitBrandViewResult((
|
|
192
|
+
export const update = (model, message) => __foldkitBrandViewResult((Message.match(message, {
|
|
214
193
|
PressedDraggable: ({ itemId, containerId, index, screenX, screenY }) => __foldkitBrandViewResult(([
|
|
215
194
|
evo(model, {
|
|
216
195
|
dragState: () => __foldkitBrandViewResult((Pending({
|
|
@@ -263,12 +242,12 @@ export const update = (model, message) => __foldkitBrandViewResult((M.value(mess
|
|
|
263
242
|
onNone: () => __foldkitBrandViewResult(([
|
|
264
243
|
evo(model, { dragState: () => __foldkitBrandViewResult((Idle()), "@foldkit/ui/dragAndDrop/index.js#dragState~5") }),
|
|
265
244
|
[],
|
|
266
|
-
Option.some(Cancelled()),
|
|
245
|
+
Option.some(OutMessage.Cancelled()),
|
|
267
246
|
]), "@foldkit/ui/dragAndDrop/index.js#onNone"),
|
|
268
247
|
onSome: dropTarget => __foldkitBrandViewResult(([
|
|
269
248
|
evo(model, { dragState: () => __foldkitBrandViewResult((Idle()), "@foldkit/ui/dragAndDrop/index.js#dragState~6") }),
|
|
270
249
|
[],
|
|
271
|
-
Option.some(Reordered({
|
|
250
|
+
Option.some(OutMessage.Reordered({
|
|
272
251
|
itemId: dragging.itemId,
|
|
273
252
|
fromContainerId: dragging.sourceContainerId,
|
|
274
253
|
fromIndex: dragging.sourceIndex,
|
|
@@ -279,7 +258,7 @@ export const update = (model, message) => __foldkitBrandViewResult((M.value(mess
|
|
|
279
258
|
})), "@foldkit/ui/dragAndDrop/index.js#anonymous~13")), M.orElse(() => __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/dragAndDrop/index.js#anonymous~14")))), "@foldkit/ui/dragAndDrop/index.js#ReleasedPointer"),
|
|
280
259
|
CancelledDrag: () => {
|
|
281
260
|
const maybeFocusCommand = Option.liftPredicate(model.dragState, dragState => __foldkitBrandViewResult((dragState._tag === 'KeyboardDragging'), "@foldkit/ui/dragAndDrop/index.js#anonymous~15")).pipe(Option.map(({ itemId }) => __foldkitBrandViewResult((FocusItem({ itemId })), "@foldkit/ui/dragAndDrop/index.js#anonymous~16")));
|
|
282
|
-
const maybeOutMessage = Option.liftPredicate(model.dragState._tag, _tag => __foldkitBrandViewResult((_tag === 'Dragging' || _tag === 'KeyboardDragging'), "@foldkit/ui/dragAndDrop/index.js#anonymous~17")).pipe(Option.map(() => __foldkitBrandViewResult((Cancelled()), "@foldkit/ui/dragAndDrop/index.js#anonymous~18")));
|
|
261
|
+
const maybeOutMessage = Option.liftPredicate(model.dragState._tag, _tag => __foldkitBrandViewResult((_tag === 'Dragging' || _tag === 'KeyboardDragging'), "@foldkit/ui/dragAndDrop/index.js#anonymous~17")).pipe(Option.map(() => __foldkitBrandViewResult((OutMessage.Cancelled()), "@foldkit/ui/dragAndDrop/index.js#anonymous~18")));
|
|
283
262
|
return __foldkitBrandViewResult(([
|
|
284
263
|
evo(model, { dragState: () => __foldkitBrandViewResult((Idle()), "@foldkit/ui/dragAndDrop/index.js#dragState~7") }),
|
|
285
264
|
Option.toArray(maybeFocusCommand),
|
|
@@ -313,7 +292,7 @@ export const update = (model, message) => __foldkitBrandViewResult((M.value(mess
|
|
|
313
292
|
ConfirmedKeyboardDrop: () => __foldkitBrandViewResult((M.value(model.dragState).pipe(withUpdateReturn, M.tag('KeyboardDragging', keyboardDragging => __foldkitBrandViewResult(([
|
|
314
293
|
evo(model, { dragState: () => __foldkitBrandViewResult((Idle()), "@foldkit/ui/dragAndDrop/index.js#dragState~10") }),
|
|
315
294
|
[FocusItem({ itemId: keyboardDragging.itemId })],
|
|
316
|
-
Option.some(Reordered({
|
|
295
|
+
Option.some(OutMessage.Reordered({
|
|
317
296
|
itemId: keyboardDragging.itemId,
|
|
318
297
|
fromContainerId: keyboardDragging.sourceContainerId,
|
|
319
298
|
fromIndex: keyboardDragging.sourceIndex,
|
|
@@ -335,7 +314,7 @@ export const update = (model, message) => __foldkitBrandViewResult((M.value(mess
|
|
|
335
314
|
]), "@foldkit/ui/dragAndDrop/index.js#anonymous~23")), M.orElse(() => __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/dragAndDrop/index.js#anonymous~24")))), "@foldkit/ui/dragAndDrop/index.js#PressedArrowKey"),
|
|
336
315
|
AdvancedAutoScrollFrame: () => __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/dragAndDrop/index.js#AdvancedAutoScrollFrame"),
|
|
337
316
|
CompletedFocusItem: () => __foldkitBrandViewResult(([model, [], Option.none()]), "@foldkit/ui/dragAndDrop/index.js#CompletedFocusItem"),
|
|
338
|
-
}))
|
|
317
|
+
})), "@foldkit/ui/dragAndDrop/index.js#update");
|
|
339
318
|
// SUBSCRIPTION
|
|
340
319
|
const DragActivity = S.Literals(['Idle', 'Active']);
|
|
341
320
|
const PointerDragActivity = S.Literals(['Idle', 'Active']);
|
|
@@ -386,13 +365,13 @@ export const subscriptions = Subscription.make()(entry => (__foldkitBrandViewRes
|
|
|
386
365
|
orientation: model.orientation,
|
|
387
366
|
}), "@foldkit/ui/dragAndDrop/index.js#modelToDependencies")),
|
|
388
367
|
dependenciesToStream: ({ dragActivity, orientation }) => {
|
|
389
|
-
const pointerEvents = Stream.merge(Stream.fromEventListener(document, 'pointermove').pipe(Stream.mapEffect(event => __foldkitBrandViewResult((Effect.sync(() => __foldkitBrandViewResult((MovedPointer({
|
|
368
|
+
const pointerEvents = Stream.merge(Stream.fromEventListener(document, 'pointermove').pipe(Stream.mapEffect(event => __foldkitBrandViewResult((Effect.sync(() => __foldkitBrandViewResult((Message.MovedPointer({
|
|
390
369
|
screenX: event.screenX,
|
|
391
370
|
screenY: event.screenY,
|
|
392
371
|
clientX: event.clientX,
|
|
393
372
|
clientY: event.clientY,
|
|
394
373
|
maybeDropTarget: resolveDropTarget(event.clientX, event.clientY, orientation),
|
|
395
|
-
})), "@foldkit/ui/dragAndDrop/index.js#anonymous~39"))), "@foldkit/ui/dragAndDrop/index.js#anonymous~38"))), Stream.fromEventListener(document, 'pointerup').pipe(Stream.map(() => __foldkitBrandViewResult((ReleasedPointer()), "@foldkit/ui/dragAndDrop/index.js#anonymous~40"))));
|
|
374
|
+
})), "@foldkit/ui/dragAndDrop/index.js#anonymous~39"))), "@foldkit/ui/dragAndDrop/index.js#anonymous~38"))), Stream.fromEventListener(document, 'pointerup').pipe(Stream.map(() => __foldkitBrandViewResult((Message.ReleasedPointer()), "@foldkit/ui/dragAndDrop/index.js#anonymous~40"))));
|
|
396
375
|
// NOTE: prevents text selection and locks cursor to grabbing during
|
|
397
376
|
// pointer drag. Uses a <style> element for cursor because inline styles
|
|
398
377
|
// on <html> don't override descendant elements' cursor values.
|
|
@@ -415,7 +394,7 @@ export const subscriptions = Subscription.make()(entry => (__foldkitBrandViewRes
|
|
|
415
394
|
modelToDependencies: model => (__foldkitBrandViewResult(({
|
|
416
395
|
dragActivity: dragActivityFromModel(model),
|
|
417
396
|
}), "@foldkit/ui/dragAndDrop/index.js#modelToDependencies~2")),
|
|
418
|
-
dependenciesToStream: ({ dragActivity }) => __foldkitBrandViewResult((Stream.when(Stream.fromEventListener(document, 'keydown').pipe(Stream.filter(({ key }) => __foldkitBrandViewResult((key === 'Escape'), "@foldkit/ui/dragAndDrop/index.js#anonymous~47")), Stream.map(() => __foldkitBrandViewResult((CancelledDrag()), "@foldkit/ui/dragAndDrop/index.js#anonymous~48"))), Effect.sync(() => __foldkitBrandViewResult((dragActivity === 'Active'), "@foldkit/ui/dragAndDrop/index.js#anonymous~49")))), "@foldkit/ui/dragAndDrop/index.js#dependenciesToStream~2"),
|
|
397
|
+
dependenciesToStream: ({ dragActivity }) => __foldkitBrandViewResult((Stream.when(Stream.fromEventListener(document, 'keydown').pipe(Stream.filter(({ key }) => __foldkitBrandViewResult((key === 'Escape'), "@foldkit/ui/dragAndDrop/index.js#anonymous~47")), Stream.map(() => __foldkitBrandViewResult((Message.CancelledDrag()), "@foldkit/ui/dragAndDrop/index.js#anonymous~48"))), Effect.sync(() => __foldkitBrandViewResult((dragActivity === 'Active'), "@foldkit/ui/dragAndDrop/index.js#anonymous~49")))), "@foldkit/ui/dragAndDrop/index.js#dependenciesToStream~2"),
|
|
419
398
|
}),
|
|
420
399
|
documentKeyboard: entry({ dragActivity: KeyboardDragActivity }, {
|
|
421
400
|
modelToDependencies: model => (__foldkitBrandViewResult(({
|
|
@@ -430,7 +409,7 @@ export const subscriptions = Subscription.make()(entry => (__foldkitBrandViewRes
|
|
|
430
409
|
}
|
|
431
410
|
if (event.key === 'Tab') {
|
|
432
411
|
event.preventDefault();
|
|
433
|
-
return __foldkitBrandViewResult((Option.some(PressedArrowKey({
|
|
412
|
+
return __foldkitBrandViewResult((Option.some(Message.PressedArrowKey({
|
|
434
413
|
direction: event.shiftKey
|
|
435
414
|
? 'PreviousContainer'
|
|
436
415
|
: 'NextContainer',
|
|
@@ -438,11 +417,11 @@ export const subscriptions = Subscription.make()(entry => (__foldkitBrandViewRes
|
|
|
438
417
|
}
|
|
439
418
|
if (event.key === ' ' || event.key === 'Enter') {
|
|
440
419
|
event.preventDefault();
|
|
441
|
-
return __foldkitBrandViewResult((Option.some(ConfirmedKeyboardDrop())), "@foldkit/ui/dragAndDrop/index.js#anonymous~51");
|
|
420
|
+
return __foldkitBrandViewResult((Option.some(Message.ConfirmedKeyboardDrop())), "@foldkit/ui/dragAndDrop/index.js#anonymous~51");
|
|
442
421
|
}
|
|
443
422
|
return __foldkitBrandViewResult((Option.map(arrowKeyToDirection(event.key), direction => {
|
|
444
423
|
event.preventDefault();
|
|
445
|
-
return __foldkitBrandViewResult((PressedArrowKey({ direction })), "@foldkit/ui/dragAndDrop/index.js#anonymous~52");
|
|
424
|
+
return __foldkitBrandViewResult((Message.PressedArrowKey({ direction })), "@foldkit/ui/dragAndDrop/index.js#anonymous~52");
|
|
446
425
|
})), "@foldkit/ui/dragAndDrop/index.js#anonymous~51");
|
|
447
426
|
})), "@foldkit/ui/dragAndDrop/index.js#anonymous~50")), Stream.filter(Option.isSome), Stream.map(option => __foldkitBrandViewResult((option.value), "@foldkit/ui/dragAndDrop/index.js#anonymous~53"))), Effect.sync(() => __foldkitBrandViewResult((dragActivity === 'Active'), "@foldkit/ui/dragAndDrop/index.js#anonymous~54")))), "@foldkit/ui/dragAndDrop/index.js#dependenciesToStream~3"),
|
|
448
427
|
}),
|
|
@@ -463,7 +442,7 @@ export const subscriptions = Subscription.make()(entry => (__foldkitBrandViewRes
|
|
|
463
442
|
const ref = { id: 0 };
|
|
464
443
|
const step = () => {
|
|
465
444
|
autoScroll(readDependencies().clientY);
|
|
466
|
-
Queue.offerUnsafe(queue, AdvancedAutoScrollFrame());
|
|
445
|
+
Queue.offerUnsafe(queue, Message.AdvancedAutoScrollFrame());
|
|
467
446
|
ref.id = requestAnimationFrame(step);
|
|
468
447
|
};
|
|
469
448
|
ref.id = requestAnimationFrame(step);
|
|
@@ -480,7 +459,7 @@ export const draggable = (config, h) => {
|
|
|
480
459
|
const handleKeyDown = (key) => {
|
|
481
460
|
if (isKeyboardDragActivationKey(key) &&
|
|
482
461
|
config.model.dragState._tag === 'Idle') {
|
|
483
|
-
return __foldkitBrandViewResult((Option.some(config.toParentMessage(ActivatedKeyboardDrag({
|
|
462
|
+
return __foldkitBrandViewResult((Option.some(config.toParentMessage(Message.ActivatedKeyboardDrag({
|
|
484
463
|
itemId: config.itemId,
|
|
485
464
|
containerId: config.containerId,
|
|
486
465
|
index: config.index,
|
|
@@ -494,7 +473,7 @@ export const draggable = (config, h) => {
|
|
|
494
473
|
h.Role('option'),
|
|
495
474
|
h.AriaRoleDescription('draggable'),
|
|
496
475
|
h.Tabindex(0),
|
|
497
|
-
h.OnPointerDown((_pointerType, button, screenX, screenY) => __foldkitBrandViewResult((pipe(button, Option.liftPredicate(Equal.equals(LEFT_MOUSE_BUTTON)), Option.map(() => __foldkitBrandViewResult((config.toParentMessage(PressedDraggable({
|
|
476
|
+
h.OnPointerDown((_pointerType, button, screenX, screenY) => __foldkitBrandViewResult((pipe(button, Option.liftPredicate(Equal.equals(LEFT_MOUSE_BUTTON)), Option.map(() => __foldkitBrandViewResult((config.toParentMessage(Message.PressedDraggable({
|
|
498
477
|
itemId: config.itemId,
|
|
499
478
|
containerId: config.containerId,
|
|
500
479
|
index: config.index,
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { init, update, draggable, droppable, sortable, ghostStyle, isDragging, maybeDraggedItemId, maybeDropTarget, subscriptions, Model, Message, OutMessage,
|
|
1
|
+
export { init, update, draggable, droppable, sortable, ghostStyle, isDragging, maybeDraggedItemId, maybeDropTarget, subscriptions, Model, Message, OutMessage, FocusItem, ResolveKeyboardMove, } from './index.js';
|
|
2
2
|
export type { InitConfig, DraggableConfig, DraggableMessage } from './index.js';
|
|
3
3
|
//# sourceMappingURL=public.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/dragAndDrop/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,SAAS,EACT,QAAQ,EACR,UAAU,EACV,UAAU,EACV,kBAAkB,EAClB,eAAe,EACf,aAAa,EACb,KAAK,EACL,OAAO,EACP,UAAU,EACV,
|
|
1
|
+
{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/dragAndDrop/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,SAAS,EACT,QAAQ,EACR,UAAU,EACV,UAAU,EACV,kBAAkB,EAClB,eAAe,EACf,aAAa,EACb,KAAK,EACL,OAAO,EACP,UAAU,EACV,SAAS,EACT,mBAAmB,GACpB,MAAM,YAAY,CAAA;AAEnB,YAAY,EAAE,UAAU,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { init, update, draggable, droppable, sortable, ghostStyle, isDragging, maybeDraggedItemId, maybeDropTarget, subscriptions, Model, Message, OutMessage,
|
|
1
|
+
export { init, update, draggable, droppable, sortable, ghostStyle, isDragging, maybeDraggedItemId, maybeDropTarget, subscriptions, Model, Message, OutMessage, FocusItem, ResolveKeyboardMove, } from './index.js';
|
package/dist/fileDrop/index.d.ts
CHANGED
|
@@ -12,45 +12,24 @@ export declare const Model: S.Struct<{
|
|
|
12
12
|
readonly isDragOver: S.Boolean;
|
|
13
13
|
}>;
|
|
14
14
|
export type Model = typeof Model.Type;
|
|
15
|
-
/** Sent when a drag enters the drop zone. Flips `isDragOver` to true so
|
|
16
|
-
* the consumer's styling can highlight the zone. */
|
|
17
|
-
export declare const EnteredDragZone: import("foldkit/schema").CallableTaggedStruct<"EnteredDragZone", {}>;
|
|
18
|
-
/** Sent when a drag leaves the drop zone without dropping. Flips
|
|
19
|
-
* `isDragOver` back to false. */
|
|
20
|
-
export declare const LeftDragZone: import("foldkit/schema").CallableTaggedStruct<"LeftDragZone", {}>;
|
|
21
|
-
/** Sent when the user drops files on the zone or selects them via the
|
|
22
|
-
* hidden `<input type="file">`. Carries a non-empty list of `File`
|
|
23
|
-
* objects, resets `isDragOver`, and emits `ReceivedFiles` as an
|
|
24
|
-
* OutMessage. */
|
|
25
|
-
export declare const DroppedFiles: import("foldkit/schema").CallableTaggedStruct<"DroppedFiles", {
|
|
26
|
-
files: S.NonEmptyArray<S.Schema<File>>;
|
|
27
|
-
}>;
|
|
28
|
-
/** Sent when a drop or input-change event fires without any files,
|
|
29
|
-
* typically a drag of non-file data (text, URLs, images from another
|
|
30
|
-
* page). Resets `isDragOver` and emits `RejectedNonFiles` as an
|
|
31
|
-
* OutMessage so the consumer can surface a message (e.g. "Only files are
|
|
32
|
-
* accepted"). */
|
|
33
|
-
export declare const DroppedNonFiles: import("foldkit/schema").CallableTaggedStruct<"DroppedNonFiles", {}>;
|
|
34
15
|
/** Union of all messages the file-drop component can produce. */
|
|
35
|
-
export declare const Message:
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
export declare const ReceivedFiles: import("foldkit/schema").CallableTaggedStruct<"ReceivedFiles", {
|
|
43
|
-
files: S.NonEmptyArray<S.Schema<File>>;
|
|
16
|
+
export declare const Message: import("foldkit/message").MessageUnion<{
|
|
17
|
+
readonly EnteredDragZone: {};
|
|
18
|
+
readonly LeftDragZone: {};
|
|
19
|
+
readonly DroppedFiles: {
|
|
20
|
+
readonly files: S.NonEmptyArray<S.Schema<File>>;
|
|
21
|
+
};
|
|
22
|
+
readonly DroppedNonFiles: {};
|
|
44
23
|
}>;
|
|
45
|
-
|
|
46
|
-
* consumer's parent update handles this to surface a message (e.g. "Only
|
|
47
|
-
* files are accepted"). */
|
|
48
|
-
export declare const RejectedNonFiles: import("foldkit/schema").CallableTaggedStruct<"RejectedNonFiles", {}>;
|
|
24
|
+
export type Message = typeof Message.Type;
|
|
49
25
|
/** The file-drop component's OutMessages: `ReceivedFiles` on the happy
|
|
50
26
|
* path and `RejectedNonFiles` when a drop event fires without files. */
|
|
51
|
-
export declare const OutMessage:
|
|
52
|
-
|
|
53
|
-
|
|
27
|
+
export declare const OutMessage: import("foldkit/message").MessageUnion<{
|
|
28
|
+
readonly ReceivedFiles: {
|
|
29
|
+
readonly files: S.NonEmptyArray<S.Schema<File>>;
|
|
30
|
+
};
|
|
31
|
+
readonly RejectedNonFiles: {};
|
|
32
|
+
}>;
|
|
54
33
|
export type OutMessage = typeof OutMessage.Type;
|
|
55
34
|
/** Configuration for creating a file-drop model with `init`. */
|
|
56
35
|
export type InitConfig = Readonly<{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/fileDrop/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/fileDrop/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,MAAM,EAAE,MAAM,IAAI,CAAC,EAAE,MAAM,QAAQ,CAAA;AACnD,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAE1C,OAAO,EAAE,KAAK,cAAc,EAAE,KAAK,IAAI,EAAmB,MAAM,cAAc,CAAA;AAO9E;;;;;iEAKiE;AACjE,eAAO,MAAM,KAAK;;;EAGhB,CAAA;AACF,MAAM,MAAM,KAAK,GAAG,OAAO,KAAK,CAAC,IAAI,CAAA;AAIrC,iEAAiE;AACjE,eAAO,MAAM,OAAO;;;;;;;EAKlB,CAAA;AACF,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAC,IAAI,CAAA;AAIzC;wEACwE;AACxE,eAAO,MAAM,UAAU;;;;;EAGrB,CAAA;AACF,MAAM,MAAM,UAAU,GAAG,OAAO,UAAU,CAAC,IAAI,CAAA;AAI/C,gEAAgE;AAChE,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,EAAE,EAAE,MAAM,CAAA;CACX,CAAC,CAAA;AAEF,qEAAqE;AACrE,eAAO,MAAM,IAAI,GAAI,QAAQ,UAAU,KAAG,KAGxC,CAAA;AAIF,KAAK,YAAY,GAAG,SAAS;IAC3B,KAAK;IACL,aAAa,CAAC,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;IACvC,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC;CAC1B,CAAA;AAED;8BAC8B;AAC9B,eAAO,MAAM,MAAM,GAAI,OAAO,KAAK,EAAE,SAAS,OAAO,iBAsBjD,CAAA;AAIJ;yBACyB;AACzB,MAAM,MAAM,kBAAkB,GAAG,QAAQ,CAAC;IACxC;;yCAEqC;IACrC,IAAI,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;IACnC;;2BAEuB;IACvB,KAAK,EAAE,aAAa,CAAC,cAAc,CAAC,CAAA;CACrC,CAAC,CAAA;AAEF,qFAAqF;AACrF,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,MAAM,EAAE,CAAC,UAAU,EAAE,kBAAkB,KAAK,IAAI,CAAA;IAChD,MAAM,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;IAC9B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAC,CAAA;AASF;iDACiD;AACjD,eAAO,MAAM,IAAI;;;;;;;;;;;;;YAfP,CAAC,UAAU,EAAE,kBAAkB,KAAK,IAAI;aACvC,aAAa,CAAC,MAAM,CAAC;eACnB,OAAO;iBACL,OAAO;GAkDrB,CAAA"}
|
package/dist/fileDrop/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
|
-
import { Array,
|
|
2
|
+
import { Array, Option, Schema as S } from 'effect';
|
|
3
3
|
import * as File from 'foldkit/file';
|
|
4
4
|
import { childAttributes } from 'foldkit/html';
|
|
5
|
-
import {
|
|
5
|
+
import { defineMessageUnion } from 'foldkit/message';
|
|
6
6
|
import { evo } from 'foldkit/struct';
|
|
7
7
|
import { defineView } from 'foldkit/submodel';
|
|
8
8
|
// MODEL
|
|
@@ -17,46 +17,20 @@ export const Model = S.Struct({
|
|
|
17
17
|
isDragOver: S.Boolean,
|
|
18
18
|
});
|
|
19
19
|
// MESSAGE
|
|
20
|
-
/** Sent when a drag enters the drop zone. Flips `isDragOver` to true so
|
|
21
|
-
* the consumer's styling can highlight the zone. */
|
|
22
|
-
export const EnteredDragZone = m('EnteredDragZone');
|
|
23
|
-
/** Sent when a drag leaves the drop zone without dropping. Flips
|
|
24
|
-
* `isDragOver` back to false. */
|
|
25
|
-
export const LeftDragZone = m('LeftDragZone');
|
|
26
|
-
/** Sent when the user drops files on the zone or selects them via the
|
|
27
|
-
* hidden `<input type="file">`. Carries a non-empty list of `File`
|
|
28
|
-
* objects, resets `isDragOver`, and emits `ReceivedFiles` as an
|
|
29
|
-
* OutMessage. */
|
|
30
|
-
export const DroppedFiles = m('DroppedFiles', {
|
|
31
|
-
files: S.NonEmptyArray(File.File),
|
|
32
|
-
});
|
|
33
|
-
/** Sent when a drop or input-change event fires without any files,
|
|
34
|
-
* typically a drag of non-file data (text, URLs, images from another
|
|
35
|
-
* page). Resets `isDragOver` and emits `RejectedNonFiles` as an
|
|
36
|
-
* OutMessage so the consumer can surface a message (e.g. "Only files are
|
|
37
|
-
* accepted"). */
|
|
38
|
-
export const DroppedNonFiles = m('DroppedNonFiles');
|
|
39
20
|
/** Union of all messages the file-drop component can produce. */
|
|
40
|
-
export const Message =
|
|
41
|
-
EnteredDragZone,
|
|
42
|
-
LeftDragZone,
|
|
43
|
-
DroppedFiles,
|
|
44
|
-
DroppedNonFiles,
|
|
45
|
-
]);
|
|
46
|
-
// OUT MESSAGE
|
|
47
|
-
/** Emitted when files arrive via drop or input-change. The consumer's
|
|
48
|
-
* parent update handles this to process the files (validate, upload,
|
|
49
|
-
* store in Model, etc.). The files list is non-empty. */
|
|
50
|
-
export const ReceivedFiles = m('ReceivedFiles', {
|
|
51
|
-
files: S.NonEmptyArray(File.File),
|
|
21
|
+
export const Message = defineMessageUnion({
|
|
22
|
+
EnteredDragZone: {},
|
|
23
|
+
LeftDragZone: {},
|
|
24
|
+
DroppedFiles: { files: S.NonEmptyArray(File.File) },
|
|
25
|
+
DroppedNonFiles: {},
|
|
52
26
|
});
|
|
53
|
-
|
|
54
|
-
* consumer's parent update handles this to surface a message (e.g. "Only
|
|
55
|
-
* files are accepted"). */
|
|
56
|
-
export const RejectedNonFiles = m('RejectedNonFiles');
|
|
27
|
+
// OUT MESSAGE
|
|
57
28
|
/** The file-drop component's OutMessages: `ReceivedFiles` on the happy
|
|
58
29
|
* path and `RejectedNonFiles` when a drop event fires without files. */
|
|
59
|
-
export const OutMessage =
|
|
30
|
+
export const OutMessage = defineMessageUnion({
|
|
31
|
+
ReceivedFiles: { files: S.NonEmptyArray(File.File) },
|
|
32
|
+
RejectedNonFiles: {},
|
|
33
|
+
});
|
|
60
34
|
/** Creates an initial file-drop model. Drag state starts cleared. */
|
|
61
35
|
export const init = (config) => (__foldkitBrandViewResult(({
|
|
62
36
|
id: config.id,
|
|
@@ -64,7 +38,7 @@ export const init = (config) => (__foldkitBrandViewResult(({
|
|
|
64
38
|
}), "@foldkit/ui/fileDrop/index.js#init"));
|
|
65
39
|
/** Processes a file-drop message and returns the next model, commands,
|
|
66
40
|
* and optional OutMessage. */
|
|
67
|
-
export const update = (model, message) => __foldkitBrandViewResult((
|
|
41
|
+
export const update = (model, message) => __foldkitBrandViewResult((Message.match(message, {
|
|
68
42
|
EnteredDragZone: () => __foldkitBrandViewResult(([
|
|
69
43
|
evo(model, { isDragOver: () => __foldkitBrandViewResult((true), "@foldkit/ui/fileDrop/index.js#isDragOver") }),
|
|
70
44
|
[],
|
|
@@ -78,17 +52,17 @@ export const update = (model, message) => __foldkitBrandViewResult((M.value(mess
|
|
|
78
52
|
DroppedFiles: ({ files }) => __foldkitBrandViewResult(([
|
|
79
53
|
evo(model, { isDragOver: () => __foldkitBrandViewResult((false), "@foldkit/ui/fileDrop/index.js#isDragOver~3") }),
|
|
80
54
|
[],
|
|
81
|
-
Option.some(ReceivedFiles({ files })),
|
|
55
|
+
Option.some(OutMessage.ReceivedFiles({ files })),
|
|
82
56
|
]), "@foldkit/ui/fileDrop/index.js#DroppedFiles"),
|
|
83
57
|
DroppedNonFiles: () => __foldkitBrandViewResult(([
|
|
84
58
|
evo(model, { isDragOver: () => __foldkitBrandViewResult((false), "@foldkit/ui/fileDrop/index.js#isDragOver~4") }),
|
|
85
59
|
[],
|
|
86
|
-
Option.some(RejectedNonFiles()),
|
|
60
|
+
Option.some(OutMessage.RejectedNonFiles()),
|
|
87
61
|
]), "@foldkit/ui/fileDrop/index.js#DroppedNonFiles"),
|
|
88
|
-
}))
|
|
62
|
+
})), "@foldkit/ui/fileDrop/index.js#update");
|
|
89
63
|
const dispatchDroppedFiles = (files) => __foldkitBrandViewResult((Array.match(files, {
|
|
90
|
-
onEmpty: () => __foldkitBrandViewResult((DroppedNonFiles()), "@foldkit/ui/fileDrop/index.js#onEmpty"),
|
|
91
|
-
onNonEmpty: nonEmptyFiles => __foldkitBrandViewResult((DroppedFiles({ files: [...nonEmptyFiles] })), "@foldkit/ui/fileDrop/index.js#onNonEmpty"),
|
|
64
|
+
onEmpty: () => __foldkitBrandViewResult((Message.DroppedNonFiles()), "@foldkit/ui/fileDrop/index.js#onEmpty"),
|
|
65
|
+
onNonEmpty: nonEmptyFiles => __foldkitBrandViewResult((Message.DroppedFiles({ files: [...nonEmptyFiles] })), "@foldkit/ui/fileDrop/index.js#onNonEmpty"),
|
|
92
66
|
})), "@foldkit/ui/fileDrop/index.js#dispatchDroppedFiles");
|
|
93
67
|
/** Renders an accessible file-drop zone by publishing attribute groups
|
|
94
68
|
* for a `<label>`-wrapped hidden file input. */
|
|
@@ -103,8 +77,8 @@ export const view = defineView((model, viewInputs, h) => {
|
|
|
103
77
|
? stateAttributes
|
|
104
78
|
: [
|
|
105
79
|
...stateAttributes,
|
|
106
|
-
h.OnDragEnter(EnteredDragZone()),
|
|
107
|
-
h.OnDragLeave(LeftDragZone()),
|
|
80
|
+
h.OnDragEnter(Message.EnteredDragZone()),
|
|
81
|
+
h.OnDragLeave(Message.LeftDragZone()),
|
|
108
82
|
h.AllowDrop(),
|
|
109
83
|
h.OnDropFiles(dispatchDroppedFiles),
|
|
110
84
|
];
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { init, update, view, Model, Message, OutMessage
|
|
1
|
+
export { init, update, view, Model, Message, OutMessage } from './index.js';
|
|
2
2
|
export type { InitConfig, ViewInputs, FileDropAttributes } from './index.js';
|
|
3
3
|
//# sourceMappingURL=public.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/fileDrop/public.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/fileDrop/public.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAA;AAE3E,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA"}
|
package/dist/fileDrop/public.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export { init, update, view, Model, Message, OutMessage
|
|
1
|
+
export { init, update, view, Model, Message, OutMessage } from './index.js';
|
package/dist/listbox/multi.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { Option, Schema as S } from 'effect';
|
|
2
2
|
import type * as Command from 'foldkit/command';
|
|
3
3
|
import type { View as SubmodelView } from 'foldkit/submodel';
|
|
4
|
-
import { type BaseInitConfig, type BaseViewInputs,
|
|
4
|
+
import { type BaseInitConfig, type BaseViewInputs, Message, OutMessage } from './shared.js';
|
|
5
5
|
/** Schema for the multi-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.selectedValues`. */
|
|
6
6
|
export declare const Model: S.Struct<{
|
|
7
7
|
readonly id: S.String;
|
|
@@ -129,12 +129,6 @@ export declare const update: (model: {
|
|
|
129
129
|
readonly _tag: "PressedPointerOnButton";
|
|
130
130
|
readonly pointerType: string;
|
|
131
131
|
readonly button: number;
|
|
132
|
-
} | {
|
|
133
|
-
readonly _tag: "CompletedFocusItems";
|
|
134
|
-
} | {
|
|
135
|
-
readonly _tag: "CompletedAnchorListbox";
|
|
136
|
-
} | {
|
|
137
|
-
readonly _tag: "CompletedPortalListboxBackdrop";
|
|
138
132
|
} | {
|
|
139
133
|
readonly _tag: "GotAnimationMessage";
|
|
140
134
|
readonly message: {
|
|
@@ -146,6 +140,12 @@ export declare const update: (model: {
|
|
|
146
140
|
} | {
|
|
147
141
|
readonly _tag: "EndedAnimation";
|
|
148
142
|
};
|
|
143
|
+
} | {
|
|
144
|
+
readonly _tag: "CompletedFocusItems";
|
|
145
|
+
} | {
|
|
146
|
+
readonly _tag: "CompletedAnchorListbox";
|
|
147
|
+
} | {
|
|
148
|
+
readonly _tag: "CompletedPortalListboxBackdrop";
|
|
149
149
|
}, never, never>;
|
|
150
150
|
}>[], Option.Option<Readonly<{
|
|
151
151
|
readonly _tag: "Selected";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"multi.d.ts","sourceRoot":"","sources":["../../src/listbox/multi.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC,EAAE,MAAM,QAAQ,CAAA;AAC5C,OAAO,KAAK,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC/C,OAAO,KAAK,EAAE,IAAI,IAAI,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAE5D,OAAO,EACL,KAAK,cAAc,EAEnB,KAAK,cAAc,
|
|
1
|
+
{"version":3,"file":"multi.d.ts","sourceRoot":"","sources":["../../src/listbox/multi.ts"],"names":[],"mappings":"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"}
|
package/dist/listbox/multi.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
2
|
import { Option, Schema as S } from 'effect';
|
|
3
|
-
import { BaseModel,
|
|
3
|
+
import { BaseModel, Message, OutMessage, baseInit, makeUpdate, makeView, } from './shared.js';
|
|
4
4
|
// MODEL
|
|
5
5
|
/** Schema for the multi-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.selectedValues`. */
|
|
6
6
|
export const Model = S.Struct({
|
|
@@ -13,18 +13,18 @@ export const init = (config) => __foldkitBrandViewResult((baseInit(config)), "@f
|
|
|
13
13
|
export const update = makeUpdate((model, item) => __foldkitBrandViewResult(([
|
|
14
14
|
model,
|
|
15
15
|
[],
|
|
16
|
-
Option.some(
|
|
16
|
+
Option.some(OutMessage.Selected({ value: item })),
|
|
17
17
|
]), "@foldkit/ui/listbox/multi.js#anonymous"));
|
|
18
18
|
/** Programmatically opens the listbox, updating the model and returning
|
|
19
19
|
* focus and modal commands. Use this in domain-event handlers to open the listbox. */
|
|
20
|
-
export const open = (model) => __foldkitBrandViewResult((update(model, Opened({ maybeActiveItemIndex: Option.none() }))), "@foldkit/ui/listbox/multi.js#open");
|
|
20
|
+
export const open = (model) => __foldkitBrandViewResult((update(model, Message.Opened({ maybeActiveItemIndex: Option.none() }))), "@foldkit/ui/listbox/multi.js#open");
|
|
21
21
|
/** Programmatically closes the listbox. If it is open, returns the closed Model
|
|
22
22
|
* with focus and modal Commands. If it is already closed, returns the Model
|
|
23
23
|
* unchanged with no Commands. Use this in domain-event handlers to close the
|
|
24
24
|
* listbox. */
|
|
25
|
-
export const close = (model) => __foldkitBrandViewResult((update(model, Closed())), "@foldkit/ui/listbox/multi.js#close");
|
|
25
|
+
export const close = (model) => __foldkitBrandViewResult((update(model, Message.Closed())), "@foldkit/ui/listbox/multi.js#close");
|
|
26
26
|
/** Programmatically activates an item in the multi-select listbox. Emits `Selected({ value })`; the parent toggles the value's membership. */
|
|
27
|
-
export const selectItem = (model, item) => __foldkitBrandViewResult((update(model, SelectedItem({ item }))), "@foldkit/ui/listbox/multi.js#selectItem");
|
|
27
|
+
export const selectItem = (model, item) => __foldkitBrandViewResult((update(model, Message.SelectedItem({ item }))), "@foldkit/ui/listbox/multi.js#selectItem");
|
|
28
28
|
const internalView = makeView({ ariaMultiSelectable: true });
|
|
29
29
|
/** Pairs the multi-select listbox's `view` and `update` (and programmatic
|
|
30
30
|
* helpers) behind a single Item-typed entry point. Same shape as
|
|
@@ -37,8 +37,8 @@ export const create = () => {
|
|
|
37
37
|
return __foldkitBrandViewResult(({
|
|
38
38
|
view: internalView(),
|
|
39
39
|
update: typedUpdate,
|
|
40
|
-
selectItem: (model, item) => __foldkitBrandViewResult((typedUpdate(model, SelectedItem({ item }))), "@foldkit/ui/listbox/multi.js#selectItem~2"),
|
|
41
|
-
open: model => __foldkitBrandViewResult((typedUpdate(model, Opened({ maybeActiveItemIndex: Option.none() }))), "@foldkit/ui/listbox/multi.js#open~2"),
|
|
42
|
-
close: model => __foldkitBrandViewResult((typedUpdate(model, Closed())), "@foldkit/ui/listbox/multi.js#close~2"),
|
|
40
|
+
selectItem: (model, item) => __foldkitBrandViewResult((typedUpdate(model, Message.SelectedItem({ item }))), "@foldkit/ui/listbox/multi.js#selectItem~2"),
|
|
41
|
+
open: model => __foldkitBrandViewResult((typedUpdate(model, Message.Opened({ maybeActiveItemIndex: Option.none() }))), "@foldkit/ui/listbox/multi.js#open~2"),
|
|
42
|
+
close: model => __foldkitBrandViewResult((typedUpdate(model, Message.Closed())), "@foldkit/ui/listbox/multi.js#close~2"),
|
|
43
43
|
}), "@foldkit/ui/listbox/multi.js#create");
|
|
44
44
|
};
|
package/dist/listbox/public.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export { init, create, Model } from './single.js';
|
|
2
2
|
export { buttonId } from './shared.js';
|
|
3
|
-
export { Message, OutMessage, Selected, Orientation, SelectedItem,
|
|
3
|
+
export { Message, OutMessage, type Selected, Orientation, type SelectedItem, AnchorListbox, PortalListboxBackdrop, type CompletedDelayClearSearch, LockScroll, UnlockScroll, InertOthers, RestoreInert, FocusButton, FocusItems, ScrollIntoView, ClickItem, DelayClearSearch, DetectMovementOrAnimationEnd, type Opened, type Closed, type BlurredItems, type ActivatedItem, type DeactivatedItem, type MovedPointerOverItem, type RequestedItemClick, type Searched, type PressedPointerOnButton, type IgnoredMouseClick, type SuppressedSpaceScroll, type SuppressedItemCommit, } from './shared.js';
|
|
4
4
|
export type { ActivationTrigger, ItemConfig, GroupHeading, BaseViewInputsCommon, ItemToValueInput, } from './shared.js';
|
|
5
5
|
export type { Bundle, InitConfig, ViewInputs } from './single.js';
|
|
6
6
|
export type { AnchorConfig } from '../anchor/index.js';
|