@foldkit/ui 0.162.0 → 0.163.0-canary.085c0174a32b
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 +33 -7
- package/dist/anchor/anchor.d.ts.map +1 -1
- package/dist/anchor/anchor.js +102 -15
- package/dist/anchor/public.d.ts +1 -1
- package/dist/anchor/public.d.ts.map +1 -1
- package/dist/anchor/public.js +1 -1
- package/dist/animation/index.d.ts +3 -0
- package/dist/animation/index.d.ts.map +1 -1
- package/dist/animation/schema.d.ts +13 -4
- package/dist/animation/schema.d.ts.map +1 -1
- package/dist/animation/schema.js +8 -4
- package/dist/animation/update.d.ts +15 -5
- package/dist/animation/update.d.ts.map +1 -1
- package/dist/animation/update.js +59 -27
- package/dist/calendar/index.d.ts.map +1 -1
- package/dist/calendar/index.js +27 -19
- package/dist/checkbox/index.d.ts +1 -1
- package/dist/checkbox/index.js +1 -1
- package/dist/combobox/multi.d.ts +5 -0
- package/dist/combobox/multi.d.ts.map +1 -1
- package/dist/combobox/multi.js +2 -2
- package/dist/combobox/shared.d.ts +19 -7
- package/dist/combobox/shared.d.ts.map +1 -1
- package/dist/combobox/shared.js +28 -28
- package/dist/combobox/single.d.ts +5 -0
- package/dist/combobox/single.d.ts.map +1 -1
- package/dist/combobox/single.js +4 -4
- package/dist/datePicker/index.d.ts +13 -2
- package/dist/datePicker/index.d.ts.map +1 -1
- package/dist/datePicker/index.js +10 -10
- package/dist/dialog/index.d.ts +13 -2
- package/dist/dialog/index.d.ts.map +1 -1
- package/dist/dialog/index.js +28 -14
- package/dist/disclosure/index.d.ts +2 -2
- package/dist/disclosure/index.js +1 -1
- package/dist/dragAndDrop/index.js +14 -14
- package/dist/fileDrop/index.d.ts.map +1 -1
- package/dist/fileDrop/index.js +7 -5
- package/dist/hoverIntent/hoverIntent.d.ts.map +1 -1
- package/dist/hoverIntent/hoverIntent.js +16 -16
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/internal/accessibleName.d.ts +9 -0
- package/dist/internal/accessibleName.d.ts.map +1 -0
- package/dist/internal/accessibleName.js +12 -0
- package/dist/internal/range.d.ts +7 -0
- package/dist/internal/range.d.ts.map +1 -0
- package/dist/internal/range.js +12 -0
- package/dist/listbox/multi.d.ts +5 -0
- package/dist/listbox/multi.d.ts.map +1 -1
- package/dist/listbox/shared.d.ts +15 -4
- package/dist/listbox/shared.d.ts.map +1 -1
- package/dist/listbox/shared.js +32 -29
- package/dist/listbox/single.d.ts +5 -0
- package/dist/listbox/single.d.ts.map +1 -1
- package/dist/menu/index.d.ts +16 -4
- package/dist/menu/index.d.ts.map +1 -1
- package/dist/menu/index.js +35 -28
- package/dist/meter/index.d.ts +26 -0
- package/dist/meter/index.d.ts.map +1 -0
- package/dist/meter/index.js +67 -0
- package/dist/meter/public.d.ts +3 -0
- package/dist/meter/public.d.ts.map +1 -0
- package/dist/meter/public.js +1 -0
- package/dist/popover/index.d.ts +20 -4
- package/dist/popover/index.d.ts.map +1 -1
- package/dist/popover/index.js +20 -18
- package/dist/progress/index.d.ts +24 -0
- package/dist/progress/index.d.ts.map +1 -0
- package/dist/progress/index.js +85 -0
- package/dist/progress/public.d.ts +3 -0
- package/dist/progress/public.d.ts.map +1 -0
- package/dist/progress/public.js +1 -0
- package/dist/radioGroup/index.d.ts.map +1 -1
- package/dist/radioGroup/index.js +5 -3
- package/dist/slider/index.d.ts +61 -28
- package/dist/slider/index.d.ts.map +1 -1
- package/dist/slider/index.js +163 -87
- 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/switch/index.d.ts +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/tabs/index.d.ts.map +1 -1
- package/dist/tabs/index.js +5 -3
- package/dist/test/apps/disabledButton.d.ts +12 -4
- package/dist/test/apps/disabledButton.d.ts.map +1 -1
- package/dist/test/apps/disabledButton.js +3 -3
- package/dist/toast/index.d.ts +869 -45
- package/dist/toast/index.d.ts.map +1 -1
- package/dist/toast/index.js +77 -17
- package/dist/toast/public.d.ts +2 -2
- package/dist/toast/public.d.ts.map +1 -1
- package/dist/toast/public.js +1 -1
- package/dist/toast/schema.d.ts +160 -6
- package/dist/toast/schema.d.ts.map +1 -1
- package/dist/toast/schema.js +69 -2
- package/dist/toast/swipeTarget.d.ts +5 -0
- package/dist/toast/swipeTarget.d.ts.map +1 -0
- package/dist/toast/swipeTarget.js +18 -0
- package/dist/toast/test.d.ts +7 -1
- package/dist/toast/test.d.ts.map +1 -1
- package/dist/toast/test.js +37 -3
- package/dist/toast/update.d.ts +768 -7
- package/dist/toast/update.d.ts.map +1 -1
- package/dist/toast/update.js +283 -68
- package/dist/tooltip/tooltip.d.ts +7 -7
- package/dist/tooltip/tooltip.d.ts.map +1 -1
- package/dist/tooltip/tooltip.js +14 -12
- package/dist/virtualList/index.d.ts.map +1 -1
- package/dist/virtualList/index.js +8 -6
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/toast/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,MAAM,EAAE,MAAM,QAAQ,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/toast/index.ts"],"names":[],"mappings":"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"}
|
package/dist/toast/index.js
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
|
-
import { Match } from 'effect';
|
|
2
|
+
import { Match, Option } from 'effect';
|
|
3
3
|
import { childAttributes } from 'foldkit/html';
|
|
4
4
|
import { defineView } from 'foldkit/submodel';
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
5
|
+
import { SwipeState } from './schema.js';
|
|
6
|
+
import { isSwipeExcludedTarget } from './swipeTarget.js';
|
|
7
|
+
import { makeRuntime } from './update.js';
|
|
7
8
|
export * as test from './test.js';
|
|
8
|
-
export { Message, Variant, Position,
|
|
9
|
+
export { Message, Variant, Position, SwipeDirection, SwipeState, DEFAULT_SWIPE_DIRECTION, DEFAULT_SWIPE_THRESHOLD, SWIPE_SETTLE_DURATION, } from './schema.js';
|
|
10
|
+
export { WaitBeforeDismissal, WaitForSwipeSettled, swipeOffset, } from './update.js';
|
|
9
11
|
const variantToRole = (variant) => __foldkitBrandViewResult((Match.value(variant).pipe(Match.withReturnType(), Match.when('Info', () => __foldkitBrandViewResult(('status'), "@foldkit/ui/toast/index.js#anonymous")), Match.when('Success', () => __foldkitBrandViewResult(('status'), "@foldkit/ui/toast/index.js#anonymous~2")), Match.when('Warning', () => __foldkitBrandViewResult(('alert'), "@foldkit/ui/toast/index.js#anonymous~3")), Match.when('Error', () => __foldkitBrandViewResult(('alert'), "@foldkit/ui/toast/index.js#anonymous~4")), Match.exhaustive)), "@foldkit/ui/toast/index.js#variantToRole");
|
|
10
12
|
const positionToContainerStyle = (position) => {
|
|
11
13
|
const base = {
|
|
@@ -51,6 +53,7 @@ const positionToContainerStyle = (position) => {
|
|
|
51
53
|
}), "@foldkit/ui/toast/index.js#anonymous~10"))), Match.exhaustive)), "@foldkit/ui/toast/index.js#positionToContainerStyle");
|
|
52
54
|
};
|
|
53
55
|
const DEFAULT_ARIA_LABEL = 'Notifications';
|
|
56
|
+
const LEFT_MOUSE_BUTTON = 0;
|
|
54
57
|
/** Factory that binds `Toast` to a user-provided payload schema. The
|
|
55
58
|
* returned module contains everything needed to wire a toast stack into an
|
|
56
59
|
* app: `Model`, `Message`, `Entry`, `Added`, `init`, `update`, `show` /
|
|
@@ -58,16 +61,15 @@ const DEFAULT_ARIA_LABEL = 'Notifications';
|
|
|
58
61
|
*
|
|
59
62
|
* The payload is whatever content shape the consumer supplies via Schema.
|
|
60
63
|
* The component never reads it. It flows through to `entryToView`. The
|
|
61
|
-
* component
|
|
62
|
-
*
|
|
64
|
+
* component owns the entry's lifecycle, accessibility role, dismiss timer,
|
|
65
|
+
* hover state, and swipe state.
|
|
63
66
|
*
|
|
64
67
|
* Consume the bound module's exports everywhere. `Toast.Model` in your app
|
|
65
68
|
* Model, `Toast.Message` in your parent Message union, `Toast.show` /
|
|
66
69
|
* `Toast.dismiss` in your update, `Toast.view` in your view. The top-level
|
|
67
|
-
* exports
|
|
68
|
-
*
|
|
69
|
-
*
|
|
70
|
-
* bound module, but the typical path is through the factory return.
|
|
70
|
+
* exports provide payload-independent Schemas, constants, and Commands.
|
|
71
|
+
* Use the bound module for the payload-specific Model, Message, helpers,
|
|
72
|
+
* and view.
|
|
71
73
|
*
|
|
72
74
|
* @example
|
|
73
75
|
* ```ts
|
|
@@ -82,13 +84,19 @@ const DEFAULT_ARIA_LABEL = 'Notifications';
|
|
|
82
84
|
* ```
|
|
83
85
|
*/
|
|
84
86
|
export const make = (payloadSchema) => {
|
|
85
|
-
const
|
|
87
|
+
const toast = makeRuntime(payloadSchema);
|
|
86
88
|
/** Renders a headless toast stack. The `<div>` container is always present
|
|
87
89
|
* in the DOM so screen readers can observe its `aria-live` region from
|
|
88
90
|
* page load. Each entry becomes a `<div>` keyed by its id, with
|
|
89
91
|
* animation data attributes (`data-enter`, `data-leave`,
|
|
90
92
|
* `data-transition`, `data-closed`) and `data-variant` reflecting the
|
|
91
|
-
* entry's variant.
|
|
93
|
+
* entry's variant. When swipe is enabled via `swipeToDismiss`, entries
|
|
94
|
+
* also carry `data-swipe` (`move` while dragging, `settling` while
|
|
95
|
+
* returning to rest, and `end` while dismissing) with an inline
|
|
96
|
+
* `translate` property. On a successful swipe, the entry moves from its
|
|
97
|
+
* release offset to `100vw` or `-100vw` when leave animation begins.
|
|
98
|
+
* The offset lives on `translate` rather than `transform` so it composes
|
|
99
|
+
* with your `transform` animations instead of overriding them. */
|
|
92
100
|
const view = defineView((model, viewInputs, h) => {
|
|
93
101
|
const { id, entries } = model;
|
|
94
102
|
const { position, entryToView, ariaLabel = DEFAULT_ARIA_LABEL, containerClassName, entryClassName, } = viewInputs;
|
|
@@ -117,20 +125,72 @@ export const make = (payloadSchema) => {
|
|
|
117
125
|
h.DataAttribute('leave', ''),
|
|
118
126
|
h.DataAttribute('transition', ''),
|
|
119
127
|
]), "@foldkit/ui/toast/index.js#anonymous~15")), Match.orElse(() => __foldkitBrandViewResult(([]), "@foldkit/ui/toast/index.js#anonymous~16")));
|
|
128
|
+
const swipeOffset = toast.swipeOffset(entry.swipeState);
|
|
129
|
+
const maybeSwipePhase = SwipeState.match(entry.swipeState, {
|
|
130
|
+
Idle: () => __foldkitBrandViewResult((Option.none()), "@foldkit/ui/toast/index.js#Idle"),
|
|
131
|
+
Dragging: () => __foldkitBrandViewResult((Option.some('move')), "@foldkit/ui/toast/index.js#Dragging"),
|
|
132
|
+
Settling: () => __foldkitBrandViewResult((Option.some('settling')), "@foldkit/ui/toast/index.js#Settling"),
|
|
133
|
+
Dismissing: () => __foldkitBrandViewResult((Option.some('end')), "@foldkit/ui/toast/index.js#Dismissing"),
|
|
134
|
+
});
|
|
135
|
+
const swipeExitTranslate = SwipeState.match(entry.swipeState, {
|
|
136
|
+
Idle: () => __foldkitBrandViewResult((undefined), "@foldkit/ui/toast/index.js#Idle~2"),
|
|
137
|
+
Dragging: () => __foldkitBrandViewResult((undefined), "@foldkit/ui/toast/index.js#Dragging~2"),
|
|
138
|
+
Settling: () => __foldkitBrandViewResult((undefined), "@foldkit/ui/toast/index.js#Settling~2"),
|
|
139
|
+
Dismissing: ({ direction }) => {
|
|
140
|
+
if (transitionState !== 'LeaveAnimating') {
|
|
141
|
+
return __foldkitBrandViewResult((undefined), "@foldkit/ui/toast/index.js#Dismissing~2");
|
|
142
|
+
}
|
|
143
|
+
return __foldkitBrandViewResult((Match.value(direction).pipe(Match.when('Right', () => __foldkitBrandViewResult(('100vw'), "@foldkit/ui/toast/index.js#anonymous~17")), Match.when('Left', () => __foldkitBrandViewResult(('-100vw'), "@foldkit/ui/toast/index.js#anonymous~18")), Match.exhaustive)), "@foldkit/ui/toast/index.js#Dismissing~2");
|
|
144
|
+
},
|
|
145
|
+
});
|
|
146
|
+
const swipeTranslate = swipeExitTranslate ??
|
|
147
|
+
(swipeOffset !== 0 ? `${String(swipeOffset)}px` : undefined);
|
|
148
|
+
const swipeAttributes = Option.match(maybeSwipePhase, {
|
|
149
|
+
onNone: () => __foldkitBrandViewResult(([]), "@foldkit/ui/toast/index.js#onNone"),
|
|
150
|
+
onSome: phase => __foldkitBrandViewResult(([h.DataAttribute('swipe', phase)]), "@foldkit/ui/toast/index.js#onSome"),
|
|
151
|
+
});
|
|
152
|
+
const handlePointerDown = (pointerType, button, _screenX, _screenY, _timeStamp, clientX, _clientY, pointerId, target) => {
|
|
153
|
+
if ((pointerType === 'mouse' && button !== LEFT_MOUSE_BUTTON) ||
|
|
154
|
+
isSwipeExcludedTarget(pointerType, target)) {
|
|
155
|
+
return __foldkitBrandViewResult((Option.none()), "@foldkit/ui/toast/index.js#handlePointerDown");
|
|
156
|
+
}
|
|
157
|
+
else {
|
|
158
|
+
return __foldkitBrandViewResult((Option.some(toast.Message.PressedEntryPointer({
|
|
159
|
+
entryId: entry.id,
|
|
160
|
+
pointerId,
|
|
161
|
+
clientX,
|
|
162
|
+
}))), "@foldkit/ui/toast/index.js#handlePointerDown");
|
|
163
|
+
}
|
|
164
|
+
};
|
|
120
165
|
const itemAttributes = [
|
|
121
166
|
h.Id(entry.id),
|
|
122
167
|
h.Role(variantToRole(entry.variant)),
|
|
123
168
|
h.AriaAtomic(true),
|
|
124
169
|
h.DataAttribute('variant', entry.variant),
|
|
125
|
-
h.Style({
|
|
126
|
-
|
|
127
|
-
|
|
170
|
+
h.Style({
|
|
171
|
+
pointerEvents: 'auto',
|
|
172
|
+
...(Option.isSome(model.maybeSwipeConfig)
|
|
173
|
+
? { touchAction: 'pan-y' }
|
|
174
|
+
: {}),
|
|
175
|
+
...(swipeTranslate !== undefined
|
|
176
|
+
? {
|
|
177
|
+
translate: swipeTranslate,
|
|
178
|
+
'--toast-swipe-move-x': `${String(swipeOffset)}px`,
|
|
179
|
+
}
|
|
180
|
+
: {}),
|
|
181
|
+
}),
|
|
182
|
+
h.OnMouseEnter(toast.Message.HoveredEntry({ entryId: entry.id })),
|
|
183
|
+
h.OnMouseLeave(toast.Message.LeftEntry({ entryId: entry.id })),
|
|
184
|
+
...(Option.isSome(model.maybeSwipeConfig)
|
|
185
|
+
? [h.OnPointerDown(handlePointerDown)]
|
|
186
|
+
: []),
|
|
128
187
|
...animationAttributes,
|
|
188
|
+
...swipeAttributes,
|
|
129
189
|
...(entryClassName ? [h.Class(entryClassName)] : []),
|
|
130
190
|
];
|
|
131
191
|
const handlers = {
|
|
132
192
|
dismiss: childAttributes([
|
|
133
|
-
h.OnClick(
|
|
193
|
+
h.OnClick(toast.Message.Dismissed({ entryId: entry.id })),
|
|
134
194
|
]),
|
|
135
195
|
};
|
|
136
196
|
return __foldkitBrandViewResult((h.keyed('div')(entry.id, itemAttributes, [
|
|
@@ -140,7 +200,7 @@ export const make = (payloadSchema) => {
|
|
|
140
200
|
return __foldkitBrandViewResult((h.keyed('div')(id, containerAttributes, entries.map(renderEntryItem))), "@foldkit/ui/toast/index.js#anonymous~11");
|
|
141
201
|
});
|
|
142
202
|
return __foldkitBrandViewResult(({
|
|
143
|
-
...
|
|
203
|
+
...toast,
|
|
144
204
|
view,
|
|
145
205
|
}), "@foldkit/ui/toast/index.js#make");
|
|
146
206
|
};
|
package/dist/toast/public.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export { make, Message, Variant, Position, type Dismissed, type DismissedAll, type CompletedWaitBeforeDismissal, type HoveredEntry, type LeftEntry, type GotAnimationMessage, WaitBeforeDismissal, } from './index.js';
|
|
1
|
+
export { make, Message, Variant, Position, SwipeDirection, SwipeState, DEFAULT_SWIPE_DIRECTION, DEFAULT_SWIPE_THRESHOLD, SWIPE_SETTLE_DURATION, swipeOffset, type Dismissed, type DismissedAll, type CompletedWaitBeforeDismissal, type HoveredEntry, type LeftEntry, type GotAnimationMessage, type PressedEntryPointer, type MovedSwipePointer, type ReleasedSwipePointer, type CancelledSwipe, type PressedEscape, type CompletedWaitForSwipeSettled, WaitBeforeDismissal, WaitForSwipeSettled, } from './index.js';
|
|
2
2
|
export * as test from './test.js';
|
|
3
3
|
export type { EntryHandlers } from './index.js';
|
|
4
|
-
export type { InitConfig, ShowInput } from './index.js';
|
|
4
|
+
export type { InitConfig, ShowInput, SwipeToDismissConfig } from './index.js';
|
|
5
5
|
export type { DrainEntryInput } from './test.js';
|
|
6
6
|
//# sourceMappingURL=public.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/toast/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,EACR,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,4BAA4B,EACjC,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,mBAAmB,EACxB,mBAAmB,GACpB,MAAM,YAAY,CAAA;AAEnB,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AAEjC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAC/C,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,YAAY,CAAA;
|
|
1
|
+
{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/toast/public.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,IAAI,EACJ,OAAO,EACP,OAAO,EACP,QAAQ,EACR,cAAc,EACd,UAAU,EACV,uBAAuB,EACvB,uBAAuB,EACvB,qBAAqB,EACrB,WAAW,EACX,KAAK,SAAS,EACd,KAAK,YAAY,EACjB,KAAK,4BAA4B,EACjC,KAAK,YAAY,EACjB,KAAK,SAAS,EACd,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACxB,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EACzB,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,4BAA4B,EACjC,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,YAAY,CAAA;AAEnB,OAAO,KAAK,IAAI,MAAM,WAAW,CAAA;AAEjC,YAAY,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAC/C,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAA;AAC7E,YAAY,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA"}
|
package/dist/toast/public.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { make, Message, Variant, Position, WaitBeforeDismissal, } from './index.js';
|
|
1
|
+
export { make, Message, Variant, Position, SwipeDirection, SwipeState, DEFAULT_SWIPE_DIRECTION, DEFAULT_SWIPE_THRESHOLD, SWIPE_SETTLE_DURATION, swipeOffset, WaitBeforeDismissal, WaitForSwipeSettled, } from './index.js';
|
|
2
2
|
export * as test from './test.js';
|
package/dist/toast/schema.d.ts
CHANGED
|
@@ -9,12 +9,46 @@ export type Variant = typeof Variant.Type;
|
|
|
9
9
|
/** Where the toast viewport is anchored on the screen and how entries stack. */
|
|
10
10
|
export declare const Position: Schema.Literals<readonly ["TopLeft", "TopCenter", "TopRight", "BottomLeft", "BottomCenter", "BottomRight"]>;
|
|
11
11
|
export type Position = typeof Position.Type;
|
|
12
|
+
/** Direction in which a pointer can drag an entry to dismiss it. */
|
|
13
|
+
export declare const SwipeDirection: Schema.Literals<readonly ["Left", "Right"]>;
|
|
14
|
+
export type SwipeDirection = typeof SwipeDirection.Type;
|
|
15
|
+
/** Per-entry swipe gesture state. `Dragging` retains the initiating
|
|
16
|
+
* `pointerId`, so move, release, and cancel Messages update only the entry
|
|
17
|
+
* that started the gesture and ignore unrelated touches. `Settling` returns
|
|
18
|
+
* a cancelled or short swipe to rest. `Dismissing` retains the release offset
|
|
19
|
+
* and direction while the leave animation carries the entry off-screen. The
|
|
20
|
+
* settle generation lives in the entry's `swipeVersion` so a stale settle
|
|
21
|
+
* timer cannot clear a later gesture. */
|
|
22
|
+
export declare const SwipeState: import("foldkit/schema").TaggedUnion<{
|
|
23
|
+
readonly Idle: {};
|
|
24
|
+
readonly Dragging: {
|
|
25
|
+
pointerId: Schema.Number;
|
|
26
|
+
startX: Schema.Number;
|
|
27
|
+
currentX: Schema.Number;
|
|
28
|
+
};
|
|
29
|
+
readonly Settling: {
|
|
30
|
+
offsetX: Schema.Number;
|
|
31
|
+
};
|
|
32
|
+
readonly Dismissing: {
|
|
33
|
+
offsetX: Schema.Number;
|
|
34
|
+
direction: Schema.Literals<readonly ["Left", "Right"]>;
|
|
35
|
+
};
|
|
36
|
+
}>;
|
|
37
|
+
export type SwipeState = typeof SwipeState.Type;
|
|
38
|
+
/** Default distance in pixels a pointer must travel to dismiss a Toast. */
|
|
39
|
+
export declare const DEFAULT_SWIPE_THRESHOLD = 40;
|
|
40
|
+
/** Default direction in which a pointer can dismiss a Toast. */
|
|
41
|
+
export declare const DEFAULT_SWIPE_DIRECTION: SwipeDirection;
|
|
42
|
+
/** Time an entry remains in `Settling` after a short or cancelled swipe,
|
|
43
|
+
* allowing consumer CSS to animate it back to rest. */
|
|
44
|
+
export declare const SWIPE_SETTLE_DURATION: Duration.Duration;
|
|
12
45
|
/** Schema factory for a single toast entry. `payloadSchema` is user-provided
|
|
13
46
|
* and defines the shape of per-entry content, whatever the consumer wants
|
|
14
47
|
* to encode. The component itself owns only lifecycle + a11y fields: `id`,
|
|
15
48
|
* `variant` (for ARIA role), `animation`, `maybeDuration`,
|
|
16
|
-
* `pendingDismissVersion` (for cancellable auto-dismiss),
|
|
17
|
-
* (for pause-on-hover)
|
|
49
|
+
* `pendingDismissVersion` (for cancellable auto-dismiss), `isHovered`
|
|
50
|
+
* (for pause-on-hover), and `swipeState` + `swipeVersion` (for the
|
|
51
|
+
* opt-in swipe gesture). */
|
|
18
52
|
export declare const makeEntry: <A, I>(payloadSchema: Schema.Codec<A, I>) => Schema.Struct<{
|
|
19
53
|
readonly id: Schema.String;
|
|
20
54
|
readonly variant: Schema.Literals<readonly ["Info", "Success", "Warning", "Error"]>;
|
|
@@ -22,10 +56,27 @@ export declare const makeEntry: <A, I>(payloadSchema: Schema.Codec<A, I>) => Sch
|
|
|
22
56
|
readonly id: Schema.String;
|
|
23
57
|
readonly isShowing: Schema.Boolean;
|
|
24
58
|
readonly transitionState: Schema.Literals<readonly ["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
|
|
59
|
+
readonly transitionGeneration: Schema.Number;
|
|
25
60
|
}>;
|
|
26
61
|
readonly maybeDuration: Schema.Option<Schema.DurationFromMillis>;
|
|
27
62
|
readonly pendingDismissVersion: Schema.Number;
|
|
28
63
|
readonly isHovered: Schema.Boolean;
|
|
64
|
+
readonly swipeState: import("foldkit/schema").TaggedUnion<{
|
|
65
|
+
readonly Idle: {};
|
|
66
|
+
readonly Dragging: {
|
|
67
|
+
pointerId: Schema.Number;
|
|
68
|
+
startX: Schema.Number;
|
|
69
|
+
currentX: Schema.Number;
|
|
70
|
+
};
|
|
71
|
+
readonly Settling: {
|
|
72
|
+
offsetX: Schema.Number;
|
|
73
|
+
};
|
|
74
|
+
readonly Dismissing: {
|
|
75
|
+
offsetX: Schema.Number;
|
|
76
|
+
direction: Schema.Literals<readonly ["Left", "Right"]>;
|
|
77
|
+
};
|
|
78
|
+
}>;
|
|
79
|
+
readonly swipeVersion: Schema.Number;
|
|
29
80
|
readonly payload: Schema.Codec<A, I, never, never>;
|
|
30
81
|
}>;
|
|
31
82
|
/** Schema factory for the toast container's state. `nextEntryKey` is a
|
|
@@ -43,13 +94,34 @@ export declare const makeModel: <A, I>(payloadSchema: Schema.Codec<A, I>) => Sch
|
|
|
43
94
|
readonly id: Schema.String;
|
|
44
95
|
readonly isShowing: Schema.Boolean;
|
|
45
96
|
readonly transitionState: Schema.Literals<readonly ["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
|
|
97
|
+
readonly transitionGeneration: Schema.Number;
|
|
46
98
|
}>;
|
|
47
99
|
readonly maybeDuration: Schema.Option<Schema.DurationFromMillis>;
|
|
48
100
|
readonly pendingDismissVersion: Schema.Number;
|
|
49
101
|
readonly isHovered: Schema.Boolean;
|
|
102
|
+
readonly swipeState: import("foldkit/schema").TaggedUnion<{
|
|
103
|
+
readonly Idle: {};
|
|
104
|
+
readonly Dragging: {
|
|
105
|
+
pointerId: Schema.Number;
|
|
106
|
+
startX: Schema.Number;
|
|
107
|
+
currentX: Schema.Number;
|
|
108
|
+
};
|
|
109
|
+
readonly Settling: {
|
|
110
|
+
offsetX: Schema.Number;
|
|
111
|
+
};
|
|
112
|
+
readonly Dismissing: {
|
|
113
|
+
offsetX: Schema.Number;
|
|
114
|
+
direction: Schema.Literals<readonly ["Left", "Right"]>;
|
|
115
|
+
};
|
|
116
|
+
}>;
|
|
117
|
+
readonly swipeVersion: Schema.Number;
|
|
50
118
|
readonly payload: Schema.Codec<A, I, never, never>;
|
|
51
119
|
}>>;
|
|
52
120
|
readonly nextEntryKey: Schema.Number;
|
|
121
|
+
readonly maybeSwipeConfig: Schema.Option<Schema.Struct<{
|
|
122
|
+
readonly direction: Schema.Literals<readonly ["Left", "Right"]>;
|
|
123
|
+
readonly threshold: Schema.Number;
|
|
124
|
+
}>>;
|
|
53
125
|
}>;
|
|
54
126
|
/** Payload-independent Message variants shared by every bound Toast module. */
|
|
55
127
|
export declare const Message: import("foldkit/message").MessageUnion<{
|
|
@@ -72,10 +144,35 @@ export declare const Message: import("foldkit/message").MessageUnion<{
|
|
|
72
144
|
message: import("foldkit/message").MessageUnion<{
|
|
73
145
|
readonly Showed: {};
|
|
74
146
|
readonly Hid: {};
|
|
75
|
-
readonly CompletedWaitForPaint: {
|
|
76
|
-
|
|
147
|
+
readonly CompletedWaitForPaint: {
|
|
148
|
+
generation: Schema.Number;
|
|
149
|
+
};
|
|
150
|
+
readonly EndedAnimation: {
|
|
151
|
+
generation: Schema.Number;
|
|
152
|
+
};
|
|
77
153
|
}>;
|
|
78
154
|
};
|
|
155
|
+
readonly PressedEntryPointer: {
|
|
156
|
+
entryId: Schema.String;
|
|
157
|
+
pointerId: Schema.Number;
|
|
158
|
+
clientX: Schema.Number;
|
|
159
|
+
};
|
|
160
|
+
readonly MovedSwipePointer: {
|
|
161
|
+
pointerId: Schema.Number;
|
|
162
|
+
clientX: Schema.Number;
|
|
163
|
+
};
|
|
164
|
+
readonly ReleasedSwipePointer: {
|
|
165
|
+
pointerId: Schema.Number;
|
|
166
|
+
clientX: Schema.Number;
|
|
167
|
+
};
|
|
168
|
+
readonly CancelledSwipe: {
|
|
169
|
+
pointerId: Schema.Number;
|
|
170
|
+
};
|
|
171
|
+
readonly PressedEscape: {};
|
|
172
|
+
readonly CompletedWaitForSwipeSettled: {
|
|
173
|
+
entryId: Schema.String;
|
|
174
|
+
version: Schema.Number;
|
|
175
|
+
};
|
|
79
176
|
}>;
|
|
80
177
|
export type Dismissed = typeof Message.Dismissed.Type;
|
|
81
178
|
export type DismissedAll = typeof Message.DismissedAll.Type;
|
|
@@ -83,6 +180,12 @@ export type CompletedWaitBeforeDismissal = typeof Message.CompletedWaitBeforeDis
|
|
|
83
180
|
export type HoveredEntry = typeof Message.HoveredEntry.Type;
|
|
84
181
|
export type LeftEntry = typeof Message.LeftEntry.Type;
|
|
85
182
|
export type GotAnimationMessage = typeof Message.GotAnimationMessage.Type;
|
|
183
|
+
export type PressedEntryPointer = typeof Message.PressedEntryPointer.Type;
|
|
184
|
+
export type MovedSwipePointer = typeof Message.MovedSwipePointer.Type;
|
|
185
|
+
export type ReleasedSwipePointer = typeof Message.ReleasedSwipePointer.Type;
|
|
186
|
+
export type CancelledSwipe = typeof Message.CancelledSwipe.Type;
|
|
187
|
+
export type PressedEscape = typeof Message.PressedEscape.Type;
|
|
188
|
+
export type CompletedWaitForSwipeSettled = typeof Message.CompletedWaitForSwipeSettled.Type;
|
|
86
189
|
/** Factory for the union of all messages the toast component can produce. */
|
|
87
190
|
export declare const makeMessage: <A, I>(payloadSchema: Schema.Codec<A, I>) => import("foldkit/message").MessageUnion<{
|
|
88
191
|
readonly Added: {
|
|
@@ -93,10 +196,27 @@ export declare const makeMessage: <A, I>(payloadSchema: Schema.Codec<A, I>) => i
|
|
|
93
196
|
readonly id: Schema.String;
|
|
94
197
|
readonly isShowing: Schema.Boolean;
|
|
95
198
|
readonly transitionState: Schema.Literals<readonly ["Idle", "EnterStart", "EnterAnimating", "LeaveStart", "LeaveAnimating"]>;
|
|
199
|
+
readonly transitionGeneration: Schema.Number;
|
|
96
200
|
}>;
|
|
97
201
|
readonly maybeDuration: Schema.Option<Schema.DurationFromMillis>;
|
|
98
202
|
readonly pendingDismissVersion: Schema.Number;
|
|
99
203
|
readonly isHovered: Schema.Boolean;
|
|
204
|
+
readonly swipeState: import("foldkit/schema").TaggedUnion<{
|
|
205
|
+
readonly Idle: {};
|
|
206
|
+
readonly Dragging: {
|
|
207
|
+
pointerId: Schema.Number;
|
|
208
|
+
startX: Schema.Number;
|
|
209
|
+
currentX: Schema.Number;
|
|
210
|
+
};
|
|
211
|
+
readonly Settling: {
|
|
212
|
+
offsetX: Schema.Number;
|
|
213
|
+
};
|
|
214
|
+
readonly Dismissing: {
|
|
215
|
+
offsetX: Schema.Number;
|
|
216
|
+
direction: Schema.Literals<readonly ["Left", "Right"]>;
|
|
217
|
+
};
|
|
218
|
+
}>;
|
|
219
|
+
readonly swipeVersion: Schema.Number;
|
|
100
220
|
readonly payload: Schema.Codec<A, I, never, never>;
|
|
101
221
|
}>;
|
|
102
222
|
};
|
|
@@ -119,10 +239,35 @@ export declare const makeMessage: <A, I>(payloadSchema: Schema.Codec<A, I>) => i
|
|
|
119
239
|
message: import("foldkit/message").MessageUnion<{
|
|
120
240
|
readonly Showed: {};
|
|
121
241
|
readonly Hid: {};
|
|
122
|
-
readonly CompletedWaitForPaint: {
|
|
123
|
-
|
|
242
|
+
readonly CompletedWaitForPaint: {
|
|
243
|
+
generation: Schema.Number;
|
|
244
|
+
};
|
|
245
|
+
readonly EndedAnimation: {
|
|
246
|
+
generation: Schema.Number;
|
|
247
|
+
};
|
|
124
248
|
}>;
|
|
125
249
|
};
|
|
250
|
+
readonly PressedEntryPointer: {
|
|
251
|
+
entryId: Schema.String;
|
|
252
|
+
pointerId: Schema.Number;
|
|
253
|
+
clientX: Schema.Number;
|
|
254
|
+
};
|
|
255
|
+
readonly MovedSwipePointer: {
|
|
256
|
+
pointerId: Schema.Number;
|
|
257
|
+
clientX: Schema.Number;
|
|
258
|
+
};
|
|
259
|
+
readonly ReleasedSwipePointer: {
|
|
260
|
+
pointerId: Schema.Number;
|
|
261
|
+
clientX: Schema.Number;
|
|
262
|
+
};
|
|
263
|
+
readonly CancelledSwipe: {
|
|
264
|
+
pointerId: Schema.Number;
|
|
265
|
+
};
|
|
266
|
+
readonly PressedEscape: {};
|
|
267
|
+
readonly CompletedWaitForSwipeSettled: {
|
|
268
|
+
entryId: Schema.String;
|
|
269
|
+
version: Schema.Number;
|
|
270
|
+
};
|
|
126
271
|
}>;
|
|
127
272
|
/** Factory for the union of out-messages the toast component can produce. */
|
|
128
273
|
export declare const makeOutMessage: <A, I>(payloadSchema: Schema.Codec<A, I>) => import("foldkit/message").MessageUnion<{
|
|
@@ -130,6 +275,14 @@ export declare const makeOutMessage: <A, I>(payloadSchema: Schema.Codec<A, I>) =
|
|
|
130
275
|
payload: Schema.Codec<A, I, never, never>;
|
|
131
276
|
};
|
|
132
277
|
}>;
|
|
278
|
+
/** Opt-in configuration for swipe-to-dismiss. Without `swipeToDismiss`,
|
|
279
|
+
* the view attaches no pointer handler and swipe Messages do nothing.
|
|
280
|
+
* Pass `{}` for the default rightward swipe, `{ threshold }` to change
|
|
281
|
+
* the distance, or `{ direction: 'Left' }` to swipe left. */
|
|
282
|
+
export type SwipeToDismissConfig = Readonly<{
|
|
283
|
+
threshold?: number;
|
|
284
|
+
direction?: SwipeDirection;
|
|
285
|
+
}>;
|
|
133
286
|
/** Configuration for creating a toast container model. `defaultDuration` is
|
|
134
287
|
* applied to any `show()` call that doesn't provide its own `duration` or
|
|
135
288
|
* pass `sticky: true`. Accepts any Effect Duration input; a bare number is
|
|
@@ -137,6 +290,7 @@ export declare const makeOutMessage: <A, I>(payloadSchema: Schema.Codec<A, I>) =
|
|
|
137
290
|
export type InitConfig = Readonly<{
|
|
138
291
|
id: string;
|
|
139
292
|
defaultDuration?: Duration.Input;
|
|
293
|
+
swipeToDismiss?: SwipeToDismissConfig;
|
|
140
294
|
}>;
|
|
141
295
|
export declare const DEFAULT_DURATION: Duration.Duration;
|
|
142
296
|
//# sourceMappingURL=schema.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../src/toast/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;
|
|
1
|
+
{"version":3,"file":"schema.d.ts","sourceRoot":"","sources":["../../src/toast/schema.ts"],"names":[],"mappings":"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"}
|
package/dist/toast/schema.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
2
|
import { Duration, Schema } from 'effect';
|
|
3
3
|
import { defineMessageUnion } from 'foldkit/message';
|
|
4
|
+
import { defineTaggedUnion } from 'foldkit/schema';
|
|
4
5
|
import * as Animation from '../animation/schema.js';
|
|
5
6
|
// VARIANT
|
|
6
7
|
/** Semantic category of a toast. Drives the default ARIA role: `status` for
|
|
@@ -19,13 +20,50 @@ export const Position = Schema.Literals([
|
|
|
19
20
|
'BottomCenter',
|
|
20
21
|
'BottomRight',
|
|
21
22
|
]);
|
|
23
|
+
// SWIPE
|
|
24
|
+
/** Direction in which a pointer can drag an entry to dismiss it. */
|
|
25
|
+
export const SwipeDirection = Schema.Literals(['Left', 'Right']);
|
|
26
|
+
const SwipeConfig = Schema.Struct({
|
|
27
|
+
direction: SwipeDirection,
|
|
28
|
+
threshold: Schema.Number,
|
|
29
|
+
});
|
|
30
|
+
/** Per-entry swipe gesture state. `Dragging` retains the initiating
|
|
31
|
+
* `pointerId`, so move, release, and cancel Messages update only the entry
|
|
32
|
+
* that started the gesture and ignore unrelated touches. `Settling` returns
|
|
33
|
+
* a cancelled or short swipe to rest. `Dismissing` retains the release offset
|
|
34
|
+
* and direction while the leave animation carries the entry off-screen. The
|
|
35
|
+
* settle generation lives in the entry's `swipeVersion` so a stale settle
|
|
36
|
+
* timer cannot clear a later gesture. */
|
|
37
|
+
export const SwipeState = defineTaggedUnion({
|
|
38
|
+
Idle: {},
|
|
39
|
+
Dragging: {
|
|
40
|
+
pointerId: Schema.Number,
|
|
41
|
+
startX: Schema.Number,
|
|
42
|
+
currentX: Schema.Number,
|
|
43
|
+
},
|
|
44
|
+
Settling: {
|
|
45
|
+
offsetX: Schema.Number,
|
|
46
|
+
},
|
|
47
|
+
Dismissing: {
|
|
48
|
+
offsetX: Schema.Number,
|
|
49
|
+
direction: SwipeDirection,
|
|
50
|
+
},
|
|
51
|
+
});
|
|
52
|
+
/** Default distance in pixels a pointer must travel to dismiss a Toast. */
|
|
53
|
+
export const DEFAULT_SWIPE_THRESHOLD = 40;
|
|
54
|
+
/** Default direction in which a pointer can dismiss a Toast. */
|
|
55
|
+
export const DEFAULT_SWIPE_DIRECTION = 'Right';
|
|
56
|
+
/** Time an entry remains in `Settling` after a short or cancelled swipe,
|
|
57
|
+
* allowing consumer CSS to animate it back to rest. */
|
|
58
|
+
export const SWIPE_SETTLE_DURATION = Duration.millis(150);
|
|
22
59
|
// ENTRY
|
|
23
60
|
/** Schema factory for a single toast entry. `payloadSchema` is user-provided
|
|
24
61
|
* and defines the shape of per-entry content, whatever the consumer wants
|
|
25
62
|
* to encode. The component itself owns only lifecycle + a11y fields: `id`,
|
|
26
63
|
* `variant` (for ARIA role), `animation`, `maybeDuration`,
|
|
27
|
-
* `pendingDismissVersion` (for cancellable auto-dismiss),
|
|
28
|
-
* (for pause-on-hover)
|
|
64
|
+
* `pendingDismissVersion` (for cancellable auto-dismiss), `isHovered`
|
|
65
|
+
* (for pause-on-hover), and `swipeState` + `swipeVersion` (for the
|
|
66
|
+
* opt-in swipe gesture). */
|
|
29
67
|
export const makeEntry = (payloadSchema) => __foldkitBrandViewResult((Schema.Struct({
|
|
30
68
|
id: Schema.String,
|
|
31
69
|
variant: Variant,
|
|
@@ -33,6 +71,8 @@ export const makeEntry = (payloadSchema) => __foldkitBrandViewResult((Schema.Str
|
|
|
33
71
|
maybeDuration: Schema.Option(Schema.DurationFromMillis),
|
|
34
72
|
pendingDismissVersion: Schema.Number,
|
|
35
73
|
isHovered: Schema.Boolean,
|
|
74
|
+
swipeState: SwipeState,
|
|
75
|
+
swipeVersion: Schema.Number,
|
|
36
76
|
payload: payloadSchema,
|
|
37
77
|
})), "@foldkit/ui/toast/schema.js#makeEntry");
|
|
38
78
|
// MODEL
|
|
@@ -46,6 +86,7 @@ export const makeModel = (payloadSchema) => __foldkitBrandViewResult((Schema.Str
|
|
|
46
86
|
defaultDuration: Schema.DurationFromMillis,
|
|
47
87
|
entries: Schema.Array(makeEntry(payloadSchema)),
|
|
48
88
|
nextEntryKey: Schema.Number,
|
|
89
|
+
maybeSwipeConfig: Schema.Option(SwipeConfig),
|
|
49
90
|
})), "@foldkit/ui/toast/schema.js#makeModel");
|
|
50
91
|
// MESSAGE
|
|
51
92
|
/** Payload-independent Message variants shared by every bound Toast module. */
|
|
@@ -62,6 +103,19 @@ export const Message = defineMessageUnion({
|
|
|
62
103
|
entryId: Schema.String,
|
|
63
104
|
message: Animation.Message,
|
|
64
105
|
},
|
|
106
|
+
PressedEntryPointer: {
|
|
107
|
+
entryId: Schema.String,
|
|
108
|
+
pointerId: Schema.Number,
|
|
109
|
+
clientX: Schema.Number,
|
|
110
|
+
},
|
|
111
|
+
MovedSwipePointer: { pointerId: Schema.Number, clientX: Schema.Number },
|
|
112
|
+
ReleasedSwipePointer: { pointerId: Schema.Number, clientX: Schema.Number },
|
|
113
|
+
CancelledSwipe: { pointerId: Schema.Number },
|
|
114
|
+
PressedEscape: {},
|
|
115
|
+
CompletedWaitForSwipeSettled: {
|
|
116
|
+
entryId: Schema.String,
|
|
117
|
+
version: Schema.Number,
|
|
118
|
+
},
|
|
65
119
|
});
|
|
66
120
|
/** Factory for the union of all messages the toast component can produce. */
|
|
67
121
|
export const makeMessage = (payloadSchema) => __foldkitBrandViewResult((defineMessageUnion({
|
|
@@ -78,6 +132,19 @@ export const makeMessage = (payloadSchema) => __foldkitBrandViewResult((defineMe
|
|
|
78
132
|
entryId: Schema.String,
|
|
79
133
|
message: Animation.Message,
|
|
80
134
|
},
|
|
135
|
+
PressedEntryPointer: {
|
|
136
|
+
entryId: Schema.String,
|
|
137
|
+
pointerId: Schema.Number,
|
|
138
|
+
clientX: Schema.Number,
|
|
139
|
+
},
|
|
140
|
+
MovedSwipePointer: { pointerId: Schema.Number, clientX: Schema.Number },
|
|
141
|
+
ReleasedSwipePointer: { pointerId: Schema.Number, clientX: Schema.Number },
|
|
142
|
+
CancelledSwipe: { pointerId: Schema.Number },
|
|
143
|
+
PressedEscape: {},
|
|
144
|
+
CompletedWaitForSwipeSettled: {
|
|
145
|
+
entryId: Schema.String,
|
|
146
|
+
version: Schema.Number,
|
|
147
|
+
},
|
|
81
148
|
})), "@foldkit/ui/toast/schema.js#makeMessage");
|
|
82
149
|
/** Factory for the union of out-messages the toast component can produce. */
|
|
83
150
|
export const makeOutMessage = (payloadSchema) => __foldkitBrandViewResult((defineMessageUnion({ DismissedToast: { payload: payloadSchema } })), "@foldkit/ui/toast/schema.js#makeOutMessage");
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/** Whether a pointerdown originated on a child that should not start a
|
|
2
|
+
* Toast swipe. Mouse and pen presses on explicitly marked text preserve
|
|
3
|
+
* selection, while touch can still swipe across that content. @internal */
|
|
4
|
+
export declare const isSwipeExcludedTarget: (pointerType: string, target: EventTarget | null) => boolean;
|
|
5
|
+
//# sourceMappingURL=swipeTarget.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"swipeTarget.d.ts","sourceRoot":"","sources":["../../src/toast/swipeTarget.ts"],"names":[],"mappings":"AAGA;;4EAE4E;AAC5E,eAAO,MAAM,qBAAqB,gBACnB,MAAM,UACX,WAAW,GAAG,IAAI,KACzB,OAiBF,CAAA"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
|
+
const SWIPE_EXCLUDED_TARGET_SELECTOR = 'button, a, input, select, textarea, [contenteditable], [role="button"], [role="link"]';
|
|
3
|
+
/** Whether a pointerdown originated on a child that should not start a
|
|
4
|
+
* Toast swipe. Mouse and pen presses on explicitly marked text preserve
|
|
5
|
+
* selection, while touch can still swipe across that content. @internal */
|
|
6
|
+
export const isSwipeExcludedTarget = (pointerType, target) => {
|
|
7
|
+
const targetElement = target instanceof Element ? target : null;
|
|
8
|
+
const parentElement = target instanceof Node ? target.parentElement : null;
|
|
9
|
+
const element = targetElement ?? parentElement;
|
|
10
|
+
if (element === null) {
|
|
11
|
+
return __foldkitBrandViewResult((false), "@foldkit/ui/toast/swipeTarget.js#isSwipeExcludedTarget");
|
|
12
|
+
}
|
|
13
|
+
if (element.closest(SWIPE_EXCLUDED_TARGET_SELECTOR) !== null) {
|
|
14
|
+
return __foldkitBrandViewResult((true), "@foldkit/ui/toast/swipeTarget.js#isSwipeExcludedTarget");
|
|
15
|
+
}
|
|
16
|
+
return (__foldkitBrandViewResult((pointerType !== 'touch' &&
|
|
17
|
+
element.closest('[data-toast-swipe-ignore]') !== null), "@foldkit/ui/toast/swipeTarget.js#isSwipeExcludedTarget"));
|
|
18
|
+
};
|
package/dist/toast/test.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ export type DrainEntryInput = Readonly<{
|
|
|
7
7
|
entryId: string;
|
|
8
8
|
version?: number;
|
|
9
9
|
}>;
|
|
10
|
-
/** Builds a
|
|
10
|
+
/** Builds a `Story.Command.resolveAll` step that drains a single toast
|
|
11
11
|
* entry's full animation and dismiss lifecycle. Resolving these Commands in
|
|
12
12
|
* order takes a freshly shown entry from its enter animation through
|
|
13
13
|
* auto-dismiss and its exit animation, ending with the entry removed from the
|
|
@@ -24,6 +24,12 @@ export type DrainEntryInput = Readonly<{
|
|
|
24
24
|
* - exit animation: `WaitForPaint` then `CompletedWaitForPaint`
|
|
25
25
|
* - exit settle: `WaitForAnimationSettled` then `EndedAnimation`
|
|
26
26
|
*
|
|
27
|
+
* The enter steps match animation transition generation `1`, which the
|
|
28
|
+
* entry's `Showed` starts, and the exit steps match generation `2`, which its
|
|
29
|
+
* `Hid` starts. Each step matches only its own generation, so the helper also
|
|
30
|
+
* an entry whose enter the test has already resolved. These versions are
|
|
31
|
+
* separate from the auto-dismiss timer `version`.
|
|
32
|
+
*
|
|
27
33
|
* Each step resolves with the child's raw result Message. `resolveAll` replays
|
|
28
34
|
* the matched Command's own recorded wrapping, so a parent that embeds the
|
|
29
35
|
* toast Submodel drains the same way without restating its `Got*` lift.
|
package/dist/toast/test.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"test.d.ts","sourceRoot":"","sources":["../../src/toast/test.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,eAAe,CAAA;AAMtC;;;2BAG2B;AAC3B,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"test.d.ts","sourceRoot":"","sources":["../../src/toast/test.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,eAAe,CAAA;AAMtC;;;2BAG2B;AAC3B,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC;IACrC,OAAO,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,CAAC,CAAA;AAMF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,eAAO,MAAM,UAAU,0BAGpB,eAAe,iKAoCf,CAAA"}
|