@likec4/diagram 1.58.0 → 1.59.1
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/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/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/element/ElementActionButtons.d.ts +1 -0
- package/dist/base-primitives/element/ElementActionButtons.js +4 -1
- package/dist/base-primitives/element/ElementData.d.ts +3 -1
- 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.js +3 -0
- package/dist/components/ErrorFallback.js +3 -5
- package/dist/components/Link.js +6 -6
- package/dist/components/NavigationPanel.js +1 -1
- package/dist/components/SearchControl.css.js +11 -11
- package/dist/context/TagStylesContext.d.ts +3 -3
- package/dist/context/TagStylesContext.js +16 -16
- package/dist/custom/index.d.ts +1 -0
- package/dist/custom/index.js +3 -2
- package/dist/editor/actor/actions.js +1 -1
- package/dist/editor/actor/machine.d.ts +4 -6
- package/dist/editor/actor/setup.d.ts +16 -2
- package/dist/editor/actor/setup.js +5 -4
- 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.js +1 -1
- 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 +1 -1
- package/dist/index.js +2 -2
- package/dist/likec4diagram/DiagramUI.js +19 -6
- package/dist/likec4diagram/DiagramXYFlow.js +39 -14
- package/dist/likec4diagram/convert-to-xyflow.d.ts +3 -5
- package/dist/likec4diagram/convert-to-xyflow.js +29 -10
- package/dist/likec4diagram/custom/edges/RelationshipEdge.js +13 -4
- package/dist/likec4diagram/custom/edges/SequenceStepEdge.js +11 -4
- package/dist/likec4diagram/custom/edges/edges.css.js +1 -1
- package/dist/likec4diagram/custom/index.d.ts +2 -1
- package/dist/likec4diagram/custom/index.js +5 -3
- package/dist/likec4diagram/custom/nodes/CompoundActions.js +1 -0
- package/dist/likec4diagram/custom/nodes/ElementActions.d.ts +2 -2
- package/dist/likec4diagram/custom/nodes/ElementActions.js +13 -3
- package/dist/likec4diagram/custom/nodes/NodeNotes.js +0 -4
- 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.js +20 -5
- package/dist/likec4diagram/custom/nodes/toolbar/ColorButton.js +1 -1
- package/dist/likec4diagram/custom/nodes/toolbar/_shared.js +1 -1
- package/dist/likec4diagram/relationship-popover/RelationshipPopover.js +15 -14
- package/dist/likec4diagram/relationship-popover/components.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 +1 -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 +115 -44
- 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 +47 -3
- package/dist/likec4diagram/ui/FloatingSequenceActors.d.ts +6 -0
- package/dist/likec4diagram/ui/FloatingSequenceActors.js +155 -0
- 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/sequence-outline/SequenceOutlinePanel.d.ts +2 -0
- package/dist/likec4diagram/ui/sequence-outline/SequenceOutlinePanel.js +540 -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 +112 -60
- 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 +566 -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} +111 -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/NavigationPanelDropdown.js +45 -38
- 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/DriftsSummary.js +4 -5
- package/dist/navigationpanel/controls/DetailsControls.js +7 -8
- package/dist/navigationpanel/dropdown/ProjectsMenu.js +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.js +2 -2
- package/dist/navigationpanel/walkthrough/DynamicViewControls.d.ts +4 -4
- package/dist/navigationpanel/walkthrough/DynamicViewControls.js +23 -25
- 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/ElementDetailsCard.css.js +17 -17
- 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.js +1 -1
- package/dist/overlays/element-details/TabPanelStructure.css.js +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/custom/nodeTypes.js +1 -1
- package/dist/overlays/relationship-details/layout.js +1 -1
- package/dist/overlays/relationships-browser/SelectElement.css.js +2 -2
- package/dist/overlays/relationships-browser/actor.js +79 -78
- 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/actor.js +4 -4
- package/dist/search/Search.js +1 -1
- package/dist/search/components/ElementsColumn.css.js +2 -2
- 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 +1 -1
- package/dist/shadowroot/ShadowRoot.js +76 -28
- 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 +18 -30
- package/panda.buildinfo.json +270 -288
- package/styles-min.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/context/ShadowRootContext.d.ts +0 -3
- package/dist/context/ShadowRootContext.js +0 -5
- package/dist/shadowroot/styles.d.ts +0 -13
- package/dist/shadowroot/styles.js +0 -60
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import "../../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { filter, isNonNullish, map, pipe } from "remeda";
|
|
3
|
-
import { difference as difference$1, toSet } from "@likec4/core/utils";
|
|
4
|
-
//#region src/adhoc-editor/state/utils.ts
|
|
5
|
-
/**
|
|
6
|
-
* Derives the state of elements in the view based on the active rules.
|
|
7
|
-
*
|
|
8
|
-
* Categorizes elements into:
|
|
9
|
-
* - Explicitly included: Elements that are both in the view and have an enabled include rule
|
|
10
|
-
* - Implicitly included: Elements in the view without an explicit include rule
|
|
11
|
-
* - Excluded: Elements with an enabled exclude rule that are not in the view
|
|
12
|
-
*/
|
|
13
|
-
function deriveElementStates({ rules, view }) {
|
|
14
|
-
const includedInView = new Set(view ? view.nodes.map((node) => node.modelRef ?? null).filter(isNonNullish) : []);
|
|
15
|
-
const explicits = pipe(rules, filter((r) => r.type === "include" && r.enabled), map((r) => r.expr.ref.model), toSet());
|
|
16
|
-
const excluded = pipe(rules, filter((r) => r.type === "exclude" && r.enabled), map((r) => r.expr.ref.model), toSet());
|
|
17
|
-
return {
|
|
18
|
-
disabled: pipe(rules, filter((r) => !r.enabled), map((r) => r.expr.ref.model), toSet()),
|
|
19
|
-
includedExplicit: explicits,
|
|
20
|
-
includedImplicit: difference$1(includedInView, explicits),
|
|
21
|
-
excluded: difference$1(excluded, includedInView)
|
|
22
|
-
};
|
|
23
|
-
}
|
|
24
|
-
//#endregion
|
|
25
|
-
export { deriveElementStates };
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import { LikeC4Model } from '@likec4/core/model';
|
|
2
|
-
import { ElementShape, Fqn } from '@likec4/core/types';
|
|
3
|
-
import { TreeCollection } from '@zag-js/collection';
|
|
4
|
-
import { ElementStates } from './state/utils';
|
|
5
|
-
import * as tree from '@zag-js/tree-view';
|
|
6
|
-
export interface TreeNodeData {
|
|
7
|
-
id: Fqn;
|
|
8
|
-
title: string;
|
|
9
|
-
icon?: string | undefined;
|
|
10
|
-
shape: ElementShape;
|
|
11
|
-
children: TreeNodeData[];
|
|
12
|
-
state: 'include-explicit' | 'include-implicit' | 'exclude' | 'disabled' | 'not-present';
|
|
13
|
-
}
|
|
14
|
-
export interface ElementsTreeProps extends tree.Props<TreeNodeData> {
|
|
15
|
-
}
|
|
16
|
-
export declare function createTreeCollection(model: LikeC4Model, states?: ElementStates): TreeCollection<TreeNodeData>;
|
|
17
|
-
export type TreeApi = tree.Api<any, TreeNodeData>;
|
|
18
|
-
export declare function useElementsTree(): TreeApi;
|
|
@@ -1,98 +0,0 @@
|
|
|
1
|
-
import "../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { useId } from "../hooks/useId.js";
|
|
3
|
-
import { selectEditorPanelState, useEditorPanelState, useOnEditorPanelEvent } from "./state/panel.js";
|
|
4
|
-
import { useDeferredValue, useEffect, useMemo, useState } from "react";
|
|
5
|
-
import { difference, hasAtLeast, sort } from "remeda";
|
|
6
|
-
import { compareNaturalHierarchically, toArray } from "@likec4/core/utils";
|
|
7
|
-
import { normalizeProps, useMachine } from "@zag-js/react";
|
|
8
|
-
import * as tree from "@zag-js/tree-view";
|
|
9
|
-
//#region src/adhoc-editor/useElementsTree.ts
|
|
10
|
-
function getElementState(id, states) {
|
|
11
|
-
if (!states) return "not-present";
|
|
12
|
-
if (states.disabled.has(id)) return "disabled";
|
|
13
|
-
if (states.includedExplicit.has(id)) return "include-explicit";
|
|
14
|
-
if (states.includedImplicit.has(id)) return "include-implicit";
|
|
15
|
-
if (states.excluded.has(id)) return "exclude";
|
|
16
|
-
return "not-present";
|
|
17
|
-
}
|
|
18
|
-
function mapToTreeNodes(elements, states) {
|
|
19
|
-
return toArray(elements).map((el) => ({
|
|
20
|
-
id: el.id,
|
|
21
|
-
title: el.title,
|
|
22
|
-
shape: el.shape,
|
|
23
|
-
icon: el.icon ?? void 0,
|
|
24
|
-
children: mapToTreeNodes(el.children(), states),
|
|
25
|
-
state: getElementState(el.id, states)
|
|
26
|
-
}));
|
|
27
|
-
}
|
|
28
|
-
function createTreeCollection(model, states) {
|
|
29
|
-
return tree.collection({
|
|
30
|
-
rootNode: {
|
|
31
|
-
id: "@ROOT",
|
|
32
|
-
title: "",
|
|
33
|
-
shape: "rectangle",
|
|
34
|
-
icon: void 0,
|
|
35
|
-
children: mapToTreeNodes(model.roots(), states),
|
|
36
|
-
state: "not-present"
|
|
37
|
-
},
|
|
38
|
-
nodeToValue(node) {
|
|
39
|
-
return node.id;
|
|
40
|
-
},
|
|
41
|
-
nodeToString(node) {
|
|
42
|
-
return node.title;
|
|
43
|
-
},
|
|
44
|
-
nodeToChildren(node) {
|
|
45
|
-
return node.children;
|
|
46
|
-
},
|
|
47
|
-
isNodeDisabled() {
|
|
48
|
-
return false;
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
}
|
|
52
|
-
var select = selectEditorPanelState((s) => ({
|
|
53
|
-
searchInput: s.searchInput.length > 2 ? s.searchInput.toLowerCase() : "",
|
|
54
|
-
collection: s.collection
|
|
55
|
-
}), (a, b) => a?.searchInput === b.searchInput && a?.collection.isEqual(b.collection));
|
|
56
|
-
function useElementsTree() {
|
|
57
|
-
const { searchInput, collection } = useEditorPanelState(select);
|
|
58
|
-
const lowerCaseInput = useDeferredValue(searchInput);
|
|
59
|
-
const filteredCollection = useMemo(() => {
|
|
60
|
-
if (!lowerCaseInput) return collection;
|
|
61
|
-
return collection.filter((c) => c.title.toLowerCase().includes(lowerCaseInput));
|
|
62
|
-
}, [collection, lowerCaseInput]);
|
|
63
|
-
const [expandedValue, setExpandedValue] = useState([]);
|
|
64
|
-
useEffect(() => {
|
|
65
|
-
if (filteredCollection === collection) return;
|
|
66
|
-
setExpandedValue((current) => {
|
|
67
|
-
const newBranches = difference(filteredCollection.getBranchValues(), current);
|
|
68
|
-
if (hasAtLeast(newBranches, 1)) return sort([...current, ...newBranches], compareNaturalHierarchically());
|
|
69
|
-
return current;
|
|
70
|
-
});
|
|
71
|
-
}, [filteredCollection]);
|
|
72
|
-
const service = useMachine(tree.machine, {
|
|
73
|
-
id: useId(),
|
|
74
|
-
collection: filteredCollection,
|
|
75
|
-
defaultCheckedValue: [],
|
|
76
|
-
defaultSelectedValue: [],
|
|
77
|
-
expandedValue,
|
|
78
|
-
onExpandedChange({ expandedValue }) {
|
|
79
|
-
setExpandedValue(expandedValue);
|
|
80
|
-
},
|
|
81
|
-
onFocusChange(details) {
|
|
82
|
-
console.log("Focus change", details);
|
|
83
|
-
},
|
|
84
|
-
onSelectionChange(details) {
|
|
85
|
-
console.log("Selection change", details);
|
|
86
|
-
}
|
|
87
|
-
});
|
|
88
|
-
service.context.get("focusedValue")?.slice;
|
|
89
|
-
const api = tree.connect(service, normalizeProps);
|
|
90
|
-
api.select;
|
|
91
|
-
useOnEditorPanelEvent("inputKeyDown", () => {
|
|
92
|
-
const first = api.collection.getFirstNode()?.id;
|
|
93
|
-
if (first) api.focus(first);
|
|
94
|
-
});
|
|
95
|
-
return api;
|
|
96
|
-
}
|
|
97
|
-
//#endregion
|
|
98
|
-
export { createTreeCollection, useElementsTree };
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
export declare function scopeStylesToShadowRoot(styles: string): string;
|
|
2
|
-
export declare function appendFontToDocument(injectFontCss: boolean, styleNonce?: string | (() => string) | undefined): void;
|
|
3
|
-
/**
|
|
4
|
-
* Creates a CSS string with styles scoped to the shadow root
|
|
5
|
-
* @returns CSS string for the shadow root
|
|
6
|
-
*/
|
|
7
|
-
export declare const shadowRootCSS: () => string;
|
|
8
|
-
/**
|
|
9
|
-
* Creates a CSSStyleSheet with styles scoped to the shadow root
|
|
10
|
-
*/
|
|
11
|
-
export declare function createShadowRootStylesheets(csstext: string): [CSSStyleSheet];
|
|
12
|
-
export type ColorScheme = 'light' | 'dark';
|
|
13
|
-
export declare function useColorScheme(explicit?: ColorScheme): ColorScheme;
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
import { __name } from "../_virtual/_rolldown/runtime.js";
|
|
2
|
-
import { useCallbackRef as useCallbackRef$1 } from "../hooks/useCallbackRef.js";
|
|
3
|
-
import styles_font_default from "../styles-font2.js";
|
|
4
|
-
import styles_default from "../styles2.js";
|
|
5
|
-
import { useState } from "react";
|
|
6
|
-
import { first, isFunction, isString, once } from "remeda";
|
|
7
|
-
import { useColorScheme, useMutationObserverTarget } from "@mantine/hooks";
|
|
8
|
-
//#region src/shadowroot/styles.ts
|
|
9
|
-
function scopeStylesToShadowRoot(styles) {
|
|
10
|
-
return styles.replaceAll(/:where\(\s*:root\s*,\s*:host\s*\)/g, `:where(.likec4-shadow-root)`).replaceAll(":root", `.likec4-shadow-root`).replaceAll(/(^|[{},;]|\*\/)(\s*)body(?=\s*[{,])/g, "$1$2.likec4-shadow-root");
|
|
11
|
-
}
|
|
12
|
-
function appendFontToDocument(injectFontCss, styleNonce) {
|
|
13
|
-
if (injectFontCss && !document.querySelector(`style[data-likec4-font]`)) {
|
|
14
|
-
const style = document.createElement("style");
|
|
15
|
-
style.setAttribute("type", "text/css");
|
|
16
|
-
style.setAttribute("data-likec4-font", "");
|
|
17
|
-
let nonce;
|
|
18
|
-
if (isString(styleNonce)) nonce = styleNonce;
|
|
19
|
-
if (isFunction(styleNonce)) nonce = styleNonce();
|
|
20
|
-
if (nonce) style.setAttribute("nonce", nonce);
|
|
21
|
-
style.appendChild(document.createTextNode(styles_font_default));
|
|
22
|
-
document.head.appendChild(style);
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
/**
|
|
26
|
-
* Creates a CSS string with styles scoped to the shadow root
|
|
27
|
-
* @returns CSS string for the shadow root
|
|
28
|
-
*/
|
|
29
|
-
var shadowRootCSS = once(() => {
|
|
30
|
-
return scopeStylesToShadowRoot(styles_default);
|
|
31
|
-
});
|
|
32
|
-
/**
|
|
33
|
-
* Creates a CSSStyleSheet with styles scoped to the shadow root
|
|
34
|
-
*/
|
|
35
|
-
function createShadowRootStylesheets(csstext) {
|
|
36
|
-
const css = new CSSStyleSheet();
|
|
37
|
-
css.replaceSync(csstext);
|
|
38
|
-
return [css];
|
|
39
|
-
}
|
|
40
|
-
var getComputedColorScheme = () => {
|
|
41
|
-
try {
|
|
42
|
-
const colorScheme = first((window.getComputedStyle(document.documentElement).colorScheme ?? "").split(" "));
|
|
43
|
-
if (colorScheme === "light" || colorScheme === "dark") return colorScheme;
|
|
44
|
-
} catch {}
|
|
45
|
-
return null;
|
|
46
|
-
};
|
|
47
|
-
var getDocumentElement = () => document.documentElement;
|
|
48
|
-
function useColorScheme$1(explicit) {
|
|
49
|
-
const preferred = useColorScheme();
|
|
50
|
-
const [computed, setComputed] = useState(getComputedColorScheme);
|
|
51
|
-
useMutationObserverTarget(useCallbackRef$1(() => setComputed(getComputedColorScheme)), {
|
|
52
|
-
attributes: true,
|
|
53
|
-
childList: false,
|
|
54
|
-
subtree: false
|
|
55
|
-
}, getDocumentElement);
|
|
56
|
-
return explicit ?? computed ?? preferred;
|
|
57
|
-
}
|
|
58
|
-
__name(useColorScheme$1, "useColorScheme");
|
|
59
|
-
//#endregion
|
|
60
|
-
export { appendFontToDocument, createShadowRootStylesheets, shadowRootCSS, useColorScheme$1 as useColorScheme };
|