foldkit 0.19.0 → 0.20.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/README.md +3 -3
- package/dist/command/index.d.ts +4 -0
- package/dist/command/index.d.ts.map +1 -0
- package/dist/command/index.js +1 -0
- package/dist/command/public.d.ts +2 -0
- package/dist/command/public.d.ts.map +1 -0
- package/dist/command/public.js +1 -0
- package/dist/html/index.d.ts +14 -0
- package/dist/html/index.d.ts.map +1 -1
- package/dist/html/index.js +5 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/runtime/public.d.ts +1 -1
- package/dist/runtime/public.d.ts.map +1 -1
- package/dist/runtime/runtime.d.ts +2 -3
- package/dist/runtime/runtime.d.ts.map +1 -1
- package/dist/runtime/runtime.js +1 -1
- package/dist/task/dom.d.ts +26 -27
- package/dist/task/dom.d.ts.map +1 -1
- package/dist/task/dom.js +36 -37
- package/dist/task/error.d.ts +18 -0
- package/dist/task/error.d.ts.map +1 -0
- package/dist/task/error.js +7 -0
- package/dist/task/index.d.ts +1 -0
- package/dist/task/index.d.ts.map +1 -1
- package/dist/task/index.js +1 -0
- package/dist/task/inert.d.ts +12 -11
- package/dist/task/inert.d.ts.map +1 -1
- package/dist/task/inert.js +12 -13
- package/dist/task/public.d.ts +1 -1
- package/dist/task/public.d.ts.map +1 -1
- package/dist/task/public.js +1 -1
- package/dist/task/random.d.ts +3 -4
- package/dist/task/random.d.ts.map +1 -1
- package/dist/task/random.js +3 -4
- package/dist/task/scrollLock.d.ts +9 -9
- package/dist/task/scrollLock.d.ts.map +1 -1
- package/dist/task/scrollLock.js +9 -11
- package/dist/task/time.d.ts +17 -16
- package/dist/task/time.d.ts.map +1 -1
- package/dist/task/time.js +20 -21
- package/dist/task/timing.d.ts +14 -15
- package/dist/task/timing.d.ts.map +1 -1
- package/dist/task/timing.js +16 -20
- package/dist/ui/dialog/index.d.ts +1 -1
- package/dist/ui/dialog/index.d.ts.map +1 -1
- package/dist/ui/dialog/index.js +3 -3
- package/dist/ui/disclosure/index.d.ts +1 -1
- package/dist/ui/disclosure/index.d.ts.map +1 -1
- package/dist/ui/disclosure/index.js +3 -3
- package/dist/ui/menu/index.d.ts +1 -1
- package/dist/ui/menu/index.d.ts.map +1 -1
- package/dist/ui/menu/index.js +24 -17
- package/dist/ui/tabs/index.d.ts +4 -5
- package/dist/ui/tabs/index.d.ts.map +1 -1
- package/dist/ui/tabs/index.js +6 -8
- package/package.json +9 -1
package/dist/ui/menu/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Option, Schema as S } from 'effect';
|
|
2
|
+
import type { Command } from '../../command';
|
|
2
3
|
import type { Html } from '../../html';
|
|
3
|
-
import type { Command } from '../../runtime/runtime';
|
|
4
4
|
/** Schema for the activation trigger — whether the user interacted via mouse or keyboard. */
|
|
5
5
|
export declare const ActivationTrigger: S.Literal<["Pointer", "Keyboard"]>;
|
|
6
6
|
export type ActivationTrigger = typeof ActivationTrigger.Type;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/menu/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/menu/index.ts"],"names":[],"mappings":"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"}
|
package/dist/ui/menu/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Array, Match as M, Option, Schema as S, String as Str, pipe, } from 'effect';
|
|
1
|
+
import { Array, Effect, Match as M, Option, Schema as S, String as Str, pipe, } from 'effect';
|
|
2
2
|
import { OptionExt } from '../../effectExtensions';
|
|
3
3
|
import { html } from '../../html';
|
|
4
4
|
import { m } from '../../message';
|
|
@@ -123,11 +123,14 @@ const itemsSelector = (id) => `#${id}-items`;
|
|
|
123
123
|
const itemSelector = (id, index) => `#${id}-item-${index}`;
|
|
124
124
|
/** Processes a menu message and returns the next model and commands. */
|
|
125
125
|
export const update = (model, message) => {
|
|
126
|
-
const maybeNextFrameCommand = OptionExt.when(model.isAnimated, Task.nextFrame((
|
|
127
|
-
const maybeLockScrollCommand = OptionExt.when(model.isModal, Task.lockScroll((
|
|
128
|
-
const maybeUnlockScrollCommand = OptionExt.when(model.isModal, Task.unlockScroll((
|
|
129
|
-
const maybeInertOthersCommand = OptionExt.when(model.isModal, Task.inertOthers(model.id, [
|
|
130
|
-
|
|
126
|
+
const maybeNextFrameCommand = OptionExt.when(model.isAnimated, Task.nextFrame.pipe(Effect.as(AdvancedTransitionFrame())));
|
|
127
|
+
const maybeLockScrollCommand = OptionExt.when(model.isModal, Task.lockScroll.pipe(Effect.as(NoOp())));
|
|
128
|
+
const maybeUnlockScrollCommand = OptionExt.when(model.isModal, Task.unlockScroll.pipe(Effect.as(NoOp())));
|
|
129
|
+
const maybeInertOthersCommand = OptionExt.when(model.isModal, Task.inertOthers(model.id, [
|
|
130
|
+
buttonSelector(model.id),
|
|
131
|
+
itemsSelector(model.id),
|
|
132
|
+
]).pipe(Effect.as(NoOp())));
|
|
133
|
+
const maybeRestoreInertCommand = OptionExt.when(model.isModal, Task.restoreInert(model.id).pipe(Effect.as(NoOp())));
|
|
131
134
|
return M.value(message).pipe(M.withReturnType(), M.tagsExhaustive({
|
|
132
135
|
Opened: ({ maybeActiveItemIndex }) => {
|
|
133
136
|
const nextModel = evo(model, {
|
|
@@ -148,7 +151,7 @@ export const update = (model, message) => {
|
|
|
148
151
|
maybeNextFrameCommand,
|
|
149
152
|
maybeLockScrollCommand,
|
|
150
153
|
maybeInertOthersCommand,
|
|
151
|
-
]), Array.prepend(Task.focus(itemsSelector(model.id), (
|
|
154
|
+
]), Array.prepend(Task.focus(itemsSelector(model.id)).pipe(Effect.ignore, Effect.as(NoOp())))),
|
|
152
155
|
];
|
|
153
156
|
},
|
|
154
157
|
Closed: () => [
|
|
@@ -157,7 +160,7 @@ export const update = (model, message) => {
|
|
|
157
160
|
maybeNextFrameCommand,
|
|
158
161
|
maybeUnlockScrollCommand,
|
|
159
162
|
maybeRestoreInertCommand,
|
|
160
|
-
]), Array.prepend(Task.focus(buttonSelector(model.id), (
|
|
163
|
+
]), Array.prepend(Task.focus(buttonSelector(model.id)).pipe(Effect.ignore, Effect.as(NoOp())))),
|
|
161
164
|
],
|
|
162
165
|
ClosedByTab: () => [
|
|
163
166
|
closedModel(model),
|
|
@@ -173,7 +176,9 @@ export const update = (model, message) => {
|
|
|
173
176
|
activationTrigger: () => activationTrigger,
|
|
174
177
|
}),
|
|
175
178
|
activationTrigger === 'Keyboard'
|
|
176
|
-
? [
|
|
179
|
+
? [
|
|
180
|
+
Task.scrollIntoView(itemSelector(model.id, index)).pipe(Effect.ignore, Effect.as(NoOp())),
|
|
181
|
+
]
|
|
177
182
|
: [],
|
|
178
183
|
],
|
|
179
184
|
MovedPointerOverItem: ({ index, screenX, screenY }) => {
|
|
@@ -199,11 +204,13 @@ export const update = (model, message) => {
|
|
|
199
204
|
maybeNextFrameCommand,
|
|
200
205
|
maybeUnlockScrollCommand,
|
|
201
206
|
maybeRestoreInertCommand,
|
|
202
|
-
]), Array.prepend(Task.focus(buttonSelector(model.id), (
|
|
207
|
+
]), Array.prepend(Task.focus(buttonSelector(model.id)).pipe(Effect.ignore, Effect.as(NoOp())))),
|
|
203
208
|
],
|
|
204
209
|
RequestedItemClick: ({ index }) => [
|
|
205
210
|
model,
|
|
206
|
-
[
|
|
211
|
+
[
|
|
212
|
+
Task.clickElement(itemSelector(model.id, index)).pipe(Effect.ignore, Effect.as(NoOp())),
|
|
213
|
+
],
|
|
207
214
|
],
|
|
208
215
|
Searched: ({ key, maybeTargetIndex }) => {
|
|
209
216
|
const nextSearchQuery = model.searchQuery + key;
|
|
@@ -215,7 +222,7 @@ export const update = (model, message) => {
|
|
|
215
222
|
maybeActiveItemIndex: () => Option.orElse(maybeTargetIndex, () => model.maybeActiveItemIndex),
|
|
216
223
|
}),
|
|
217
224
|
[
|
|
218
|
-
Task.delay(SEARCH_DEBOUNCE_MILLISECONDS
|
|
225
|
+
Task.delay(SEARCH_DEBOUNCE_MILLISECONDS).pipe(Effect.as(ClearedSearch({ version: nextSearchVersion }))),
|
|
219
226
|
],
|
|
220
227
|
];
|
|
221
228
|
},
|
|
@@ -228,12 +235,12 @@ export const update = (model, message) => {
|
|
|
228
235
|
AdvancedTransitionFrame: () => M.value(model.transitionState).pipe(M.withReturnType(), M.when('EnterStart', () => [
|
|
229
236
|
evo(model, { transitionState: () => 'EnterAnimating' }),
|
|
230
237
|
[
|
|
231
|
-
Task.waitForTransitions(itemsSelector(model.id)
|
|
238
|
+
Task.waitForTransitions(itemsSelector(model.id)).pipe(Effect.as(EndedTransition())),
|
|
232
239
|
],
|
|
233
240
|
]), M.when('LeaveStart', () => [
|
|
234
241
|
evo(model, { transitionState: () => 'LeaveAnimating' }),
|
|
235
242
|
[
|
|
236
|
-
Task.waitForTransitions(itemsSelector(model.id)
|
|
243
|
+
Task.waitForTransitions(itemsSelector(model.id)).pipe(Effect.as(EndedTransition())),
|
|
237
244
|
],
|
|
238
245
|
]), M.orElse(() => [model, []])),
|
|
239
246
|
EndedTransition: () => M.value(model.transitionState).pipe(M.withReturnType(), M.whenOr('EnterAnimating', 'LeaveAnimating', () => [
|
|
@@ -254,7 +261,7 @@ export const update = (model, message) => {
|
|
|
254
261
|
maybeNextFrameCommand,
|
|
255
262
|
maybeUnlockScrollCommand,
|
|
256
263
|
maybeRestoreInertCommand,
|
|
257
|
-
]), Array.prepend(Task.focus(buttonSelector(model.id), (
|
|
264
|
+
]), Array.prepend(Task.focus(buttonSelector(model.id)).pipe(Effect.ignore, Effect.as(NoOp())))),
|
|
258
265
|
];
|
|
259
266
|
}
|
|
260
267
|
const nextModel = evo(withPointerType, {
|
|
@@ -273,7 +280,7 @@ export const update = (model, message) => {
|
|
|
273
280
|
maybeNextFrameCommand,
|
|
274
281
|
maybeLockScrollCommand,
|
|
275
282
|
maybeInertOthersCommand,
|
|
276
|
-
]), Array.prepend(Task.focus(itemsSelector(model.id), (
|
|
283
|
+
]), Array.prepend(Task.focus(itemsSelector(model.id)).pipe(Effect.ignore, Effect.as(NoOp())))),
|
|
277
284
|
];
|
|
278
285
|
},
|
|
279
286
|
ReleasedPointerOnItems: ({ screenX, screenY, timeStamp }) => {
|
|
@@ -293,7 +300,7 @@ export const update = (model, message) => {
|
|
|
293
300
|
return [
|
|
294
301
|
model,
|
|
295
302
|
[
|
|
296
|
-
Task.clickElement(itemSelector(model.id, model.maybeActiveItemIndex.value), (
|
|
303
|
+
Task.clickElement(itemSelector(model.id, model.maybeActiveItemIndex.value)).pipe(Effect.ignore, Effect.as(NoOp())),
|
|
297
304
|
],
|
|
298
305
|
];
|
|
299
306
|
},
|
package/dist/ui/tabs/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Schema as S } from 'effect';
|
|
2
|
+
import type { Command } from '../../command';
|
|
2
3
|
import type { Html, TagName } from '../../html';
|
|
3
|
-
import type { Command } from '../../runtime/runtime';
|
|
4
4
|
export { wrapIndex, findFirstEnabledIndex, keyToIndex } from '../keyboard';
|
|
5
5
|
/** Controls the tab list layout direction and which arrow keys navigate between tabs. */
|
|
6
6
|
export declare const Orientation: S.Literal<["Horizontal", "Vertical"]>;
|
|
@@ -8,12 +8,11 @@ export type Orientation = typeof Orientation.Type;
|
|
|
8
8
|
/** Controls whether tabs activate on focus (`Automatic`) or require an explicit selection (`Manual`). */
|
|
9
9
|
export declare const ActivationMode: S.Literal<["Automatic", "Manual"]>;
|
|
10
10
|
export type ActivationMode = typeof ActivationMode.Type;
|
|
11
|
-
/** Schema for the tabs component's state, tracking active/focused indices
|
|
11
|
+
/** Schema for the tabs component's state, tracking active/focused indices and activation mode. */
|
|
12
12
|
export declare const Model: S.Struct<{
|
|
13
13
|
id: typeof S.String;
|
|
14
14
|
activeIndex: typeof S.Number;
|
|
15
15
|
focusedIndex: typeof S.Number;
|
|
16
|
-
orientation: S.Literal<["Horizontal", "Vertical"]>;
|
|
17
16
|
activationMode: S.Literal<["Automatic", "Manual"]>;
|
|
18
17
|
}>;
|
|
19
18
|
export type Model = typeof Model.Type;
|
|
@@ -41,10 +40,9 @@ export type Message = typeof Message.Type;
|
|
|
41
40
|
export type InitConfig = Readonly<{
|
|
42
41
|
id: string;
|
|
43
42
|
activeIndex?: number;
|
|
44
|
-
orientation?: Orientation;
|
|
45
43
|
activationMode?: ActivationMode;
|
|
46
44
|
}>;
|
|
47
|
-
/** Creates an initial tabs model from a config. Defaults to first tab
|
|
45
|
+
/** Creates an initial tabs model from a config. Defaults to first tab and automatic activation. */
|
|
48
46
|
export declare const init: (config: InitConfig) => Model;
|
|
49
47
|
/** Processes a tabs message and returns the next model and commands. */
|
|
50
48
|
export declare const update: (model: Model, message: Message) => [Model, ReadonlyArray<Command<Message>>];
|
|
@@ -65,6 +63,7 @@ export type ViewConfig<Message, Tab extends string> = Readonly<{
|
|
|
65
63
|
}) => TabConfig;
|
|
66
64
|
isTabDisabled?: (tab: Tab, index: number) => boolean;
|
|
67
65
|
persistPanels?: boolean;
|
|
66
|
+
orientation?: Orientation;
|
|
68
67
|
tabListElement?: TagName;
|
|
69
68
|
tabElement?: TagName;
|
|
70
69
|
panelElement?: TagName;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/tabs/index.ts"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/tabs/index.ts"],"names":[],"mappings":"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"}
|
package/dist/ui/tabs/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Array, Match as M, Option, Schema as S, String, pipe } from 'effect';
|
|
1
|
+
import { Array, Effect, Match as M, Option, Schema as S, String, pipe, } from 'effect';
|
|
2
2
|
import { html } from '../../html';
|
|
3
3
|
import { m } from '../../message';
|
|
4
4
|
import { evo } from '../../struct';
|
|
@@ -10,12 +10,11 @@ export { wrapIndex, findFirstEnabledIndex, keyToIndex } from '../keyboard';
|
|
|
10
10
|
export const Orientation = S.Literal('Horizontal', 'Vertical');
|
|
11
11
|
/** Controls whether tabs activate on focus (`Automatic`) or require an explicit selection (`Manual`). */
|
|
12
12
|
export const ActivationMode = S.Literal('Automatic', 'Manual');
|
|
13
|
-
/** Schema for the tabs component's state, tracking active/focused indices
|
|
13
|
+
/** Schema for the tabs component's state, tracking active/focused indices and activation mode. */
|
|
14
14
|
export const Model = S.Struct({
|
|
15
15
|
id: S.String,
|
|
16
16
|
activeIndex: S.Number,
|
|
17
17
|
focusedIndex: S.Number,
|
|
18
|
-
orientation: Orientation,
|
|
19
18
|
activationMode: ActivationMode,
|
|
20
19
|
});
|
|
21
20
|
// MESSAGE
|
|
@@ -27,14 +26,13 @@ export const TabFocused = m('TabFocused', { index: S.Number });
|
|
|
27
26
|
export const NoOp = m('NoOp');
|
|
28
27
|
/** Union of all messages the tabs component can produce. */
|
|
29
28
|
export const Message = S.Union(TabSelected, TabFocused, NoOp);
|
|
30
|
-
/** Creates an initial tabs model from a config. Defaults to first tab
|
|
29
|
+
/** Creates an initial tabs model from a config. Defaults to first tab and automatic activation. */
|
|
31
30
|
export const init = (config) => {
|
|
32
31
|
const activeIndex = config.activeIndex ?? 0;
|
|
33
32
|
return {
|
|
34
33
|
id: config.id,
|
|
35
34
|
activeIndex,
|
|
36
35
|
focusedIndex: activeIndex,
|
|
37
|
-
orientation: config.orientation ?? 'Horizontal',
|
|
38
36
|
activationMode: config.activationMode ?? 'Automatic',
|
|
39
37
|
};
|
|
40
38
|
};
|
|
@@ -48,14 +46,14 @@ export const update = (model, message) => M.value(message).pipe(M.withReturnType
|
|
|
48
46
|
activeIndex: () => index,
|
|
49
47
|
focusedIndex: () => index,
|
|
50
48
|
}),
|
|
51
|
-
[Task.focus(tabSelector, (
|
|
49
|
+
[Task.focus(tabSelector).pipe(Effect.ignore, Effect.as(NoOp()))],
|
|
52
50
|
];
|
|
53
51
|
},
|
|
54
52
|
TabFocused: ({ index }) => {
|
|
55
53
|
const tabSelector = `#${tabId(model.id, index)}`;
|
|
56
54
|
return [
|
|
57
55
|
evo(model, { focusedIndex: () => index }),
|
|
58
|
-
[Task.focus(tabSelector, (
|
|
56
|
+
[Task.focus(tabSelector).pipe(Effect.ignore, Effect.as(NoOp()))],
|
|
59
57
|
];
|
|
60
58
|
},
|
|
61
59
|
NoOp: () => [model, []],
|
|
@@ -65,7 +63,7 @@ const tabId = (id, index) => `${id}-tab-${index}`;
|
|
|
65
63
|
/** Renders a headless tab group with accessible ARIA roles, roving tabindex, and keyboard navigation. */
|
|
66
64
|
export const view = (config) => {
|
|
67
65
|
const { div, empty, AriaControls, AriaDisabled, AriaLabelledBy, AriaOrientation, AriaSelected, Class, DataAttribute, Disabled, Hidden, Id, OnClick, OnKeyDownPreventDefault, Role, Tabindex, Type, keyed, } = html();
|
|
68
|
-
const { model, model: { id,
|
|
66
|
+
const { model, model: { id, activationMode, focusedIndex }, toMessage, tabs, tabToConfig, isTabDisabled, persistPanels, orientation = 'Horizontal', tabListElement = 'div', tabElement = 'button', panelElement = 'div', className, tabListClassName, } = config;
|
|
69
67
|
const isDisabled = (index) => !!isTabDisabled &&
|
|
70
68
|
pipe(tabs, Array.get(index), Option.exists(tab => isTabDisabled(tab, index)));
|
|
71
69
|
const { nextKey, previousKey } = M.value(orientation).pipe(M.when('Horizontal', () => ({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "foldkit",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.20.0",
|
|
4
4
|
"description": "Elm-inspired UI framework powered by Effect",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -11,6 +11,10 @@
|
|
|
11
11
|
"types": "./dist/index.d.ts",
|
|
12
12
|
"import": "./dist/index.js"
|
|
13
13
|
},
|
|
14
|
+
"./command": {
|
|
15
|
+
"types": "./dist/command/public.d.ts",
|
|
16
|
+
"import": "./dist/command/public.js"
|
|
17
|
+
},
|
|
14
18
|
"./html": {
|
|
15
19
|
"types": "./dist/html/public.d.ts",
|
|
16
20
|
"import": "./dist/html/public.js"
|
|
@@ -43,6 +47,10 @@
|
|
|
43
47
|
"types": "./dist/struct/public.d.ts",
|
|
44
48
|
"import": "./dist/struct/public.js"
|
|
45
49
|
},
|
|
50
|
+
"./task": {
|
|
51
|
+
"types": "./dist/task/public.d.ts",
|
|
52
|
+
"import": "./dist/task/public.js"
|
|
53
|
+
},
|
|
46
54
|
"./ui": {
|
|
47
55
|
"types": "./dist/ui/index.d.ts",
|
|
48
56
|
"import": "./dist/ui/index.js"
|