@foldkit/devtools 0.166.0-canary.085b787da0a5 → 0.166.0-canary.3b49f516b024
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/overlay.d.ts.map +1 -1
- package/dist/overlay.js +55 -53
- package/package.json +7 -7
package/dist/overlay.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,OAAO,EACP,MAAM,EAGN,OAAO,EAGP,MAAM,
|
|
1
|
+
{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../src/overlay.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,OAAO,EACP,MAAM,EAGN,OAAO,EAGP,MAAM,EAIN,MAAM,EAGN,eAAe,EAEhB,MAAM,QAAQ,CAAA;AAGf,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAA;AAC1C,OAAO,EACL,KAAK,aAAa,EAElB,KAAK,aAAa,EAGlB,KAAK,WAAW,EAChB,KAAK,UAAU,EAKhB,MAAM,uBAAuB,CAAA;AAW9B,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;;;;;;;;;;;;;;;;;;;;AA6ZrE,cAAM,YAAa,SAAQ,iBAE1B;CAAG;;AAEJ,cAAM,iBAAkB,SAAQ,sBAGC;CAAG;AAEpC,eAAO,MAAM,UAAU;;iBAGrB,CAAA;AAEF,eAAO,MAAM,YAAY;;iBAGvB,CAAA;AAoCF,eAAO,MAAM,oBAAoB;;;;;iBAkB/B,CAAA;AAuBF,eAAO,MAAM,gBAAgB;;;;;;;;wBAS3B,CAAA;AAEF,eAAO,MAAM,YAAY;;;;;;;;wBAIvB,CAAA;AAEF,eAAO,MAAM,aAAa;;;;;;wBAOxB,CAAA;AAEF,eAAO,MAAM,MAAM;;wBAOjB,CAAA;AAEF,eAAO,MAAM,KAAK;;wBAOhB,CAAA;AAEF,eAAO,MAAM,sBAAsB;;;;;;;;;;;;iBAyBjC,CAAA;AAIF,eAAO,MAAM,6BAA6B;;;;;;;iBAezC,CAAA;AAED,eAAO,MAAM,WAAW;;6BAUtB,CAAA;AAwoEF,eAAO,MAAM,aAAa,UACjB,aAAa,YACV,gBAAgB,QACpB,YAAY,eACL,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,6DAqFhC,CAAA"}
|
package/dist/overlay.js
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { brandViewResult as __foldkitBrandViewResult } from 'foldkit/brand'
|
|
2
2
|
import { clsx } from 'clsx';
|
|
3
|
-
import { Array, Context, Effect, Function, HashMap, HashSet, Match, Number, Option, Order, Predicate,
|
|
3
|
+
import { Array, Context, Effect, Function, HashMap, HashSet, Match, Number, Option, Order, Predicate, Record, Schema, Stream, String, SubscriptionRef, pipe, } from 'effect';
|
|
4
4
|
import { KeyValueStore } from 'effect/persistence';
|
|
5
5
|
import { Update } from 'foldkit';
|
|
6
6
|
import * as Command from 'foldkit/command';
|
|
7
7
|
import { DEVTOOLS_HOST_ID, GOT_MESSAGE_PATTERN, INIT_INDEX, extractSubmodelInfo, isTagged, latestEntryIndex, toInspectableValue, } from 'foldkit/devtools-host';
|
|
8
|
+
import * as Dom from 'foldkit/dom';
|
|
8
9
|
import { lockScroll, unlockScroll } from 'foldkit/dom';
|
|
9
10
|
import { createKeyedLazy, createLazy, } from 'foldkit/html';
|
|
10
11
|
import { defineMessageUnion } from 'foldkit/message';
|
|
@@ -131,7 +132,7 @@ const Message = defineMessageUnion({
|
|
|
131
132
|
CompletedLockScroll: {},
|
|
132
133
|
CompletedUnlockScroll: {},
|
|
133
134
|
CompletedScrollToTop: {},
|
|
134
|
-
|
|
135
|
+
ObservedMobileBreakpoint: { isMobile: Schema.Boolean },
|
|
135
136
|
ReceivedInspectedState: {
|
|
136
137
|
model: Schema.Unknown,
|
|
137
138
|
maybeMessage: Schema.Option(Schema.Unknown),
|
|
@@ -459,10 +460,15 @@ const makeUpdate = (store, shadow, mode) => {
|
|
|
459
460
|
model: modifyFields(model, { isFlattened: () => __foldkitBrandViewResult((isFlattened), "@foldkit/devtools/overlay.js#isFlattened") }),
|
|
460
461
|
commands: [PersistDevToolsState({ isOpen: model.isOpen, isFlattened })],
|
|
461
462
|
}), "@foldkit/devtools/overlay.js#ToggledFlatten")),
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
463
|
+
ObservedMobileBreakpoint: ({ isMobile }) => {
|
|
464
|
+
if (isMobile === model.isMobile) {
|
|
465
|
+
return __foldkitBrandViewResult(({ model }), "@foldkit/devtools/overlay.js#ObservedMobileBreakpoint");
|
|
466
|
+
}
|
|
467
|
+
return __foldkitBrandViewResult(({
|
|
468
|
+
model: modifyFields(model, { isMobile: () => __foldkitBrandViewResult((isMobile), "@foldkit/devtools/overlay.js#isMobile") }),
|
|
469
|
+
commands: Option.toArray(maybeToggleScrollLock(model.isOpen, isMobile)),
|
|
470
|
+
}), "@foldkit/devtools/overlay.js#ObservedMobileBreakpoint");
|
|
471
|
+
},
|
|
466
472
|
ClickedRow: ({ index }) => __foldkitBrandViewResult((Match.value(mode).pipe(Match.withReturnType(), Match.when('TimeTravel', () => (__foldkitBrandViewResult(({
|
|
467
473
|
model,
|
|
468
474
|
commands: [jumpToAndInspect(index)],
|
|
@@ -642,15 +648,11 @@ const makeOverlaySubscriptions = (store, shadow) => {
|
|
|
642
648
|
isActive: model => __foldkitBrandViewResult((Option.isSome(model.maybePendingScrubIndex)), "@foldkit/devtools/overlay.js#isActive"),
|
|
643
649
|
toMessage: () => __foldkitBrandViewResult((Message.TickedScrubFrame()), "@foldkit/devtools/overlay.js#toMessage"),
|
|
644
650
|
}),
|
|
645
|
-
storeUpdates: Subscription.persistent(
|
|
646
|
-
mobileBreakpoint: Subscription.persistent(
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
};
|
|
651
|
-
mediaQuery.addEventListener('change', handler);
|
|
652
|
-
return __foldkitBrandViewResult(({ mediaQuery, handler }), "@foldkit/devtools/overlay.js#anonymous~49");
|
|
653
|
-
}), ({ mediaQuery, handler }) => __foldkitBrandViewResult((Effect.sync(() => __foldkitBrandViewResult((mediaQuery.removeEventListener('change', handler)), "@foldkit/devtools/overlay.js#anonymous~51"))), "@foldkit/devtools/overlay.js#anonymous~50")).pipe(Effect.flatMap(() => __foldkitBrandViewResult((Effect.never), "@foldkit/devtools/overlay.js#anonymous~52")))), "@foldkit/devtools/overlay.js#anonymous~48"))),
|
|
651
|
+
storeUpdates: Subscription.persistent(SubscriptionRef.changes(store.stateRef).pipe(Stream.map(state => __foldkitBrandViewResult((Message.ReceivedStoreUpdate(toDisplayState(state))), "@foldkit/devtools/overlay.js#anonymous~46")))),
|
|
652
|
+
mobileBreakpoint: Subscription.persistent(Dom.streamFromMediaQuery({
|
|
653
|
+
query: MOBILE_BREAKPOINT_QUERY,
|
|
654
|
+
mapMatches: isMobile => __foldkitBrandViewResult((Message.ObservedMobileBreakpoint({ isMobile })), "@foldkit/devtools/overlay.js#mapMatches"),
|
|
655
|
+
})),
|
|
654
656
|
}), "@foldkit/devtools/overlay.js#anonymous~45")));
|
|
655
657
|
return __foldkitBrandViewResult((Subscription.aggregate(ownSubscriptions, scrubberSubscriptions)), "@foldkit/devtools/overlay.js#makeOverlaySubscriptions");
|
|
656
658
|
};
|
|
@@ -685,7 +687,7 @@ const makeView = (position, mode, shadow, maybeBanner) => {
|
|
|
685
687
|
let viewWithBuilder;
|
|
686
688
|
return __foldkitBrandViewResult(((model, h) => {
|
|
687
689
|
viewWithBuilder ??= buildOverlayView(position, mode, shadow, maybeBanner, h);
|
|
688
|
-
return __foldkitBrandViewResult((viewWithBuilder(model)), "@foldkit/devtools/overlay.js#anonymous~
|
|
690
|
+
return __foldkitBrandViewResult((viewWithBuilder(model)), "@foldkit/devtools/overlay.js#anonymous~47");
|
|
689
691
|
}), "@foldkit/devtools/overlay.js#makeView");
|
|
690
692
|
};
|
|
691
693
|
const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
@@ -695,7 +697,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
695
697
|
const lazyMessageList = createLazy();
|
|
696
698
|
// JSON TREE
|
|
697
699
|
const leafSpan = (className, text) => __foldkitBrandViewResult((h.span([h.Class(className)], [text])), "@foldkit/devtools/overlay.js#leafSpan");
|
|
698
|
-
const leafValueView = (value) => __foldkitBrandViewResult((Match.value(value).pipe(Match.when(Predicate.isNull, () => __foldkitBrandViewResult((leafSpan('json-null italic', 'null')), "@foldkit/devtools/overlay.js#anonymous~
|
|
700
|
+
const leafValueView = (value) => __foldkitBrandViewResult((Match.value(value).pipe(Match.when(Predicate.isNull, () => __foldkitBrandViewResult((leafSpan('json-null italic', 'null')), "@foldkit/devtools/overlay.js#anonymous~48")), Match.when(Predicate.isUndefined, () => __foldkitBrandViewResult((leafSpan('json-null italic', 'undefined')), "@foldkit/devtools/overlay.js#anonymous~49")), Match.when(Predicate.isString, stringValue => __foldkitBrandViewResult((leafSpan('json-string', `"${stringValue}"`)), "@foldkit/devtools/overlay.js#anonymous~50")), Match.when(Predicate.isNumber, numberValue => __foldkitBrandViewResult((leafSpan('json-number', globalThis.String(numberValue))), "@foldkit/devtools/overlay.js#anonymous~51")), Match.when(Predicate.isBoolean, booleanValue => __foldkitBrandViewResult((leafSpan('json-boolean', globalThis.String(booleanValue))), "@foldkit/devtools/overlay.js#anonymous~52")), Match.orElse(unknownValue => __foldkitBrandViewResult((leafSpan('json-null', globalThis.String(unknownValue))), "@foldkit/devtools/overlay.js#anonymous~53")))), "@foldkit/devtools/overlay.js#leafValueView");
|
|
699
701
|
const keyView = (key) => __foldkitBrandViewResult((h.span([h.Class('json-key')], [`${key}:\u00a0`])), "@foldkit/devtools/overlay.js#keyView");
|
|
700
702
|
const CHEVRON_RIGHT = 'M8.25 4.5l7.5 7.5-7.5 7.5';
|
|
701
703
|
const CHEVRON_DOWN = 'M19.5 8.25l-7.5 7.5-7.5-7.5';
|
|
@@ -719,8 +721,8 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
719
721
|
const tagLabelView = (tag) => __foldkitBrandViewResult((h.span([h.Class('json-tag')], [tag])), "@foldkit/devtools/overlay.js#tagLabelView");
|
|
720
722
|
const copyPayloadButtonView = (payload, targetId, copyStates, subject) => {
|
|
721
723
|
const maybeCopyState = HashMap.get(copyStates, targetId);
|
|
722
|
-
const isCopying = Option.exists(maybeCopyState, state => __foldkitBrandViewResult((state._tag === 'Copying'), "@foldkit/devtools/overlay.js#anonymous~
|
|
723
|
-
const isCopied = Option.exists(maybeCopyState, state => __foldkitBrandViewResult((state._tag === 'Copied'), "@foldkit/devtools/overlay.js#anonymous~
|
|
724
|
+
const isCopying = Option.exists(maybeCopyState, state => __foldkitBrandViewResult((state._tag === 'Copying'), "@foldkit/devtools/overlay.js#anonymous~54"));
|
|
725
|
+
const isCopied = Option.exists(maybeCopyState, state => __foldkitBrandViewResult((state._tag === 'Copied'), "@foldkit/devtools/overlay.js#anonymous~55"));
|
|
724
726
|
const ariaLabel = Option.match(maybeCopyState, {
|
|
725
727
|
onNone: () => __foldkitBrandViewResult((`Copy ${subject} as JSON`), "@foldkit/devtools/overlay.js#onNone~3"),
|
|
726
728
|
onSome: CopyState.match({
|
|
@@ -806,16 +808,16 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
806
808
|
treePath: `${treePath}.${arrayIndex}`,
|
|
807
809
|
depth: childDepth,
|
|
808
810
|
key: globalThis.String(arrayIndex),
|
|
809
|
-
})), "@foldkit/devtools/overlay.js#anonymous~
|
|
811
|
+
})), "@foldkit/devtools/overlay.js#anonymous~56"));
|
|
810
812
|
}
|
|
811
813
|
else if (Predicate.isObject(value)) {
|
|
812
|
-
pipe(value, Record.toEntries, Array.filter(([entryKey]) => __foldkitBrandViewResult((entryKey !== '_tag'), "@foldkit/devtools/overlay.js#anonymous~
|
|
814
|
+
pipe(value, Record.toEntries, Array.filter(([entryKey]) => __foldkitBrandViewResult((entryKey !== '_tag'), "@foldkit/devtools/overlay.js#anonymous~57")), Array.forEach(([entryKey, childValue]) => __foldkitBrandViewResult((flattenTree({
|
|
813
815
|
...shared,
|
|
814
816
|
value: childValue,
|
|
815
817
|
treePath: `${treePath}.${entryKey}`,
|
|
816
818
|
depth: childDepth,
|
|
817
819
|
key: entryKey,
|
|
818
|
-
})), "@foldkit/devtools/overlay.js#anonymous~
|
|
820
|
+
})), "@foldkit/devtools/overlay.js#anonymous~58")));
|
|
819
821
|
}
|
|
820
822
|
};
|
|
821
823
|
const flatNodeView = (value, treePath, depth, key, nodeIsExpandable, isExpanded, isChanged, isAffected, isRoot, tag) => {
|
|
@@ -835,7 +837,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
835
837
|
'diff-changed': isChanged,
|
|
836
838
|
})),
|
|
837
839
|
indent,
|
|
838
|
-
], rowSegments.map(segment => __foldkitBrandViewResult((h.keyed('li')(segment._tag, [h.Class('contents')], [rowSegmentView(segment)])), "@foldkit/devtools/overlay.js#anonymous~
|
|
840
|
+
], rowSegments.map(segment => __foldkitBrandViewResult((h.keyed('li')(segment._tag, [h.Class('contents')], [rowSegmentView(segment)])), "@foldkit/devtools/overlay.js#anonymous~59")))), "@foldkit/devtools/overlay.js#flatNodeView");
|
|
839
841
|
}
|
|
840
842
|
const preview = isExpanded
|
|
841
843
|
? globalThis.Array.isArray(value)
|
|
@@ -859,7 +861,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
859
861
|
...(isRoot
|
|
860
862
|
? []
|
|
861
863
|
: [h.OnClick(Message.ToggledTreeNode({ path: treePath }))]),
|
|
862
|
-
], rowSegments.map(segment => __foldkitBrandViewResult((h.keyed('li')(segment._tag, [h.Class('contents')], [rowSegmentView(segment)])), "@foldkit/devtools/overlay.js#anonymous~
|
|
864
|
+
], rowSegments.map(segment => __foldkitBrandViewResult((h.keyed('li')(segment._tag, [h.Class('contents')], [rowSegmentView(segment)])), "@foldkit/devtools/overlay.js#anonymous~60")))), "@foldkit/devtools/overlay.js#flatNodeView");
|
|
863
865
|
};
|
|
864
866
|
const renderFlatNode = (node) => __foldkitBrandViewResult((lazyTreeNode(node.treePath, flatNodeView, [
|
|
865
867
|
node.value,
|
|
@@ -883,7 +885,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
883
885
|
changedPaths,
|
|
884
886
|
affectedPaths,
|
|
885
887
|
depth: 0,
|
|
886
|
-
key: Option.getOrElse(maybeRootLabel, () => __foldkitBrandViewResult((''), "@foldkit/devtools/overlay.js#anonymous~
|
|
888
|
+
key: Option.getOrElse(maybeRootLabel, () => __foldkitBrandViewResult((''), "@foldkit/devtools/overlay.js#anonymous~61")),
|
|
887
889
|
accumulator: nodes,
|
|
888
890
|
indentRootChildren,
|
|
889
891
|
});
|
|
@@ -906,8 +908,8 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
906
908
|
const remainingMs = delta % MILLIS_PER_SECOND;
|
|
907
909
|
return __foldkitBrandViewResult((seconds > 0
|
|
908
910
|
? `+${seconds}s ${remainingMs.toFixed(1)}ms`
|
|
909
|
-
: `+${remainingMs.toFixed(1)}ms`), "@foldkit/devtools/overlay.js#anonymous~
|
|
910
|
-
}), Option.getOrElse(() => __foldkitBrandViewResult((''), "@foldkit/devtools/overlay.js#anonymous~
|
|
911
|
+
: `+${remainingMs.toFixed(1)}ms`), "@foldkit/devtools/overlay.js#anonymous~62");
|
|
912
|
+
}), Option.getOrElse(() => __foldkitBrandViewResult((''), "@foldkit/devtools/overlay.js#anonymous~63")))), "@foldkit/devtools/overlay.js#inspectedTimestamp");
|
|
911
913
|
};
|
|
912
914
|
const emptyInspectorView = h.div([
|
|
913
915
|
h.Class('flex-1 flex items-center justify-center text-dt-muted text-2xs font-mono min-w-0'),
|
|
@@ -970,7 +972,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
970
972
|
h.Class('flex items-center justify-between px-2 py-1 border-b text-2xs text-dt-muted font-mono shrink-0'),
|
|
971
973
|
], [
|
|
972
974
|
h.span([], [timestamp]),
|
|
973
|
-
copyPayloadButtonView(message, `Message:${selectedIndex}:${isFlattened}:${Option.getOrElse(maybeSubmodelFilter, () => __foldkitBrandViewResult(('All'), "@foldkit/devtools/overlay.js#anonymous~
|
|
975
|
+
copyPayloadButtonView(message, `Message:${selectedIndex}:${isFlattened}:${Option.getOrElse(maybeSubmodelFilter, () => __foldkitBrandViewResult(('All'), "@foldkit/devtools/overlay.js#anonymous~64"))}`, copyStates, 'Message payload'),
|
|
974
976
|
]),
|
|
975
977
|
h.div([h.Class('flex flex-col flex-1 min-h-0 min-w-0 pt-1 pl-1')], [
|
|
976
978
|
treeView(message, 'root', expandedPaths, HashSet.empty(), HashSet.empty(), Option.none(), false),
|
|
@@ -983,7 +985,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
983
985
|
onEmpty: () => __foldkitBrandViewResult((INIT_INDEX), "@foldkit/devtools/overlay.js#onEmpty~4"),
|
|
984
986
|
onNonEmpty: () => __foldkitBrandViewResult((model.startIndex + model.entries.length - 1), "@foldkit/devtools/overlay.js#onNonEmpty~4"),
|
|
985
987
|
});
|
|
986
|
-
return __foldkitBrandViewResult((Match.value(mode).pipe(Match.when('TimeTravel', () => __foldkitBrandViewResult((model.isPaused ? model.pausedAtIndex : lastIndex), "@foldkit/devtools/overlay.js#anonymous~
|
|
988
|
+
return __foldkitBrandViewResult((Match.value(mode).pipe(Match.when('TimeTravel', () => __foldkitBrandViewResult((model.isPaused ? model.pausedAtIndex : lastIndex), "@foldkit/devtools/overlay.js#anonymous~65")), Match.when('Inspect', () => __foldkitBrandViewResult((model.selectedIndex), "@foldkit/devtools/overlay.js#anonymous~66")), Match.exhaustive)), "@foldkit/devtools/overlay.js#selectedHistoryIndex");
|
|
987
989
|
};
|
|
988
990
|
const selectedCommands = (model) => {
|
|
989
991
|
const selectedIndex = selectedHistoryIndex(model);
|
|
@@ -991,7 +993,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
991
993
|
return __foldkitBrandViewResult((model.initCommands), "@foldkit/devtools/overlay.js#selectedCommands");
|
|
992
994
|
}
|
|
993
995
|
else {
|
|
994
|
-
return __foldkitBrandViewResult((pipe(model.entries, Array.get(selectedIndex - model.startIndex), Option.map(entry => __foldkitBrandViewResult((entry.commands), "@foldkit/devtools/overlay.js#anonymous~
|
|
996
|
+
return __foldkitBrandViewResult((pipe(model.entries, Array.get(selectedIndex - model.startIndex), Option.map(entry => __foldkitBrandViewResult((entry.commands), "@foldkit/devtools/overlay.js#anonymous~67")), Option.getOrElse(() => __foldkitBrandViewResult((NO_COMMANDS), "@foldkit/devtools/overlay.js#anonymous~68")))), "@foldkit/devtools/overlay.js#selectedCommands");
|
|
995
997
|
}
|
|
996
998
|
};
|
|
997
999
|
const flattenCommand = (command, index, expandedPaths) => {
|
|
@@ -1040,7 +1042,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1040
1042
|
...Array.map(flattenCommand(command, index, expandedPaths), renderFlatNode),
|
|
1041
1043
|
]),
|
|
1042
1044
|
copyPayloadButtonView(taggedPayload(command.name, command.args), `Command:${selectedIndex}:${index}`, copyStates, `Command ${index + 1} (${command.name}) payload`),
|
|
1043
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1045
|
+
])), "@foldkit/devtools/overlay.js#anonymous~69")))), "@foldkit/devtools/overlay.js#onNonEmpty~5"),
|
|
1044
1046
|
})), "@foldkit/devtools/overlay.js#commandsTabContent");
|
|
1045
1047
|
const selectedMountActivity = (model) => {
|
|
1046
1048
|
const selectedIndex = selectedHistoryIndex(model);
|
|
@@ -1083,7 +1085,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1083
1085
|
h.span([h.Class(indexClass)], [globalThis.String(index + 1)]),
|
|
1084
1086
|
h.div([h.Class('flex flex-col flex-1 min-w-0')], Array.map(flattenMount(mount, label, index, expandedPaths), renderFlatNode)),
|
|
1085
1087
|
copyPayloadButtonView(taggedPayload(mount.name, mount.args), `Mount:${selectedIndex}:${label}:${index}`, copyStates, `${label} Mount ${index + 1} (${mount.name}) payload`),
|
|
1086
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1088
|
+
])), "@foldkit/devtools/overlay.js#anonymous~70")),
|
|
1087
1089
|
])), "@foldkit/devtools/overlay.js#mountListSection");
|
|
1088
1090
|
const mountsTabContent = (starts, ends, expandedPaths, selectedIndex, copyStates) => {
|
|
1089
1091
|
const hasAny = Array.isReadonlyArrayNonEmpty(starts) ||
|
|
@@ -1117,7 +1119,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1117
1119
|
model.affectedPaths,
|
|
1118
1120
|
selectedIndex,
|
|
1119
1121
|
model.copyStates,
|
|
1120
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1122
|
+
])), "@foldkit/devtools/overlay.js#anonymous~71")), Match.when('Message', () => __foldkitBrandViewResult((lazyTabContent('Message', messageTabContent, [
|
|
1121
1123
|
model.maybeInspectedMessage,
|
|
1122
1124
|
model.maybeSubmodelFilter,
|
|
1123
1125
|
model.isFlattened,
|
|
@@ -1125,12 +1127,12 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1125
1127
|
inspectedTimestamp(model),
|
|
1126
1128
|
selectedIndex,
|
|
1127
1129
|
model.copyStates,
|
|
1128
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1130
|
+
])), "@foldkit/devtools/overlay.js#anonymous~72")), Match.when('Commands', () => __foldkitBrandViewResult((lazyTabContent('Commands', commandsTabContent, [
|
|
1129
1131
|
selectedCommands(model),
|
|
1130
1132
|
model.expandedPaths,
|
|
1131
1133
|
selectedIndex,
|
|
1132
1134
|
model.copyStates,
|
|
1133
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1135
|
+
])), "@foldkit/devtools/overlay.js#anonymous~73")), Match.when('Mounts', () => {
|
|
1134
1136
|
const { starts, ends } = selectedMountActivity(model);
|
|
1135
1137
|
return __foldkitBrandViewResult((lazyTabContent('Mounts', mountsTabContent, [
|
|
1136
1138
|
starts,
|
|
@@ -1138,7 +1140,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1138
1140
|
model.expandedPaths,
|
|
1139
1141
|
selectedIndex,
|
|
1140
1142
|
model.copyStates,
|
|
1141
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1143
|
+
])), "@foldkit/devtools/overlay.js#anonymous~74");
|
|
1142
1144
|
}), Match.exhaustive)), "@foldkit/devtools/overlay.js#inspectorTabContent");
|
|
1143
1145
|
};
|
|
1144
1146
|
const inspectorPaneView = (model) => __foldkitBrandViewResult((h.div([
|
|
@@ -1159,7 +1161,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1159
1161
|
h.Class(clsx('dt-tab-button cursor-pointer text-base font-mono px-3 py-1', tab.isActive
|
|
1160
1162
|
? 'text-dt dt-tab-active'
|
|
1161
1163
|
: 'text-dt-muted')),
|
|
1162
|
-
], [h.span([], [tab.value])])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1164
|
+
], [h.span([], [tab.value])])), "@foldkit/devtools/overlay.js#anonymous~75"))),
|
|
1163
1165
|
...tabs.map(tab => __foldkitBrandViewResult((h.div([
|
|
1164
1166
|
...tab.panel,
|
|
1165
1167
|
h.Class('flex flex-col flex-1 min-h-0 min-w-0'),
|
|
@@ -1172,7 +1174,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1172
1174
|
onNone: () => __foldkitBrandViewResult((emptyInspectorView), "@foldkit/devtools/overlay.js#onNone~7"),
|
|
1173
1175
|
onSome: inspectedModel => __foldkitBrandViewResult((inspectorTabContent(model, tab.value, inspectedModel)), "@foldkit/devtools/overlay.js#onSome~7"),
|
|
1174
1176
|
}),
|
|
1175
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1177
|
+
])), "@foldkit/devtools/overlay.js#anonymous~76")),
|
|
1176
1178
|
])), "@foldkit/devtools/overlay.js#toView"),
|
|
1177
1179
|
},
|
|
1178
1180
|
toParentMessage: message => __foldkitBrandViewResult((Message.GotInspectorTabsMessage({ message })), "@foldkit/devtools/overlay.js#toParentMessage~5"),
|
|
@@ -1256,7 +1258,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1256
1258
|
view: SubmodelFilterListbox.view,
|
|
1257
1259
|
viewInputs: {
|
|
1258
1260
|
items: [ALL_MESSAGES_VALUE, ...model.submodelTags],
|
|
1259
|
-
maybeSelectedValue: Option.orElseSome(model.maybeSubmodelFilter, () => __foldkitBrandViewResult((ALL_MESSAGES_VALUE), "@foldkit/devtools/overlay.js#anonymous~
|
|
1261
|
+
maybeSelectedValue: Option.orElseSome(model.maybeSubmodelFilter, () => __foldkitBrandViewResult((ALL_MESSAGES_VALUE), "@foldkit/devtools/overlay.js#anonymous~77")),
|
|
1260
1262
|
itemToConfig: item => (__foldkitBrandViewResult(({
|
|
1261
1263
|
className: 'dt-filter-item',
|
|
1262
1264
|
content: h.div([h.Class('flex items-center gap-2')], [checkIconView, h.span([], [filterItemLabel(item)])]),
|
|
@@ -1326,7 +1328,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1326
1328
|
: {
|
|
1327
1329
|
status: h.span([h.Class(`${statusClass} text-dt-live font-medium`)], ['Live']),
|
|
1328
1330
|
maybeAction: Option.none(),
|
|
1329
|
-
}), "@foldkit/devtools/overlay.js#anonymous~
|
|
1331
|
+
}), "@foldkit/devtools/overlay.js#anonymous~78")), Match.when('Inspect', () => (__foldkitBrandViewResult(({
|
|
1330
1332
|
status: h.span([h.Class(`${statusClass} text-dt-accent`)], [
|
|
1331
1333
|
model.selectedIndex === INIT_INDEX
|
|
1332
1334
|
? 'Inspecting (init)'
|
|
@@ -1336,7 +1338,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1336
1338
|
h.Class(actionButtonClass),
|
|
1337
1339
|
h.OnClick(Message.ClickedFollowLatest()),
|
|
1338
1340
|
], ['Follow Latest →'])),
|
|
1339
|
-
}), "@foldkit/devtools/overlay.js#anonymous~
|
|
1341
|
+
}), "@foldkit/devtools/overlay.js#anonymous~79"))), Match.exhaustive);
|
|
1340
1342
|
const maybeClearHistoryButton = OptionExt.when(!model.isPaused, clearHistoryButton());
|
|
1341
1343
|
return __foldkitBrandViewResult((h.header([h.Class(headerClass)], [
|
|
1342
1344
|
status,
|
|
@@ -1387,7 +1389,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1387
1389
|
}));
|
|
1388
1390
|
const isInitSelected = selectedIndex === INIT_INDEX;
|
|
1389
1391
|
const isFiltered = Option.isSome(maybeFilterTag);
|
|
1390
|
-
const leafOrTag = (entry) => __foldkitBrandViewResult((Option.getOrElse(entry.maybeLeafTag, () => __foldkitBrandViewResult((entry.tag), "@foldkit/devtools/overlay.js#anonymous~
|
|
1392
|
+
const leafOrTag = (entry) => __foldkitBrandViewResult((Option.getOrElse(entry.maybeLeafTag, () => __foldkitBrandViewResult((entry.tag), "@foldkit/devtools/overlay.js#anonymous~80"))), "@foldkit/devtools/overlay.js#leafOrTag");
|
|
1391
1393
|
const displayTagFor = (entry) => {
|
|
1392
1394
|
if (isFlattened) {
|
|
1393
1395
|
return __foldkitBrandViewResult((leafOrTag(entry)), "@foldkit/devtools/overlay.js#displayTagFor");
|
|
@@ -1395,15 +1397,15 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1395
1397
|
else {
|
|
1396
1398
|
return __foldkitBrandViewResult((Option.match(maybeFilterTag, {
|
|
1397
1399
|
onNone: () => __foldkitBrandViewResult((entry.tag), "@foldkit/devtools/overlay.js#onNone~10"),
|
|
1398
|
-
onSome: filterTag => __foldkitBrandViewResult((pipe(entry.submodelPath, Array.findFirstIndex(pathTag => __foldkitBrandViewResult((pathTag === filterTag), "@foldkit/devtools/overlay.js#anonymous~
|
|
1400
|
+
onSome: filterTag => __foldkitBrandViewResult((pipe(entry.submodelPath, Array.findFirstIndex(pathTag => __foldkitBrandViewResult((pathTag === filterTag), "@foldkit/devtools/overlay.js#anonymous~81")), Option.flatMap(filterIndex => __foldkitBrandViewResult((Array.get(entry.submodelPath, Number.increment(filterIndex))), "@foldkit/devtools/overlay.js#anonymous~82")), Option.orElse(() => __foldkitBrandViewResult((entry.maybeLeafTag), "@foldkit/devtools/overlay.js#anonymous~83")), Option.getOrElse(() => __foldkitBrandViewResult((entry.tag), "@foldkit/devtools/overlay.js#anonymous~84")))), "@foldkit/devtools/overlay.js#onSome~9"),
|
|
1399
1401
|
})), "@foldkit/devtools/overlay.js#displayTagFor");
|
|
1400
1402
|
}
|
|
1401
1403
|
};
|
|
1402
1404
|
const indexedEntries = pipe(entries, Array.map((entry, arrayIndex) => (__foldkitBrandViewResult(({
|
|
1403
1405
|
entry,
|
|
1404
1406
|
absoluteIndex: startIndex + arrayIndex,
|
|
1405
|
-
}), "@foldkit/devtools/overlay.js#anonymous~
|
|
1406
|
-
? Array.filter(({ entry }) => __foldkitBrandViewResult((Array.contains(entry.submodelPath, maybeFilterTag.value)), "@foldkit/devtools/overlay.js#anonymous~
|
|
1407
|
+
}), "@foldkit/devtools/overlay.js#anonymous~85"))), isFiltered
|
|
1408
|
+
? Array.filter(({ entry }) => __foldkitBrandViewResult((Array.contains(entry.submodelPath, maybeFilterTag.value)), "@foldkit/devtools/overlay.js#anonymous~86"))
|
|
1407
1409
|
: Function.identity);
|
|
1408
1410
|
const messageRows = pipe(indexedEntries, Array.map(({ entry, absoluteIndex }) => {
|
|
1409
1411
|
const isSelected = selectedIndex === absoluteIndex;
|
|
@@ -1416,11 +1418,11 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1416
1418
|
isPausedHere,
|
|
1417
1419
|
entry.timestamp - baseTimestamp,
|
|
1418
1420
|
entry.isModelChanged,
|
|
1419
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1421
|
+
])), "@foldkit/devtools/overlay.js#anonymous~87");
|
|
1420
1422
|
}), Array.reverse);
|
|
1421
1423
|
return __foldkitBrandViewResult((h.ul([
|
|
1422
1424
|
h.Class('message-list flex-1 overflow-y-auto min-h-0 overscroll-none'),
|
|
1423
|
-
h.OnScroll(scrollTop => __foldkitBrandViewResult((Message.ScrolledMessageList({ scrollTop })), "@foldkit/devtools/overlay.js#anonymous~
|
|
1425
|
+
h.OnScroll(scrollTop => __foldkitBrandViewResult((Message.ScrolledMessageList({ scrollTop })), "@foldkit/devtools/overlay.js#anonymous~88")),
|
|
1424
1426
|
], isFiltered
|
|
1425
1427
|
? messageRows
|
|
1426
1428
|
: [
|
|
@@ -1548,13 +1550,13 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1548
1550
|
inspectorPaneView(model),
|
|
1549
1551
|
])), "@foldkit/devtools/overlay.js#messagesScreenView");
|
|
1550
1552
|
};
|
|
1551
|
-
const contentView = (model) => __foldkitBrandViewResult((Match.value(model.screen).pipe(Match.withReturnType(), Match.when('Messages', () => __foldkitBrandViewResult((messagesScreenView(model)), "@foldkit/devtools/overlay.js#anonymous~
|
|
1553
|
+
const contentView = (model) => __foldkitBrandViewResult((Match.value(model.screen).pipe(Match.withReturnType(), Match.when('Messages', () => __foldkitBrandViewResult((messagesScreenView(model)), "@foldkit/devtools/overlay.js#anonymous~89")), Match.when('Settings', () => __foldkitBrandViewResult((settingsScreenView(model)), "@foldkit/devtools/overlay.js#anonymous~90")), Match.exhaustive)), "@foldkit/devtools/overlay.js#contentView");
|
|
1552
1554
|
const panelView = (model) => __foldkitBrandViewResult((h.div([
|
|
1553
1555
|
h.Class(clsx('fixed dt-panel dt-panel-wide bg-dt-bg border rounded-lg flex flex-col overflow-hidden font-mono text-dt', PANEL_POSITION_CLASS[position])),
|
|
1554
1556
|
], [
|
|
1555
1557
|
...Option.map(maybeBanner, banner => __foldkitBrandViewResult((h.div([
|
|
1556
1558
|
h.Class('px-3 py-2 border-b text-sm text-dt-muted font-mono shrink-0 leading-snug'),
|
|
1557
|
-
], [banner])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1559
|
+
], [banner])), "@foldkit/devtools/overlay.js#anonymous~91")).pipe(Option.toArray),
|
|
1558
1560
|
headerView(model),
|
|
1559
1561
|
contentView(model),
|
|
1560
1562
|
footerView(model),
|
|
@@ -1564,7 +1566,7 @@ const buildOverlayView = (position, mode, shadow, maybeBanner, h) => {
|
|
|
1564
1566
|
...OptionExt.when(model.isPaused && mode === 'TimeTravel', interactionBlocker()).pipe(Option.toArray),
|
|
1565
1567
|
...OptionExt.when(model.isOpen, panelView(model)).pipe(Option.toArray),
|
|
1566
1568
|
badgeView(model),
|
|
1567
|
-
])), "@foldkit/devtools/overlay.js#anonymous~
|
|
1569
|
+
])), "@foldkit/devtools/overlay.js#anonymous~92")), "@foldkit/devtools/overlay.js#buildOverlayView");
|
|
1568
1570
|
};
|
|
1569
1571
|
// CREATE
|
|
1570
1572
|
const VIEW_TRANSITION_NAME = 'foldkit-devtools';
|
|
@@ -1645,10 +1647,10 @@ const createShadowContainer = () => {
|
|
|
1645
1647
|
return __foldkitBrandViewResult(({ container, shadow }), "@foldkit/devtools/overlay.js#createShadowContainer");
|
|
1646
1648
|
};
|
|
1647
1649
|
export const createOverlay = (store, position, mode, maybeBanner) => __foldkitBrandViewResult((Effect.gen(function* () {
|
|
1648
|
-
const { container, shadow } = yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((createShadowContainer()), "@foldkit/devtools/overlay.js#anonymous~
|
|
1650
|
+
const { container, shadow } = yield* Effect.acquireRelease(Effect.sync(() => __foldkitBrandViewResult((createShadowContainer()), "@foldkit/devtools/overlay.js#anonymous~95")), createdShadowContainer => __foldkitBrandViewResult((Effect.sync(() => {
|
|
1649
1651
|
createdShadowContainer.shadow.host.remove();
|
|
1650
1652
|
document.getElementById(VIEW_TRANSITION_STYLE_ID)?.remove();
|
|
1651
|
-
})), "@foldkit/devtools/overlay.js#anonymous~
|
|
1653
|
+
})), "@foldkit/devtools/overlay.js#anonymous~96"));
|
|
1652
1654
|
container.id = '__foldkit_devtools_overlay__';
|
|
1653
1655
|
const flags = Effect.gen(function* () {
|
|
1654
1656
|
const storeState = yield* SubscriptionRef.get(store.stateRef);
|
|
@@ -1658,7 +1660,7 @@ export const createOverlay = (store, position, mode, maybeBanner) => __foldkitBr
|
|
|
1658
1660
|
isMobile: window.matchMedia(MOBILE_BREAKPOINT_QUERY).matches,
|
|
1659
1661
|
isFlattened,
|
|
1660
1662
|
...toDisplayState(storeState),
|
|
1661
|
-
}), "@foldkit/devtools/overlay.js#anonymous~
|
|
1663
|
+
}), "@foldkit/devtools/overlay.js#anonymous~98");
|
|
1662
1664
|
});
|
|
1663
1665
|
const init = (flags) => {
|
|
1664
1666
|
const { isFlattened, ...displayFlags } = flags;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@foldkit/devtools",
|
|
3
|
-
"version": "0.166.0-canary.
|
|
3
|
+
"version": "0.166.0-canary.3b49f516b024",
|
|
4
4
|
"description": "In-browser DevTools overlay for Foldkit applications",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"exports": {
|
|
@@ -15,23 +15,23 @@
|
|
|
15
15
|
],
|
|
16
16
|
"peerDependencies": {
|
|
17
17
|
"@effect/platform-browser": "4.0.0",
|
|
18
|
-
"@foldkit/ui": "0.166.0-canary.
|
|
18
|
+
"@foldkit/ui": "0.166.0-canary.3b49f516b024",
|
|
19
19
|
"effect": "4.0.0",
|
|
20
|
-
"foldkit": "0.166.0-canary.
|
|
20
|
+
"foldkit": "0.166.0-canary.3b49f516b024"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"clsx": "^2.1.1"
|
|
24
24
|
},
|
|
25
25
|
"devDependencies": {
|
|
26
26
|
"@effect/platform-browser": "4.0.0",
|
|
27
|
+
"@foldkit/ui": "0.166.0-canary.3b49f516b024",
|
|
28
|
+
"@foldkit/vite-plugin": "0.26.1-canary.3b49f516b024",
|
|
27
29
|
"effect": "4.0.0",
|
|
30
|
+
"foldkit": "0.166.0-canary.3b49f516b024",
|
|
28
31
|
"happy-dom": "^20.14.5",
|
|
29
32
|
"rimraf": "^6.1.3",
|
|
30
33
|
"typescript": "^7.0.2",
|
|
31
|
-
"vitest": "^4.1.11"
|
|
32
|
-
"@foldkit/vite-plugin": "0.26.1-canary.085b787da0a5",
|
|
33
|
-
"foldkit": "0.166.0-canary.085b787da0a5",
|
|
34
|
-
"@foldkit/ui": "0.166.0-canary.085b787da0a5"
|
|
34
|
+
"vitest": "^4.1.11"
|
|
35
35
|
},
|
|
36
36
|
"keywords": [
|
|
37
37
|
"foldkit",
|