@foldkit/ui 0.124.0 → 0.126.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/tooltip/index.d.ts +5 -6
- package/dist/tooltip/index.d.ts.map +1 -1
- package/dist/tooltip/index.js +12 -28
- package/package.json +2 -2
package/dist/tooltip/index.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ import { type ChildAttribute, type Html } from 'foldkit/html';
|
|
|
4
4
|
import * as Mount from 'foldkit/mount';
|
|
5
5
|
import { type Reflect } from 'foldkit/submodel';
|
|
6
6
|
import { AnchorConfig } from '../anchor.js';
|
|
7
|
-
/** Schema for the tooltip component's state. `isOpen` is visibility; `isHovered` tracks pointer on trigger; `isFocused` tracks tooltip-affirming focus on the trigger (focus arriving without a preceding mouse press, like keyboard, touch, or pen; mouse-click-induced focus is excluded since it doesn't affirm the user wants the tooltip visible); `isDismissed` suppresses re-opening after the user dismissed the tooltip (via Escape
|
|
7
|
+
/** Schema for the tooltip component's state. `isOpen` is visibility; `isHovered` tracks pointer on trigger; `isFocused` tracks tooltip-affirming focus on the trigger (focus arriving without a preceding mouse press, like keyboard, touch, or pen; mouse-click-induced focus is excluded since it doesn't affirm the user wants the tooltip visible); `isDismissed` suppresses re-opening after the user dismissed the tooltip (via Escape) until they disengage (leave or blur). `showDelay` is the hover-to-show duration. `maybeLastPointerType` records the most recent pointer type that pressed the trigger, so a mouse-click-induced focus can be distinguished from other focus. */
|
|
8
8
|
export declare const Model: S.Struct<{
|
|
9
9
|
readonly id: S.String;
|
|
10
10
|
readonly isOpen: S.Boolean;
|
|
@@ -26,10 +26,11 @@ export declare const FocusedTrigger: import("foldkit/schema").CallableTaggedStru
|
|
|
26
26
|
export declare const BlurredTrigger: import("foldkit/schema").CallableTaggedStruct<"BlurredTrigger", {}>;
|
|
27
27
|
/** Sent when Escape is pressed while the tooltip is visible. */
|
|
28
28
|
export declare const PressedEscape: import("foldkit/schema").CallableTaggedStruct<"PressedEscape", {}>;
|
|
29
|
-
/** Sent when a pointer presses the trigger.
|
|
29
|
+
/** Sent when a pointer presses the trigger. Recorded so the focus that
|
|
30
|
+
* follows a mouse press can be told apart from focus that affirms the
|
|
31
|
+
* tooltip (keyboard, touch, or pen). */
|
|
30
32
|
export declare const PressedPointerOnTrigger: import("foldkit/schema").CallableTaggedStruct<"PressedPointerOnTrigger", {
|
|
31
33
|
pointerType: S.String;
|
|
32
|
-
button: S.Number;
|
|
33
34
|
}>;
|
|
34
35
|
/** Sent when the show-delay timer fires. */
|
|
35
36
|
export declare const ElapsedShowDelay: import("foldkit/schema").CallableTaggedStruct<"ElapsedShowDelay", {
|
|
@@ -138,8 +139,7 @@ export type ViewInputs = Readonly<{
|
|
|
138
139
|
}>;
|
|
139
140
|
/** Renders a headless tooltip with an anchored non-interactive panel.
|
|
140
141
|
* Shows on hover (after delay) or focus (from keyboard, touch, or pen;
|
|
141
|
-
* mouse-click focus is excluded)
|
|
142
|
-
* left-click of the trigger. */
|
|
142
|
+
* mouse-click focus is excluded). Hides on leave, blur, or Escape. */
|
|
143
143
|
export declare const view: import("foldkit/submodel").View<S.Struct.ReadonlySide<{
|
|
144
144
|
readonly id: S.String;
|
|
145
145
|
readonly isOpen: S.Boolean;
|
|
@@ -162,7 +162,6 @@ export declare const view: import("foldkit/submodel").View<S.Struct.ReadonlySide
|
|
|
162
162
|
}, "Type"> | S.Struct.ReadonlySide<{
|
|
163
163
|
readonly _tag: S.tag<"PressedPointerOnTrigger">;
|
|
164
164
|
pointerType: S.String;
|
|
165
|
-
button: S.Number;
|
|
166
165
|
}, "Type"> | S.Struct.ReadonlySide<{
|
|
167
166
|
readonly _tag: S.tag<"ElapsedShowDelay">;
|
|
168
167
|
version: S.Number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tooltip/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,MAAM,EAKN,MAAM,EAEN,MAAM,IAAI,CAAC,EACZ,MAAM,QAAQ,CAAA;AACf,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC1C,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,IAAI,EAGV,MAAM,cAAc,CAAA;AAErB,OAAO,KAAK,KAAK,MAAM,eAAe,CAAA;AAEtC,OAAO,EAAE,KAAK,OAAO,EAAc,MAAM,kBAAkB,CAAA;AAE3D,OAAO,EAAE,YAAY,EAAe,MAAM,cAAc,CAAA;AAKxD,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tooltip/index.ts"],"names":[],"mappings":"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"}
|
package/dist/tooltip/index.js
CHANGED
|
@@ -8,7 +8,7 @@ import { defineView } from 'foldkit/submodel';
|
|
|
8
8
|
import { AnchorConfig, anchorSetup } from '../anchor.js';
|
|
9
9
|
import * as OptionExt from '../internal/optionExtensions.js';
|
|
10
10
|
// MODEL
|
|
11
|
-
/** Schema for the tooltip component's state. `isOpen` is visibility; `isHovered` tracks pointer on trigger; `isFocused` tracks tooltip-affirming focus on the trigger (focus arriving without a preceding mouse press, like keyboard, touch, or pen; mouse-click-induced focus is excluded since it doesn't affirm the user wants the tooltip visible); `isDismissed` suppresses re-opening after the user dismissed the tooltip (via Escape
|
|
11
|
+
/** Schema for the tooltip component's state. `isOpen` is visibility; `isHovered` tracks pointer on trigger; `isFocused` tracks tooltip-affirming focus on the trigger (focus arriving without a preceding mouse press, like keyboard, touch, or pen; mouse-click-induced focus is excluded since it doesn't affirm the user wants the tooltip visible); `isDismissed` suppresses re-opening after the user dismissed the tooltip (via Escape) until they disengage (leave or blur). `showDelay` is the hover-to-show duration. `maybeLastPointerType` records the most recent pointer type that pressed the trigger, so a mouse-click-induced focus can be distinguished from other focus. */
|
|
12
12
|
export const Model = S.Struct({
|
|
13
13
|
id: S.String,
|
|
14
14
|
isOpen: S.Boolean,
|
|
@@ -30,10 +30,11 @@ export const FocusedTrigger = m('FocusedTrigger');
|
|
|
30
30
|
export const BlurredTrigger = m('BlurredTrigger');
|
|
31
31
|
/** Sent when Escape is pressed while the tooltip is visible. */
|
|
32
32
|
export const PressedEscape = m('PressedEscape');
|
|
33
|
-
/** Sent when a pointer presses the trigger.
|
|
33
|
+
/** Sent when a pointer presses the trigger. Recorded so the focus that
|
|
34
|
+
* follows a mouse press can be told apart from focus that affirms the
|
|
35
|
+
* tooltip (keyboard, touch, or pen). */
|
|
34
36
|
export const PressedPointerOnTrigger = m('PressedPointerOnTrigger', {
|
|
35
37
|
pointerType: S.String,
|
|
36
|
-
button: S.Number,
|
|
37
38
|
});
|
|
38
39
|
/** Sent when the show-delay timer fires. */
|
|
39
40
|
export const ElapsedShowDelay = m('ElapsedShowDelay', {
|
|
@@ -69,7 +70,6 @@ export const OutMessage = S.Union([Shown, Hidden]);
|
|
|
69
70
|
export const triggerId = (id) => `${id}-trigger`;
|
|
70
71
|
// INIT
|
|
71
72
|
const DEFAULT_SHOW_DELAY = Duration.millis(500);
|
|
72
|
-
const LEFT_MOUSE_BUTTON = 0;
|
|
73
73
|
/** Creates an initial tooltip model from a config. Defaults to hidden. */
|
|
74
74
|
export const init = (config) => ({
|
|
75
75
|
id: config.id,
|
|
@@ -164,27 +164,12 @@ const computeUpdate = (model, message) => M.value(message).pipe(withUpdateReturn
|
|
|
164
164
|
}),
|
|
165
165
|
[],
|
|
166
166
|
],
|
|
167
|
-
PressedPointerOnTrigger: ({ pointerType
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
isOpen: () => false,
|
|
174
|
-
isFocused: () => false,
|
|
175
|
-
isDismissed: () => true,
|
|
176
|
-
pendingShowVersion: Number.increment,
|
|
177
|
-
}),
|
|
178
|
-
[],
|
|
179
|
-
];
|
|
180
|
-
}
|
|
181
|
-
return [
|
|
182
|
-
evo(model, {
|
|
183
|
-
maybeLastPointerType: () => Option.some(pointerType),
|
|
184
|
-
}),
|
|
185
|
-
[],
|
|
186
|
-
];
|
|
187
|
-
},
|
|
167
|
+
PressedPointerOnTrigger: ({ pointerType }) => [
|
|
168
|
+
evo(model, {
|
|
169
|
+
maybeLastPointerType: () => Option.some(pointerType),
|
|
170
|
+
}),
|
|
171
|
+
[],
|
|
172
|
+
],
|
|
188
173
|
ElapsedShowDelay: ({ version }) => {
|
|
189
174
|
if (version !== model.pendingShowVersion) {
|
|
190
175
|
return [model, []];
|
|
@@ -215,8 +200,7 @@ export const update = (model, message) => {
|
|
|
215
200
|
export const reflectShowDelay = Function.dual(2, (model, showDelay) => evo(model, { showDelay: () => Duration.fromInputUnsafe(showDelay) }));
|
|
216
201
|
/** Renders a headless tooltip with an anchored non-interactive panel.
|
|
217
202
|
* Shows on hover (after delay) or focus (from keyboard, touch, or pen;
|
|
218
|
-
* mouse-click focus is excluded)
|
|
219
|
-
* left-click of the trigger. */
|
|
203
|
+
* mouse-click focus is excluded). Hides on leave, blur, or Escape. */
|
|
220
204
|
export const view = defineView((model, viewInputs) => {
|
|
221
205
|
const h = html();
|
|
222
206
|
const { id, isOpen } = model;
|
|
@@ -234,7 +218,7 @@ export const view = defineView((model, viewInputs) => {
|
|
|
234
218
|
};
|
|
235
219
|
const triggerLabelAttributes = resolveTriggerLabel();
|
|
236
220
|
const handleTriggerKeyDown = (key) => M.value(key).pipe(M.when('Escape', () => OptionExt.when(isOpen, PressedEscape())), M.orElse(() => Option.none()));
|
|
237
|
-
const handleTriggerPointerDown = (pointerType
|
|
221
|
+
const handleTriggerPointerDown = (pointerType) => Option.some(PressedPointerOnTrigger({ pointerType }));
|
|
238
222
|
const triggerAttributes = [
|
|
239
223
|
h.Id(`${id}-trigger`),
|
|
240
224
|
h.Type('button'),
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@foldkit/ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.126.0",
|
|
4
4
|
"description": "Headless, accessible UI components for Foldkit",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -127,7 +127,7 @@
|
|
|
127
127
|
"typedoc": "^0.28.19",
|
|
128
128
|
"typescript": "^6.0.3",
|
|
129
129
|
"vitest": "^4.1.9",
|
|
130
|
-
"foldkit": "0.
|
|
130
|
+
"foldkit": "0.126.0"
|
|
131
131
|
},
|
|
132
132
|
"keywords": [
|
|
133
133
|
"foldkit",
|