@likec4/diagram 1.57.0 → 1.59.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/LikeC4Diagram.js +1 -1
- package/dist/LikeC4Diagram.props.d.ts +1 -1
- package/dist/LikeC4Styles.js +1 -1
- package/dist/LikeC4View.js +2 -2
- package/dist/ReactLikeC4.d.ts +1 -1
- package/dist/base/Base.d.ts +3 -2
- package/dist/base/Base.js +14 -26
- package/dist/base/BaseXYFlow.d.ts +2 -1
- package/dist/base/BaseXYFlow.js +63 -4
- package/dist/base/keyboardZoom.d.ts +3 -0
- package/dist/base/keyboardZoom.js +20 -0
- package/dist/base/updateEdges.js +7 -16
- package/dist/base/updateNodes.js +3 -9
- package/dist/base-primitives/Markdown.d.ts +1 -1
- package/dist/base-primitives/NodeHandles.d.ts +1 -1
- package/dist/base-primitives/compound/CompoundActionButton.d.ts +2 -1
- package/dist/base-primitives/compound/CompoundActionButton.js +5 -2
- package/dist/base-primitives/compound/CompoundDetailsButton.d.ts +2 -1
- package/dist/base-primitives/compound/CompoundDetailsButton.js +5 -2
- package/dist/base-primitives/compound/CompoundNodeContainer.d.ts +1 -1
- package/dist/base-primitives/compound/CompoundTitle.d.ts +7 -1
- package/dist/base-primitives/compound/CompoundTitle.js +2 -1
- package/dist/base-primitives/compound/actionbtns.css.d.ts +1 -1
- package/dist/base-primitives/edge/EdgeActionButton.d.ts +2 -1
- package/dist/base-primitives/edge/EdgeActionButton.js +2 -1
- package/dist/base-primitives/edge/EdgeContainer.d.ts +1 -1
- package/dist/base-primitives/edge/EdgeContainer.js +4 -2
- package/dist/base-primitives/edge/EdgeLabel.d.ts +2 -0
- package/dist/base-primitives/edge/EdgeLabel.js +2 -5
- package/dist/base-primitives/edge/EdgeLabelContainer.d.ts +1 -1
- package/dist/base-primitives/edge/EdgeMarkers.d.ts +8 -8
- package/dist/base-primitives/element/ElementActionButtons.d.ts +2 -1
- package/dist/base-primitives/element/ElementActionButtons.js +4 -1
- package/dist/base-primitives/element/ElementData.d.ts +4 -2
- package/dist/base-primitives/element/ElementData.js +2 -1
- package/dist/base-primitives/element/ElementDetailsButton.d.ts +2 -1
- package/dist/base-primitives/element/ElementDetailsButton.js +5 -2
- package/dist/base-primitives/element/ElementNodeContainer.js +1 -1
- package/dist/base-primitives/element/ElementShape.d.ts +1 -1
- package/dist/base-primitives/element/ElementShape.js +3 -0
- package/dist/base-primitives/element/ElementTags.d.ts +1 -1
- package/dist/base-primitives/element/ElementTags.js +1 -3
- package/dist/components/ErrorFallback.d.ts +2 -2
- package/dist/components/ErrorFallback.js +3 -5
- package/dist/components/Link.js +6 -6
- package/dist/components/NavigationPanel.d.ts +2 -2
- package/dist/components/NavigationPanel.js +1 -1
- package/dist/components/PortalToContainer.d.ts +1 -1
- package/dist/components/RootContainer.d.ts +1 -1
- package/dist/components/SearchControl.css.js +11 -11
- package/dist/components/SearchControl.d.ts +2 -2
- package/dist/components/ViewNotFound.d.ts +2 -2
- package/dist/context/CurrentViewModelProvider.d.ts +1 -1
- package/dist/context/DefaultMantineProvider.d.ts +1 -1
- package/dist/context/DiagramEventHandlers.d.ts +1 -1
- package/dist/context/EnsureMantine.d.ts +1 -1
- package/dist/context/FramerMotionConfig.d.ts +3 -3
- package/dist/context/FramerMotionConfig.js +2 -2
- package/dist/context/IconRenderer.d.ts +2 -2
- package/dist/context/IconRenderer.js +32 -12
- package/dist/context/LikeC4ModelContext.d.ts +1 -1
- package/dist/context/TagStylesContext.d.ts +4 -3
- package/dist/context/TagStylesContext.js +20 -22
- package/dist/custom/index.d.ts +1 -0
- package/dist/custom/index.js +3 -2
- package/dist/editor/LikeC4EditorProvider.d.ts +2 -2
- package/dist/editor/actor/actions.d.ts +74 -15
- package/dist/editor/actor/actions.js +91 -25
- package/dist/editor/actor/hotkey.d.ts +1 -1
- package/dist/editor/actor/hotkey.js +7 -0
- package/dist/editor/actor/machine.d.ts +4 -6
- package/dist/editor/actor/machine.js +1 -0
- package/dist/editor/actor/setup.d.ts +25 -4
- package/dist/editor/actor/setup.js +8 -6
- package/dist/editor/actor/state.editor.d.ts +64 -14
- package/dist/editor/actor/state.editor.js +12 -11
- package/dist/editor/actor/state.sync-queue.d.ts +283 -91
- package/dist/editor/actor/state.sync-queue.js +93 -56
- package/dist/editor/actor/types.d.ts +6 -1
- package/dist/editor/actor/types.js +1 -1
- package/dist/editor/useEditorActorLogic.js +14 -2
- package/dist/hooks/index.d.ts +1 -1
- package/dist/hooks/safeContext.d.ts +156 -3
- package/dist/hooks/safeContext.js +60 -12
- package/dist/hooks/useCurrentViewModel.js +1 -1
- package/dist/hooks/useDiagram.d.ts +8 -0
- package/dist/hooks/useDiagram.js +9 -2
- package/dist/hooks/useEditorActor.d.ts +5 -0
- package/dist/hooks/useEditorActor.js +4 -3
- package/dist/hooks/useLikeC4ElementsTree.js +1 -1
- package/dist/hooks/useLikeC4Model.js +1 -1
- package/dist/hooks/useXYFlow.d.ts +1 -0
- package/dist/hooks/useXYFlow.js +5 -3
- package/dist/index.d.ts +3 -1
- package/dist/index.js +4 -2
- package/dist/likec4diagram/DiagramUI.d.ts +1 -1
- package/dist/likec4diagram/DiagramUI.js +19 -6
- package/dist/likec4diagram/DiagramXYFlow.js +54 -17
- package/dist/likec4diagram/convert-to-xyflow.d.ts +3 -5
- package/dist/likec4diagram/convert-to-xyflow.js +29 -10
- package/dist/likec4diagram/custom/edges/EdgeDrifts.d.ts +1 -1
- package/dist/likec4diagram/custom/edges/RelationshipEdge.js +140 -18
- package/dist/likec4diagram/custom/edges/SequenceStepEdge.d.ts +1 -1
- package/dist/likec4diagram/custom/edges/SequenceStepEdge.js +11 -4
- package/dist/likec4diagram/custom/edges/edges.css.d.ts +1 -0
- package/dist/likec4diagram/custom/edges/edges.css.js +6 -2
- package/dist/likec4diagram/custom/index.d.ts +2 -1
- package/dist/likec4diagram/custom/index.js +5 -3
- package/dist/likec4diagram/custom/nodes/CompoundActions.d.ts +1 -1
- package/dist/likec4diagram/custom/nodes/CompoundActions.js +1 -0
- package/dist/likec4diagram/custom/nodes/ElementActions.d.ts +4 -4
- package/dist/likec4diagram/custom/nodes/ElementActions.js +13 -3
- package/dist/likec4diagram/custom/nodes/NodeDrifts.d.ts +1 -1
- package/dist/likec4diagram/custom/nodes/NodeNotes.d.ts +1 -1
- package/dist/likec4diagram/custom/nodes/NodeNotes.js +0 -4
- package/dist/likec4diagram/custom/nodes/SequenceActorNode.d.ts +2 -2
- package/dist/likec4diagram/custom/nodes/SequenceActorNode.js +32 -19
- package/dist/likec4diagram/custom/nodes/SequenceSubFlow.d.ts +2 -0
- package/dist/likec4diagram/custom/nodes/SequenceSubFlow.js +234 -0
- package/dist/likec4diagram/custom/nodes/index.d.ts +1 -0
- package/dist/likec4diagram/custom/nodes/nodes.d.ts +7 -7
- package/dist/likec4diagram/custom/nodes/nodes.js +20 -5
- package/dist/likec4diagram/custom/nodes/toolbar/ColorButton.d.ts +3 -3
- package/dist/likec4diagram/custom/nodes/toolbar/ColorButton.js +1 -1
- package/dist/likec4diagram/custom/nodes/toolbar/CompoundToolbar.d.ts +2 -2
- package/dist/likec4diagram/custom/nodes/toolbar/ElementToolbar.d.ts +2 -2
- package/dist/likec4diagram/custom/nodes/toolbar/Toolbar.d.ts +1 -1
- package/dist/likec4diagram/custom/nodes/toolbar/_shared.d.ts +3 -3
- package/dist/likec4diagram/custom/nodes/toolbar/_shared.js +1 -1
- package/dist/likec4diagram/relationship-popover/RelationshipPopover.d.ts +1 -1
- package/dist/likec4diagram/relationship-popover/RelationshipPopover.js +15 -14
- package/dist/likec4diagram/relationship-popover/components.d.ts +2 -2
- package/dist/likec4diagram/state/DiagramActorProvider.d.ts +1 -1
- package/dist/likec4diagram/state/DiagramActorProvider.js +11 -20
- package/dist/likec4diagram/state/aligners.js +1 -1
- package/dist/likec4diagram/state/assign.d.ts +1 -1
- package/dist/likec4diagram/state/assign.js +1 -1
- package/dist/likec4diagram/state/createViewChange.js +2 -1
- package/dist/likec4diagram/state/diagram-api.d.ts +18 -10
- package/dist/likec4diagram/state/diagram-api.js +333 -229
- package/dist/likec4diagram/state/machine.actions.d.ts +1026 -332
- package/dist/likec4diagram/state/machine.actions.js +118 -46
- package/dist/likec4diagram/state/machine.actions.layout.d.ts +123 -51
- package/dist/likec4diagram/state/machine.actions.layout.js +40 -33
- package/dist/likec4diagram/state/machine.d.ts +154 -16
- package/dist/likec4diagram/state/machine.js +5 -41
- package/dist/likec4diagram/state/machine.setup.d.ts +84 -19
- package/dist/likec4diagram/state/machine.setup.js +65 -12
- package/dist/likec4diagram/state/machine.state.initializing.d.ts +59 -33
- package/dist/likec4diagram/state/machine.state.navigating.js +7 -3
- package/dist/likec4diagram/state/machine.state.ready.d.ts +1540 -476
- package/dist/likec4diagram/state/machine.state.ready.focused.d.ts +294 -53
- package/dist/likec4diagram/state/machine.state.ready.focused.js +3 -3
- package/dist/likec4diagram/state/machine.state.ready.idle.d.ts +264 -73
- package/dist/likec4diagram/state/machine.state.ready.idle.js +31 -6
- package/dist/likec4diagram/state/machine.state.ready.js +22 -16
- package/dist/likec4diagram/state/machine.state.ready.printing.d.ts +23 -9
- package/dist/likec4diagram/state/machine.state.ready.walkthrough.d.ts +288 -84
- package/dist/likec4diagram/state/machine.state.ready.walkthrough.js +135 -66
- package/dist/likec4diagram/state/types.d.ts +4 -2
- package/dist/likec4diagram/state/utils.d.ts +7 -0
- package/dist/likec4diagram/state/utils.js +36 -34
- package/dist/likec4diagram/types.d.ts +49 -3
- package/dist/likec4diagram/ui/FloatingSequenceActors.d.ts +6 -0
- package/dist/likec4diagram/ui/FloatingSequenceActors.js +155 -0
- package/dist/likec4diagram/ui/LayoutDriftFrame.d.ts +1 -1
- package/dist/likec4diagram/ui/LayoutDriftFrame.js +2 -2
- package/dist/likec4diagram/ui/index.d.ts +2 -0
- package/dist/likec4diagram/ui/notation/NotationPanel.css.js +5 -5
- package/dist/likec4diagram/ui/notation/NotationPanel.d.ts +1 -1
- package/dist/likec4diagram/ui/sequence-outline/SequenceOutlinePanel.d.ts +2 -0
- package/dist/likec4diagram/ui/sequence-outline/SequenceOutlinePanel.js +519 -0
- package/dist/likec4diagram/ui/sequence-outline/state.d.ts +36 -0
- package/dist/likec4diagram/ui/sequence-outline/state.js +55 -0
- package/dist/likec4diagram/xyflow-diagram/diagram-view.d.ts +1 -1
- package/dist/likec4diagram/xyflow-diagram/diagram-view.js +116 -62
- package/dist/likec4diagram/xyflow-sequence/_types.d.ts +55 -5
- package/dist/likec4diagram/xyflow-sequence/const.d.ts +5 -5
- package/dist/likec4diagram/xyflow-sequence/const.js +4 -4
- package/dist/likec4diagram/xyflow-sequence/layouter.d.ts +30 -6
- package/dist/likec4diagram/xyflow-sequence/layouter.js +561 -0
- package/dist/likec4diagram/xyflow-sequence/{sequence-layout.d.ts → sequence-view-to-xy.d.ts} +8 -2
- package/dist/likec4diagram/xyflow-sequence/{sequence-layout.js → sequence-view-to-xy.js} +112 -14
- package/dist/likec4diagram/xyflow-sequence/sequence-view.d.ts +2 -7
- package/dist/likec4diagram/xyflow-sequence/sequence-view.js +144 -0
- package/dist/likec4diagram/xyflow-sequence/utils.d.ts +9 -1
- package/dist/likec4diagram/xyflow-sequence/utils.js +96 -0
- package/dist/navigationpanel/NavigationPanel.d.ts +5 -2
- package/dist/navigationpanel/NavigationPanel.js +58 -59
- package/dist/navigationpanel/NavigationPanelControls.d.ts +1 -1
- package/dist/navigationpanel/NavigationPanelDropdown.d.ts +1 -1
- package/dist/navigationpanel/NavigationPanelDropdown.js +47 -40
- package/dist/navigationpanel/_common.d.ts +2 -2
- package/dist/navigationpanel/_common.js +2 -2
- package/dist/navigationpanel/actor.actions.d.ts +19 -0
- package/dist/navigationpanel/actor.actions.js +45 -0
- package/dist/navigationpanel/actor.d.ts +34 -96
- package/dist/navigationpanel/actor.js +21 -84
- package/dist/navigationpanel/actor.setup.d.ts +98 -0
- package/dist/navigationpanel/actor.setup.js +31 -0
- package/dist/navigationpanel/comparepanel/CompareActionsMenu.d.ts +1 -1
- package/dist/navigationpanel/comparepanel/ComparePanel.d.ts +1 -1
- package/dist/navigationpanel/comparepanel/ComparePanelControls.d.ts +1 -1
- package/dist/navigationpanel/comparepanel/DriftsSummary.d.ts +1 -1
- package/dist/navigationpanel/comparepanel/DriftsSummary.js +4 -5
- package/dist/navigationpanel/comparepanel/LayoutTypeSwitcher.d.ts +1 -1
- package/dist/navigationpanel/controls/DetailsControls.d.ts +1 -1
- package/dist/navigationpanel/controls/DetailsControls.js +7 -8
- package/dist/navigationpanel/controls/LayoutWarning.d.ts +1 -1
- package/dist/navigationpanel/controls/LogoButton.d.ts +1 -1
- package/dist/navigationpanel/controls/NavigationButtons.d.ts +1 -1
- package/dist/navigationpanel/controls/OpenSource.d.ts +1 -1
- package/dist/navigationpanel/controls/SearchControl.d.ts +1 -1
- package/dist/navigationpanel/controls/ToggleReadonly.d.ts +1 -1
- package/dist/navigationpanel/dropdown/ProjectsMenu.js +1 -1
- package/dist/navigationpanel/editorpanel/CenterCamera.d.ts +1 -1
- package/dist/navigationpanel/editorpanel/ChangeAutoLayoutButton.d.ts +1 -1
- package/dist/navigationpanel/editorpanel/EditorPanel.d.ts +1 -1
- package/dist/navigationpanel/editorpanel/ManualLayoutToolsButton.d.ts +1 -1
- package/dist/navigationpanel/editorpanel/ToggleReadonly.d.ts +1 -1
- package/dist/navigationpanel/editorpanel/styles.js +8 -8
- package/dist/navigationpanel/hooks.d.ts +20 -5
- package/dist/navigationpanel/hooks.js +4 -18
- package/dist/navigationpanel/styles.css.d.ts +1 -1
- package/dist/navigationpanel/walkthrough/ActiveWalkthroughControls.d.ts +1 -1
- package/dist/navigationpanel/walkthrough/ActiveWalkthroughControls.js +2 -2
- package/dist/navigationpanel/walkthrough/DynamicViewControls.d.ts +5 -5
- package/dist/navigationpanel/walkthrough/DynamicViewControls.js +23 -25
- package/dist/navigationpanel/walkthrough/WalkthroughPanel.d.ts +1 -1
- package/dist/navigationpanel/walkthrough/WalkthroughPanel.js +5 -5
- package/dist/overlays/Overlays.d.ts +4 -2
- package/dist/overlays/Overlays.js +10 -10
- package/dist/overlays/element-details/ElementDetails.d.ts +1 -1
- package/dist/overlays/element-details/ElementDetailsCard.css.js +17 -17
- package/dist/overlays/element-details/ElementDetailsCard.d.ts +1 -1
- package/dist/overlays/element-details/MetadataValue.d.ts +2 -2
- package/dist/overlays/element-details/MetadataValue.js +15 -15
- package/dist/overlays/element-details/TabPanelDeployments.css.js +5 -5
- package/dist/overlays/element-details/TabPanelRelationships.css.js +11 -11
- package/dist/overlays/element-details/TabPanelRelationships.d.ts +1 -1
- package/dist/overlays/element-details/TabPanelRelationships.js +1 -1
- package/dist/overlays/element-details/TabPanelStructure.css.js +2 -2
- package/dist/overlays/element-details/TabPanelStructure.d.ts +2 -2
- package/dist/overlays/element-details/TabPanelStructure.js +1 -1
- package/dist/overlays/element-details/actor.d.ts +2 -3
- package/dist/overlays/hooks.d.ts +28 -0
- package/dist/overlays/hooks.js +5 -0
- package/dist/overlays/overlay/Overlay.js +34 -25
- package/dist/overlays/overlaysActor.js +0 -1
- package/dist/overlays/relationship-details/RelationshipDetails.d.ts +1 -1
- package/dist/overlays/relationship-details/SelectEdge.d.ts +1 -1
- package/dist/overlays/relationship-details/custom/ElementActions.d.ts +1 -1
- package/dist/overlays/relationship-details/custom/nodeTypes.d.ts +4 -4
- package/dist/overlays/relationship-details/custom/nodeTypes.js +1 -1
- package/dist/overlays/relationship-details/layout.js +1 -1
- package/dist/overlays/relationships-browser/RelationshipsBrowser.d.ts +1 -1
- package/dist/overlays/relationships-browser/SelectElement.css.js +2 -2
- package/dist/overlays/relationships-browser/SelectElement.d.ts +1 -1
- package/dist/overlays/relationships-browser/actor.js +79 -78
- package/dist/overlays/relationships-browser/custom/ElementActions.d.ts +1 -1
- package/dist/overlays/relationships-browser/custom/EmptyNode.d.ts +1 -1
- package/dist/overlays/relationships-browser/custom/nodeTypes.d.ts +4 -4
- package/dist/overlays/relationships-browser/custom/nodeTypes.js +1 -1
- package/dist/overlays/relationships-browser/hooks.js +1 -1
- package/dist/overlays/relationships-browser/layout.js +2 -2
- package/dist/projects-overview/ProjectsOverview.d.ts +1 -1
- package/dist/projects-overview/actor.js +4 -4
- package/dist/projects-overview/custom/nodeTypes.d.ts +1 -1
- package/dist/projects-overview/panel/ProjectsOverviewPanel.d.ts +1 -1
- package/dist/search/Search.d.ts +1 -1
- package/dist/search/Search.js +1 -1
- package/dist/search/XStateSearchAdapter.d.ts +1 -1
- package/dist/search/components/ElementsColumn.css.js +2 -2
- package/dist/search/components/ElementsColumn.d.ts +1 -1
- package/dist/search/components/PickView.d.ts +1 -1
- package/dist/search/components/SearchByTags.d.ts +1 -1
- package/dist/search/components/SearchInput.d.ts +1 -1
- package/dist/search/components/ViewsColum.d.ts +3 -3
- package/dist/search/components/ViewsColum.js +1 -1
- package/dist/search/components/_shared.css.d.ts +1 -1
- package/dist/search/components/_shared.css.js +23 -23
- package/dist/search/components/styles.css.js +4 -4
- package/dist/shadowroot/ShadowRoot.d.ts +2 -3
- package/dist/shadowroot/ShadowRoot.js +95 -41
- package/dist/shadowroot/index.d.ts +1 -0
- package/dist/styles2.js +1 -1
- package/dist/utils/defineActors.d.ts +21 -0
- package/dist/utils/defineActors.js +13 -0
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.js +5 -4
- package/dist/utils/readableText.d.ts +11 -0
- package/dist/utils/readableText.js +18 -0
- package/package.json +30 -43
- package/panda.buildinfo.json +271 -295
- package/styles-min.css +1 -1
- package/styles-xyflow.css +1 -1
- package/styles.css +1 -1
- package/adhoc-editor/package.json +0 -4
- package/dist/adhoc-editor/EditorPanel.d.ts +0 -1
- package/dist/adhoc-editor/EditorPanel.js +0 -106
- package/dist/adhoc-editor/ElementsTree.d.ts +0 -2
- package/dist/adhoc-editor/ElementsTree.js +0 -112
- package/dist/adhoc-editor/LikeC4AdHocViewEditor.d.ts +0 -4
- package/dist/adhoc-editor/LikeC4AdHocViewEditor.js +0 -83
- package/dist/adhoc-editor/components/Tree.d.ts +0 -48
- package/dist/adhoc-editor/components/Tree.js +0 -213
- package/dist/adhoc-editor/hooks.d.ts +0 -14
- package/dist/adhoc-editor/hooks.js +0 -34
- package/dist/adhoc-editor/index.d.ts +0 -2
- package/dist/adhoc-editor/index.js +0 -2
- package/dist/adhoc-editor/state/ActorProvider.d.ts +0 -5
- package/dist/adhoc-editor/state/ActorProvider.js +0 -37
- package/dist/adhoc-editor/state/actor.d.ts +0 -13
- package/dist/adhoc-editor/state/actor.editor.d.ts +0 -56
- package/dist/adhoc-editor/state/actor.editor.js +0 -167
- package/dist/adhoc-editor/state/actor.js +0 -14
- package/dist/adhoc-editor/state/actor.layouter.d.ts +0 -51
- package/dist/adhoc-editor/state/actor.layouter.js +0 -54
- package/dist/adhoc-editor/state/actor.types.d.ts +0 -63
- package/dist/adhoc-editor/state/actor.types.js +0 -25
- package/dist/adhoc-editor/state/panel.d.ts +0 -95
- package/dist/adhoc-editor/state/panel.js +0 -124
- package/dist/adhoc-editor/state/utils.d.ts +0 -17
- package/dist/adhoc-editor/state/utils.js +0 -25
- package/dist/adhoc-editor/useElementsTree.d.ts +0 -18
- package/dist/adhoc-editor/useElementsTree.js +0 -98
- package/dist/adhoc-editor/viewrules/ViewRulesPanel.d.ts +0 -6
- package/dist/shadowroot/styles.css.d.ts +0 -12
- package/dist/shadowroot/styles.css.js +0 -59
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { ActorRef, SnapshotFrom, StateMachine } from 'xstate';
|
|
2
|
-
import { editor } from './actor.editor';
|
|
3
|
-
import { layouter } from './actor.layouter';
|
|
4
|
-
import { Context, EmittedEvents, Events } from './actor.types';
|
|
5
|
-
export interface AdhocEditorLogic extends StateMachine<Context, Events, any, any, any, any, any, {
|
|
6
|
-
layouter: keyof typeof layouter['states'];
|
|
7
|
-
editor: keyof typeof editor['states'];
|
|
8
|
-
}, any, any, EmittedEvents, any, any, any> {
|
|
9
|
-
}
|
|
10
|
-
export declare const adhocEditorLogic: AdhocEditorLogic;
|
|
11
|
-
export type AdhocEditorSnapshot = SnapshotFrom<AdhocEditorLogic>;
|
|
12
|
-
export interface AdhocEditorActorRef extends ActorRef<AdhocEditorSnapshot, Events, EmittedEvents> {
|
|
13
|
-
}
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import { Context, Events, AdhocViewServiceActor, EmittedEvents } from './actor.types';
|
|
2
|
-
import { ActionFunction } from 'xstate';
|
|
3
|
-
export declare const editor: {
|
|
4
|
-
initial: string;
|
|
5
|
-
states: {
|
|
6
|
-
idle: {
|
|
7
|
-
id: string;
|
|
8
|
-
on: {
|
|
9
|
-
'select.open': {
|
|
10
|
-
target: "#selecting";
|
|
11
|
-
};
|
|
12
|
-
'toggle.rule': {
|
|
13
|
-
target: "#layouting";
|
|
14
|
-
actions: ActionFunction<Context, Events, Events, undefined, {
|
|
15
|
-
src: "service";
|
|
16
|
-
logic: AdhocViewServiceActor;
|
|
17
|
-
id: string | undefined;
|
|
18
|
-
}, never, never, never, never>;
|
|
19
|
-
};
|
|
20
|
-
'delete.rule': {
|
|
21
|
-
target: "#layouting";
|
|
22
|
-
actions: ActionFunction<Context, Events, Events, undefined, {
|
|
23
|
-
src: "service";
|
|
24
|
-
logic: AdhocViewServiceActor;
|
|
25
|
-
id: string | undefined;
|
|
26
|
-
}, never, never, never, never>;
|
|
27
|
-
};
|
|
28
|
-
};
|
|
29
|
-
};
|
|
30
|
-
selecting: {
|
|
31
|
-
id: string;
|
|
32
|
-
on: {
|
|
33
|
-
'toggle.element': {
|
|
34
|
-
actions: ActionFunction<Context, Events, Events, undefined, {
|
|
35
|
-
src: "service";
|
|
36
|
-
logic: AdhocViewServiceActor;
|
|
37
|
-
id: string | undefined;
|
|
38
|
-
}, never, {
|
|
39
|
-
type: "hasView";
|
|
40
|
-
params: unknown;
|
|
41
|
-
}, never, EmittedEvents>[];
|
|
42
|
-
};
|
|
43
|
-
'select.close': {
|
|
44
|
-
target: "#idle";
|
|
45
|
-
};
|
|
46
|
-
};
|
|
47
|
-
};
|
|
48
|
-
layouting: {
|
|
49
|
-
id: string;
|
|
50
|
-
always: {
|
|
51
|
-
target: "#idle";
|
|
52
|
-
actions: ActionFunction<Context, Events, Events, undefined, never, never, never, never, never>;
|
|
53
|
-
};
|
|
54
|
-
};
|
|
55
|
-
};
|
|
56
|
-
};
|
|
@@ -1,167 +0,0 @@
|
|
|
1
|
-
import "../../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { machine } from "./actor.types.js";
|
|
3
|
-
import { emitViewUpdate } from "./actor.layouter.js";
|
|
4
|
-
import { last } from "remeda";
|
|
5
|
-
import { ModelFqnExpr } from "@likec4/core";
|
|
6
|
-
import { invariant as invariant$1, nonexhaustive as nonexhaustive$1, stringHash } from "@likec4/core/utils";
|
|
7
|
-
import { assertEvent } from "xstate";
|
|
8
|
-
//#region src/adhoc-editor/state/actor.editor.ts
|
|
9
|
-
var to = {
|
|
10
|
-
idle: { target: "#idle" },
|
|
11
|
-
selecting: { target: "#selecting" },
|
|
12
|
-
layouting: { target: "#layouting" }
|
|
13
|
-
};
|
|
14
|
-
function nextId({ rules }, salt = "") {
|
|
15
|
-
return stringHash((rules.at(-1)?.id ?? (/* @__PURE__ */ new Date()).toISOString()) + salt);
|
|
16
|
-
}
|
|
17
|
-
var isRuleOf = (fqn) => (rule) => {
|
|
18
|
-
return ModelFqnExpr.isModelRef(rule.expr) && rule.expr.ref.model === fqn;
|
|
19
|
-
};
|
|
20
|
-
var isIncludeOf = (fqn) => (rule) => {
|
|
21
|
-
return rule.type === "include" && ModelFqnExpr.isModelRef(rule.expr) && rule.expr.ref.model === fqn;
|
|
22
|
-
};
|
|
23
|
-
var isExcludeOf = (fqn) => (rule) => {
|
|
24
|
-
return rule.type === "exclude" && ModelFqnExpr.isModelRef(rule.expr) && rule.expr.ref.model === fqn;
|
|
25
|
-
};
|
|
26
|
-
function deriveElementState(id, { rules, view }) {
|
|
27
|
-
const ruleOf = rules.find(isRuleOf(id));
|
|
28
|
-
if (ruleOf && !ruleOf.enabled) return {
|
|
29
|
-
state: "disabled",
|
|
30
|
-
ruleId: ruleOf.id
|
|
31
|
-
};
|
|
32
|
-
const isIncludedInView = view ? view.nodes.some((node) => node.modelRef === id) : false;
|
|
33
|
-
const includeRule = rules.find(isIncludeOf(id));
|
|
34
|
-
const excludeRule = rules.find(isExcludeOf(id));
|
|
35
|
-
switch (true) {
|
|
36
|
-
case includeRule && isIncludedInView: return {
|
|
37
|
-
state: "include-explicit",
|
|
38
|
-
ruleId: includeRule.id
|
|
39
|
-
};
|
|
40
|
-
case !includeRule && isIncludedInView: return {
|
|
41
|
-
state: "include-implicit",
|
|
42
|
-
ruleId: void 0
|
|
43
|
-
};
|
|
44
|
-
case includeRule && !isIncludedInView: return {
|
|
45
|
-
state: "not-present",
|
|
46
|
-
ruleId: includeRule.id
|
|
47
|
-
};
|
|
48
|
-
case !!excludeRule: return {
|
|
49
|
-
state: "exclude",
|
|
50
|
-
ruleId: excludeRule.id
|
|
51
|
-
};
|
|
52
|
-
default:
|
|
53
|
-
invariant$1(isIncludedInView === false, "Element not in view should not be included or excluded by any rule");
|
|
54
|
-
return {
|
|
55
|
-
state: "not-present",
|
|
56
|
-
ruleId: void 0
|
|
57
|
-
};
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
var enableRule = (ruleId) => machine.assign(({ context }) => {
|
|
61
|
-
return { rules: context.rules.map((rule) => {
|
|
62
|
-
if (rule.id === ruleId && !rule.enabled) return {
|
|
63
|
-
...rule,
|
|
64
|
-
enabled: true
|
|
65
|
-
};
|
|
66
|
-
return rule;
|
|
67
|
-
}) };
|
|
68
|
-
});
|
|
69
|
-
var addElementRules = (fqn, type) => machine.assign(({ context }) => {
|
|
70
|
-
return { rules: [...context.rules, {
|
|
71
|
-
id: nextId(context, type + fqn),
|
|
72
|
-
expr: { ref: { model: fqn } },
|
|
73
|
-
enabled: true,
|
|
74
|
-
type
|
|
75
|
-
}] };
|
|
76
|
-
});
|
|
77
|
-
var removeElementRules = (fqn) => machine.assign(({ context }) => {
|
|
78
|
-
const isRule = isRuleOf(fqn);
|
|
79
|
-
return { rules: context.rules.filter((rule) => {
|
|
80
|
-
return !isRule(rule);
|
|
81
|
-
}) };
|
|
82
|
-
});
|
|
83
|
-
var toggleElement = () => machine.enqueueActions(({ context, event, enqueue }) => {
|
|
84
|
-
assertEvent(event, "toggle.element");
|
|
85
|
-
const isRuleOfTheElement = isRuleOf(event.id);
|
|
86
|
-
const lastRule = last(context.rules);
|
|
87
|
-
if (lastRule && isRuleOfTheElement(lastRule)) {
|
|
88
|
-
enqueue.assign({ rules: context.rules.slice(0, -1) });
|
|
89
|
-
return;
|
|
90
|
-
}
|
|
91
|
-
const state = deriveElementState(event.id, context);
|
|
92
|
-
switch (state.state) {
|
|
93
|
-
case "disabled":
|
|
94
|
-
enqueue(enableRule(state.ruleId));
|
|
95
|
-
break;
|
|
96
|
-
case "not-present":
|
|
97
|
-
enqueue(removeElementRules(event.id));
|
|
98
|
-
enqueue(addElementRules(event.id, "include"));
|
|
99
|
-
break;
|
|
100
|
-
case "include-implicit":
|
|
101
|
-
enqueue(removeElementRules(event.id));
|
|
102
|
-
enqueue(addElementRules(event.id, "exclude"));
|
|
103
|
-
break;
|
|
104
|
-
case "include-explicit":
|
|
105
|
-
case "exclude":
|
|
106
|
-
enqueue(removeElementRules(event.id));
|
|
107
|
-
break;
|
|
108
|
-
default: nonexhaustive$1(state);
|
|
109
|
-
}
|
|
110
|
-
});
|
|
111
|
-
var toggleRule = () => machine.assign(({ context, event }) => {
|
|
112
|
-
assertEvent(event, "toggle.rule");
|
|
113
|
-
return { rules: context.rules.map((rule) => {
|
|
114
|
-
if (rule.id === event.ruleId) return {
|
|
115
|
-
...rule,
|
|
116
|
-
enabled: !rule.enabled
|
|
117
|
-
};
|
|
118
|
-
return rule;
|
|
119
|
-
}) };
|
|
120
|
-
});
|
|
121
|
-
var deleteRule = () => machine.assign(({ context, event }) => {
|
|
122
|
-
assertEvent(event, "delete.rule");
|
|
123
|
-
return { rules: context.rules.filter((rule) => rule.id !== event.ruleId) };
|
|
124
|
-
});
|
|
125
|
-
var scheduleLayout = () => machine.raise({ type: "layout" });
|
|
126
|
-
var idle = machine.createStateConfig({
|
|
127
|
-
id: "idle",
|
|
128
|
-
on: {
|
|
129
|
-
"select.open": { ...to.selecting },
|
|
130
|
-
"toggle.rule": {
|
|
131
|
-
actions: toggleRule(),
|
|
132
|
-
...to.layouting
|
|
133
|
-
},
|
|
134
|
-
"delete.rule": {
|
|
135
|
-
actions: deleteRule(),
|
|
136
|
-
...to.layouting
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
});
|
|
140
|
-
var selecting = machine.createStateConfig({
|
|
141
|
-
id: "selecting",
|
|
142
|
-
on: {
|
|
143
|
-
"toggle.element": { actions: [
|
|
144
|
-
toggleElement(),
|
|
145
|
-
emitViewUpdate(),
|
|
146
|
-
scheduleLayout()
|
|
147
|
-
] },
|
|
148
|
-
"select.close": { ...to.idle }
|
|
149
|
-
}
|
|
150
|
-
});
|
|
151
|
-
var layouting = machine.createStateConfig({
|
|
152
|
-
id: "layouting",
|
|
153
|
-
always: {
|
|
154
|
-
actions: scheduleLayout(),
|
|
155
|
-
...to.idle
|
|
156
|
-
}
|
|
157
|
-
});
|
|
158
|
-
var editor = machine.createStateConfig({
|
|
159
|
-
initial: "selecting",
|
|
160
|
-
states: {
|
|
161
|
-
idle,
|
|
162
|
-
selecting,
|
|
163
|
-
layouting
|
|
164
|
-
}
|
|
165
|
-
});
|
|
166
|
-
//#endregion
|
|
167
|
-
export { editor };
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import { createContext, machine } from "./actor.types.js";
|
|
2
|
-
import { layouter } from "./actor.layouter.js";
|
|
3
|
-
import { editor } from "./actor.editor.js";
|
|
4
|
-
var adhocEditorLogic = machine.createMachine({
|
|
5
|
-
id: "adhoc-editor",
|
|
6
|
-
context: createContext,
|
|
7
|
-
type: "parallel",
|
|
8
|
-
states: {
|
|
9
|
-
layouter,
|
|
10
|
-
editor
|
|
11
|
-
}
|
|
12
|
-
});
|
|
13
|
-
//#endregion
|
|
14
|
-
export { adhocEditorLogic };
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import { ActionFunction, LogAction, ActorRef, MachineSnapshot, AnyActorRef, StateValue, AnyEventObject, DoneActorEvent, ErrorActorEvent } from 'xstate';
|
|
2
|
-
import { Context, Events, EmittedEvents, AdhocViewServiceActor } from './actor.types';
|
|
3
|
-
import { AdhocViewPredicate } from '@likec4/core/compute-view';
|
|
4
|
-
import { LayoutedElementView } from '@likec4/core';
|
|
5
|
-
export declare const emitViewUpdate: () => ActionFunction<Context, Events, Events, undefined, never, never, never, never, EmittedEvents>;
|
|
6
|
-
export declare const layouter: {
|
|
7
|
-
initial: string;
|
|
8
|
-
states: {
|
|
9
|
-
idle: {
|
|
10
|
-
id: string;
|
|
11
|
-
entry: LogAction<Context, Events, undefined, Events>;
|
|
12
|
-
exit: LogAction<Context, Events, undefined, Events>;
|
|
13
|
-
on: {
|
|
14
|
-
layout: {
|
|
15
|
-
target: "#layouter-call";
|
|
16
|
-
};
|
|
17
|
-
};
|
|
18
|
-
};
|
|
19
|
-
call: {
|
|
20
|
-
id: string;
|
|
21
|
-
entry: LogAction<Context, Events, undefined, Events>;
|
|
22
|
-
exit: LogAction<Context, Events, undefined, Events>;
|
|
23
|
-
invoke: {
|
|
24
|
-
src: "service";
|
|
25
|
-
input: ({ context }: {
|
|
26
|
-
context: Context;
|
|
27
|
-
event: Events;
|
|
28
|
-
self: ActorRef<MachineSnapshot<Context, Events, Record<string, AnyActorRef>, StateValue, string, unknown, any, any>, Events, AnyEventObject>;
|
|
29
|
-
}) => {
|
|
30
|
-
predicates: AdhocViewPredicate[];
|
|
31
|
-
};
|
|
32
|
-
onDone: {
|
|
33
|
-
target: "#layouter-idle";
|
|
34
|
-
actions: ( ActionFunction<Context, DoneActorEvent<{
|
|
35
|
-
view: LayoutedElementView;
|
|
36
|
-
}, string>, Events, undefined, {
|
|
37
|
-
src: "service";
|
|
38
|
-
logic: AdhocViewServiceActor;
|
|
39
|
-
id: string | undefined;
|
|
40
|
-
}, never, never, never, never> | ActionFunction<Context, DoneActorEvent<{
|
|
41
|
-
view: LayoutedElementView;
|
|
42
|
-
}, string>, Events, undefined, never, never, never, never, EmittedEvents>)[];
|
|
43
|
-
};
|
|
44
|
-
onError: {
|
|
45
|
-
target: "#layouter-idle";
|
|
46
|
-
actions: LogAction<Context, ErrorActorEvent<unknown, string>, undefined, Events>[];
|
|
47
|
-
};
|
|
48
|
-
};
|
|
49
|
-
};
|
|
50
|
-
};
|
|
51
|
-
};
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import "../../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { machine, ruleToPredicate } from "./actor.types.js";
|
|
3
|
-
import { filter, map, piped } from "remeda";
|
|
4
|
-
import { objectHash } from "@likec4/core/utils";
|
|
5
|
-
import { assign, emit, log } from "xstate";
|
|
6
|
-
//#region src/adhoc-editor/state/actor.layouter.ts
|
|
7
|
-
var to = {
|
|
8
|
-
idle: { target: "#layouter-idle" },
|
|
9
|
-
call: { target: "#layouter-call" }
|
|
10
|
-
};
|
|
11
|
-
var idle = machine.createStateConfig({
|
|
12
|
-
id: to.idle.target.substring(1),
|
|
13
|
-
entry: log("entry idle ->"),
|
|
14
|
-
exit: log(" -> idle exit "),
|
|
15
|
-
on: { "layout": { ...to.call } }
|
|
16
|
-
});
|
|
17
|
-
var emitViewUpdate = () => machine.emit({ type: "view.update" });
|
|
18
|
-
var selectEnabled = piped(filter((rule) => rule.enabled), map(ruleToPredicate));
|
|
19
|
-
var call = machine.createStateConfig({
|
|
20
|
-
id: to.call.target.substring(1),
|
|
21
|
-
entry: log("entry call ->"),
|
|
22
|
-
exit: log(" -> call exit "),
|
|
23
|
-
invoke: {
|
|
24
|
-
src: "service",
|
|
25
|
-
input: ({ context }) => ({ predicates: selectEnabled(context.rules) }),
|
|
26
|
-
onDone: {
|
|
27
|
-
actions: [assign({
|
|
28
|
-
view: ({ context, event }) => {
|
|
29
|
-
const id = objectHash(selectEnabled(context.rules));
|
|
30
|
-
return {
|
|
31
|
-
...event.output.view,
|
|
32
|
-
hash: id,
|
|
33
|
-
id
|
|
34
|
-
};
|
|
35
|
-
},
|
|
36
|
-
error: void 0
|
|
37
|
-
}), emit({ type: "view.update" })],
|
|
38
|
-
...to.idle
|
|
39
|
-
},
|
|
40
|
-
onError: {
|
|
41
|
-
actions: [log(({ event }) => `error: ${event.error}`), assign({ error: ({ event }) => `${event.error}` })],
|
|
42
|
-
...to.idle
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
});
|
|
46
|
-
var layouter = machine.createStateConfig({
|
|
47
|
-
initial: "idle",
|
|
48
|
-
states: {
|
|
49
|
-
idle,
|
|
50
|
-
call
|
|
51
|
-
}
|
|
52
|
-
});
|
|
53
|
-
//#endregion
|
|
54
|
-
export { emitViewUpdate, layouter };
|
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import { AdhocViewPredicate } from '@likec4/core/compute-view';
|
|
2
|
-
import { Fqn, LayoutedElementView, ModelFqnExpr } from '@likec4/core/types';
|
|
3
|
-
import { PromiseActorLogic } from 'xstate/actors';
|
|
4
|
-
import { SetupReturn, NonReducibleUnknown, MetaObject } from 'xstate';
|
|
5
|
-
type CalcAdhocViewInput = {
|
|
6
|
-
predicates: AdhocViewPredicate[];
|
|
7
|
-
};
|
|
8
|
-
type CalcAdhocViewOutput = {
|
|
9
|
-
view: LayoutedElementView;
|
|
10
|
-
};
|
|
11
|
-
export type AdhocViewService = {
|
|
12
|
-
process: (input: CalcAdhocViewInput) => Promise<CalcAdhocViewOutput>;
|
|
13
|
-
};
|
|
14
|
-
export type AdhocViewServiceActor = PromiseActorLogic<CalcAdhocViewOutput, CalcAdhocViewInput>;
|
|
15
|
-
export type Input = {};
|
|
16
|
-
export type AdhocRule = {
|
|
17
|
-
id: string;
|
|
18
|
-
expr: ModelFqnExpr.Ref;
|
|
19
|
-
enabled: boolean;
|
|
20
|
-
type: 'include' | 'exclude';
|
|
21
|
-
};
|
|
22
|
-
export declare function ruleToPredicate(rule: AdhocRule): AdhocViewPredicate;
|
|
23
|
-
export interface Context {
|
|
24
|
-
view: LayoutedElementView | null;
|
|
25
|
-
error: string | undefined;
|
|
26
|
-
rules: AdhocRule[];
|
|
27
|
-
}
|
|
28
|
-
export type EmittedEvents = {
|
|
29
|
-
type: 'navigate.to';
|
|
30
|
-
} | {
|
|
31
|
-
type: 'view.update';
|
|
32
|
-
} | {
|
|
33
|
-
type: 'click.element';
|
|
34
|
-
id: Fqn;
|
|
35
|
-
};
|
|
36
|
-
export type Events = {
|
|
37
|
-
type: 'toggle.element';
|
|
38
|
-
id: Fqn;
|
|
39
|
-
} | {
|
|
40
|
-
type: 'click.element';
|
|
41
|
-
id: Fqn;
|
|
42
|
-
} | {
|
|
43
|
-
type: 'toggle.rule';
|
|
44
|
-
ruleId: string;
|
|
45
|
-
} | {
|
|
46
|
-
type: 'delete.rule';
|
|
47
|
-
ruleId: string;
|
|
48
|
-
} | {
|
|
49
|
-
type: 'select.open';
|
|
50
|
-
} | {
|
|
51
|
-
type: 'select.close';
|
|
52
|
-
} | {
|
|
53
|
-
type: 'layout';
|
|
54
|
-
} | {
|
|
55
|
-
type: 'dispose';
|
|
56
|
-
};
|
|
57
|
-
export declare const machine: SetupReturn<Context, Events, {
|
|
58
|
-
service: AdhocViewServiceActor;
|
|
59
|
-
}, {}, {}, {
|
|
60
|
-
hasView: unknown;
|
|
61
|
-
}, never, "hasView", NonReducibleUnknown, NonReducibleUnknown, EmittedEvents, MetaObject>;
|
|
62
|
-
export declare function createContext(): Context;
|
|
63
|
-
export {};
|
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import "../../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { setup } from "xstate";
|
|
3
|
-
//#region src/adhoc-editor/state/actor.types.ts
|
|
4
|
-
function ruleToPredicate(rule) {
|
|
5
|
-
return rule.type === "include" ? { include: [rule.expr] } : { exclude: [rule.expr] };
|
|
6
|
-
}
|
|
7
|
-
var machine = setup({
|
|
8
|
-
types: {
|
|
9
|
-
context: {},
|
|
10
|
-
tags: "",
|
|
11
|
-
events: {},
|
|
12
|
-
emitted: {}
|
|
13
|
-
},
|
|
14
|
-
actors: { service: {} },
|
|
15
|
-
guards: { hasView: ({ context }) => context.view !== null }
|
|
16
|
-
});
|
|
17
|
-
function createContext() {
|
|
18
|
-
return {
|
|
19
|
-
view: null,
|
|
20
|
-
error: void 0,
|
|
21
|
-
rules: []
|
|
22
|
-
};
|
|
23
|
-
}
|
|
24
|
-
//#endregion
|
|
25
|
-
export { createContext, machine, ruleToPredicate };
|
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
import { Fqn } from '@likec4/core';
|
|
2
|
-
import { StoreSnapshot, Store } from '@xstate/store';
|
|
3
|
-
import { TreeCollection } from '@zag-js/collection';
|
|
4
|
-
import { PropsWithChildren } from 'react';
|
|
5
|
-
import { TreeNodeData } from '../useElementsTree';
|
|
6
|
-
type EditorPanelState = {
|
|
7
|
-
searchInput: string;
|
|
8
|
-
expandedValue: string[];
|
|
9
|
-
collection: TreeCollection<TreeNodeData>;
|
|
10
|
-
};
|
|
11
|
-
declare const createEditorPanelStore: ({ initial, sideEffects, }: {
|
|
12
|
-
initial: TreeCollection<TreeNodeData>;
|
|
13
|
-
sideEffects: {
|
|
14
|
-
onElementStateClick: (payload: {
|
|
15
|
-
id: Fqn;
|
|
16
|
-
}) => void;
|
|
17
|
-
};
|
|
18
|
-
}) => Store<EditorPanelState, {
|
|
19
|
-
inputChange: {
|
|
20
|
-
value: string;
|
|
21
|
-
};
|
|
22
|
-
inputKeyDown: {};
|
|
23
|
-
modelUpdate: {
|
|
24
|
-
collection: TreeCollection<TreeNodeData>;
|
|
25
|
-
};
|
|
26
|
-
elementClick: {
|
|
27
|
-
id: Fqn;
|
|
28
|
-
};
|
|
29
|
-
}, {
|
|
30
|
-
type: "inputKeyDown";
|
|
31
|
-
}>;
|
|
32
|
-
export type EditorPanelStore = ReturnType<typeof createEditorPanelStore>;
|
|
33
|
-
export declare const EditorPanelStoreProvider: (props: PropsWithChildren) => import("react/jsx-runtime").JSX.Element;
|
|
34
|
-
export declare function selectEditorPanelState<T>(selector: (state: EditorPanelState) => T): [
|
|
35
|
-
selector: (snapshot: StoreSnapshot<EditorPanelState>) => T,
|
|
36
|
-
compare: (a: NoInfer<T> | undefined, b: NoInfer<T>) => boolean
|
|
37
|
-
];
|
|
38
|
-
export declare function selectEditorPanelState<T>(selector: (state: EditorPanelState) => T, compare: (a: NoInfer<T> | undefined, b: NoInfer<T>) => boolean): [
|
|
39
|
-
selector: (snapshot: StoreSnapshot<EditorPanelState>) => T,
|
|
40
|
-
compare: (a: NoInfer<T> | undefined, b: NoInfer<T>) => boolean
|
|
41
|
-
];
|
|
42
|
-
export declare function useEditorPanelStore(): Store<EditorPanelState, {
|
|
43
|
-
inputChange: {
|
|
44
|
-
value: string;
|
|
45
|
-
};
|
|
46
|
-
inputKeyDown: {};
|
|
47
|
-
modelUpdate: {
|
|
48
|
-
collection: TreeCollection<TreeNodeData>;
|
|
49
|
-
};
|
|
50
|
-
elementClick: {
|
|
51
|
-
id: Fqn;
|
|
52
|
-
};
|
|
53
|
-
}, {
|
|
54
|
-
type: "inputKeyDown";
|
|
55
|
-
}>;
|
|
56
|
-
export declare function useEditorPanelState<T>(arg1: readonly [
|
|
57
|
-
(snapshot: StoreSnapshot<EditorPanelState>) => T,
|
|
58
|
-
(a: NoInfer<T> | undefined, b: NoInfer<T>) => boolean
|
|
59
|
-
]): T;
|
|
60
|
-
export declare function useEditorPanelState<T>(selector: (snapshot: StoreSnapshot<EditorPanelState>) => T, compare?: (a: NoInfer<T> | undefined, b: NoInfer<T>) => boolean): T;
|
|
61
|
-
/**
|
|
62
|
-
* Hook to subscribe to editor panel events
|
|
63
|
-
* @param args - The event name and handler function
|
|
64
|
-
* @example
|
|
65
|
-
* useOnEditorPanelEvent('inputKeyDown', () => {
|
|
66
|
-
* console.log('Input key down event')
|
|
67
|
-
* })
|
|
68
|
-
*/
|
|
69
|
-
export declare function useOnEditorPanelEvent(...args: Parameters<EditorPanelStore['on']>): void;
|
|
70
|
-
/**
|
|
71
|
-
* Hook to access the editor panel store trigger or create a wrapped trigger function
|
|
72
|
-
*
|
|
73
|
-
* @overload
|
|
74
|
-
* @returns The store trigger object
|
|
75
|
-
*
|
|
76
|
-
* @overload
|
|
77
|
-
* @template T - The parameter types for the wrapped trigger function
|
|
78
|
-
* @param trigger - A function that receives the store trigger as the first parameter
|
|
79
|
-
* @returns A wrapped function that calls the trigger with the store trigger prepended
|
|
80
|
-
*
|
|
81
|
-
* @example
|
|
82
|
-
* // Get the trigger object directly
|
|
83
|
-
* const trigger = useEditorPanelTrigger()
|
|
84
|
-
* trigger.inputChange({ value: 'search' })
|
|
85
|
-
*
|
|
86
|
-
* @example
|
|
87
|
-
* // Create a wrapped trigger function
|
|
88
|
-
* const handleInputChange = useEditorPanelTrigger((trigger, value: string) => {
|
|
89
|
-
* trigger.inputChange({ value })
|
|
90
|
-
* })
|
|
91
|
-
* handleInputChange('search')
|
|
92
|
-
*/
|
|
93
|
-
export declare function useEditorPanelTrigger(): EditorPanelStore['trigger'];
|
|
94
|
-
export declare function useEditorPanelTrigger<T extends any[]>(trigger: (...params: [trigger: EditorPanelStore['trigger'], ...T]) => void): (...args: T) => void;
|
|
95
|
-
export {};
|
|
@@ -1,124 +0,0 @@
|
|
|
1
|
-
import "../../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { useCallbackRef } from "../../hooks/useCallbackRef.js";
|
|
3
|
-
import { useUpdateEffect } from "../../hooks/useUpdateEffect.js";
|
|
4
|
-
import { useLikeC4Model } from "../../hooks/useLikeC4Model.js";
|
|
5
|
-
import { useAdhocEditorActor } from "../hooks.js";
|
|
6
|
-
import { createTreeCollection } from "../useElementsTree.js";
|
|
7
|
-
import { deriveElementStates } from "./utils.js";
|
|
8
|
-
import { createContext, useContext, useEffect, useMemo, useRef } from "react";
|
|
9
|
-
import { jsx } from "react/jsx-runtime";
|
|
10
|
-
import { hasAtLeast } from "remeda";
|
|
11
|
-
import { createStore, shallowEqual } from "@xstate/store";
|
|
12
|
-
import { useSelector } from "@xstate/store/react";
|
|
13
|
-
//#region src/adhoc-editor/state/panel.tsx
|
|
14
|
-
var createEditorPanelStore = ({ initial, sideEffects }) => createStore({
|
|
15
|
-
context: {
|
|
16
|
-
searchInput: "",
|
|
17
|
-
expandedValue: [],
|
|
18
|
-
collection: initial
|
|
19
|
-
},
|
|
20
|
-
emits: { inputKeyDown: (payload) => {} },
|
|
21
|
-
on: {
|
|
22
|
-
"inputChange": (context, event) => {
|
|
23
|
-
return {
|
|
24
|
-
...context,
|
|
25
|
-
searchInput: event.value
|
|
26
|
-
};
|
|
27
|
-
},
|
|
28
|
-
"inputKeyDown": (context, event, enqueue) => {
|
|
29
|
-
enqueue.emit.inputKeyDown();
|
|
30
|
-
},
|
|
31
|
-
"modelUpdate": (context, event) => {
|
|
32
|
-
return {
|
|
33
|
-
...context,
|
|
34
|
-
collection: event.collection
|
|
35
|
-
};
|
|
36
|
-
},
|
|
37
|
-
"elementClick": (context, event, enqueue) => {
|
|
38
|
-
const current = context.collection.findNode(event.id);
|
|
39
|
-
const path = context.collection.getIndexPath(event.id);
|
|
40
|
-
if (!current || !path) return context;
|
|
41
|
-
enqueue.effect(() => {
|
|
42
|
-
sideEffects.onElementStateClick({ id: event.id });
|
|
43
|
-
});
|
|
44
|
-
return context;
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
});
|
|
48
|
-
var EditorPanelStoreContext = createContext(null);
|
|
49
|
-
var EditorPanelStoreProvider = (props) => {
|
|
50
|
-
const likec4model = useLikeC4Model();
|
|
51
|
-
const likec4modelRef = useRef(likec4model);
|
|
52
|
-
likec4modelRef.current = likec4model;
|
|
53
|
-
const actorRef = useAdhocEditorActor();
|
|
54
|
-
const store = useMemo(() => createEditorPanelStore({
|
|
55
|
-
initial: createTreeCollection(likec4model),
|
|
56
|
-
sideEffects: { onElementStateClick({ id }) {
|
|
57
|
-
actorRef.send({
|
|
58
|
-
type: "toggle.element",
|
|
59
|
-
id
|
|
60
|
-
});
|
|
61
|
-
} }
|
|
62
|
-
}), [actorRef]);
|
|
63
|
-
useUpdateEffect(() => {
|
|
64
|
-
store.trigger.modelUpdate({ collection: createTreeCollection(likec4model, deriveElementStates(actorRef.getSnapshot().context)) });
|
|
65
|
-
}, [likec4model]);
|
|
66
|
-
useEffect(() => {
|
|
67
|
-
const subscription = actorRef.on("view.update", () => {
|
|
68
|
-
store.trigger.modelUpdate({ collection: createTreeCollection(likec4modelRef.current, deriveElementStates(actorRef.getSnapshot().context)) });
|
|
69
|
-
});
|
|
70
|
-
return () => {
|
|
71
|
-
subscription.unsubscribe();
|
|
72
|
-
};
|
|
73
|
-
}, [actorRef]);
|
|
74
|
-
return /* @__PURE__ */ jsx(EditorPanelStoreContext.Provider, {
|
|
75
|
-
value: store,
|
|
76
|
-
children: props.children
|
|
77
|
-
});
|
|
78
|
-
};
|
|
79
|
-
function selectEditorPanelState(selector, compare) {
|
|
80
|
-
return [(snapshot) => selector(snapshot.context), compare ?? shallowEqual];
|
|
81
|
-
}
|
|
82
|
-
function useEditorPanelStore() {
|
|
83
|
-
return useContext(EditorPanelStoreContext);
|
|
84
|
-
}
|
|
85
|
-
function useEditorPanelState(...args) {
|
|
86
|
-
const store = useEditorPanelStore();
|
|
87
|
-
let selector;
|
|
88
|
-
let compare;
|
|
89
|
-
if (args.length === 2) [selector, compare] = args;
|
|
90
|
-
else if (args.length === 1 && Array.isArray(args[0]) && hasAtLeast(args[0], 2)) [selector, compare] = args[0];
|
|
91
|
-
else if (args.length === 1 && Array.isArray(args[0]) && hasAtLeast(args[0], 1)) [selector, compare] = [args[0], shallowEqual];
|
|
92
|
-
else if (args.length === 1 && typeof args[0] === "function") [selector, compare] = [args[0], shallowEqual];
|
|
93
|
-
else throw new Error("Invalid arguments for useEditorPanelState");
|
|
94
|
-
return useSelector(store, selector, compare);
|
|
95
|
-
}
|
|
96
|
-
/**
|
|
97
|
-
* Hook to subscribe to editor panel events
|
|
98
|
-
* @param args - The event name and handler function
|
|
99
|
-
* @example
|
|
100
|
-
* useOnEditorPanelEvent('inputKeyDown', () => {
|
|
101
|
-
* console.log('Input key down event')
|
|
102
|
-
* })
|
|
103
|
-
*/
|
|
104
|
-
function useOnEditorPanelEvent(...args) {
|
|
105
|
-
const store = useEditorPanelStore();
|
|
106
|
-
const event = args[0];
|
|
107
|
-
const handler = useCallbackRef(args[1]);
|
|
108
|
-
useEffect(() => {
|
|
109
|
-
const subscription = store.on(event, handler);
|
|
110
|
-
return () => {
|
|
111
|
-
subscription.unsubscribe();
|
|
112
|
-
};
|
|
113
|
-
}, [event, store]);
|
|
114
|
-
}
|
|
115
|
-
function useEditorPanelTrigger(...args) {
|
|
116
|
-
const store = useEditorPanelStore();
|
|
117
|
-
if (args.length === 0) return store.trigger;
|
|
118
|
-
const trigger = args[0];
|
|
119
|
-
return useCallbackRef((...args) => {
|
|
120
|
-
trigger(...[store.trigger, ...args]);
|
|
121
|
-
});
|
|
122
|
-
}
|
|
123
|
-
//#endregion
|
|
124
|
-
export { EditorPanelStoreProvider, selectEditorPanelState, useEditorPanelState, useEditorPanelTrigger, useOnEditorPanelEvent };
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { Fqn } from '@likec4/core/types';
|
|
2
|
-
import { Context } from './actor.types';
|
|
3
|
-
/**
|
|
4
|
-
* Derives the state of elements in the view based on the active rules.
|
|
5
|
-
*
|
|
6
|
-
* Categorizes elements into:
|
|
7
|
-
* - Explicitly included: Elements that are both in the view and have an enabled include rule
|
|
8
|
-
* - Implicitly included: Elements in the view without an explicit include rule
|
|
9
|
-
* - Excluded: Elements with an enabled exclude rule that are not in the view
|
|
10
|
-
*/
|
|
11
|
-
export declare function deriveElementStates({ rules, view }: Pick<Context, 'rules' | 'view'>): {
|
|
12
|
-
includedExplicit: Set<Fqn>;
|
|
13
|
-
includedImplicit: Set<Fqn>;
|
|
14
|
-
excluded: Set<Fqn>;
|
|
15
|
-
disabled: Set<Fqn>;
|
|
16
|
-
};
|
|
17
|
-
export type ElementStates = ReturnType<typeof deriveElementStates>;
|