@likec4/diagram 1.58.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.
Files changed (229) hide show
  1. package/dist/LikeC4Diagram.js +1 -1
  2. package/dist/LikeC4Diagram.props.d.ts +1 -1
  3. package/dist/LikeC4Styles.js +1 -1
  4. package/dist/LikeC4View.js +2 -2
  5. package/dist/ReactLikeC4.d.ts +1 -1
  6. package/dist/base/Base.d.ts +3 -2
  7. package/dist/base/Base.js +14 -26
  8. package/dist/base/BaseXYFlow.d.ts +2 -1
  9. package/dist/base/BaseXYFlow.js +63 -4
  10. package/dist/base/keyboardZoom.d.ts +3 -0
  11. package/dist/base/keyboardZoom.js +20 -0
  12. package/dist/base/updateEdges.js +7 -16
  13. package/dist/base/updateNodes.js +3 -9
  14. package/dist/base-primitives/compound/CompoundActionButton.d.ts +2 -1
  15. package/dist/base-primitives/compound/CompoundActionButton.js +5 -2
  16. package/dist/base-primitives/compound/CompoundDetailsButton.d.ts +2 -1
  17. package/dist/base-primitives/compound/CompoundDetailsButton.js +5 -2
  18. package/dist/base-primitives/compound/CompoundTitle.d.ts +7 -1
  19. package/dist/base-primitives/compound/CompoundTitle.js +2 -1
  20. package/dist/base-primitives/compound/actionbtns.css.d.ts +1 -1
  21. package/dist/base-primitives/edge/EdgeActionButton.d.ts +2 -1
  22. package/dist/base-primitives/edge/EdgeActionButton.js +2 -1
  23. package/dist/base-primitives/edge/EdgeContainer.d.ts +1 -1
  24. package/dist/base-primitives/edge/EdgeContainer.js +4 -2
  25. package/dist/base-primitives/edge/EdgeLabel.d.ts +2 -0
  26. package/dist/base-primitives/edge/EdgeLabel.js +2 -5
  27. package/dist/base-primitives/element/ElementActionButtons.d.ts +1 -0
  28. package/dist/base-primitives/element/ElementActionButtons.js +4 -1
  29. package/dist/base-primitives/element/ElementData.d.ts +3 -1
  30. package/dist/base-primitives/element/ElementData.js +2 -1
  31. package/dist/base-primitives/element/ElementDetailsButton.d.ts +2 -1
  32. package/dist/base-primitives/element/ElementDetailsButton.js +5 -2
  33. package/dist/base-primitives/element/ElementNodeContainer.js +1 -1
  34. package/dist/base-primitives/element/ElementShape.js +3 -0
  35. package/dist/components/ErrorFallback.js +3 -5
  36. package/dist/components/Link.js +6 -6
  37. package/dist/components/NavigationPanel.js +1 -1
  38. package/dist/components/SearchControl.css.js +11 -11
  39. package/dist/context/TagStylesContext.d.ts +3 -3
  40. package/dist/context/TagStylesContext.js +16 -16
  41. package/dist/custom/index.d.ts +1 -0
  42. package/dist/custom/index.js +3 -2
  43. package/dist/editor/actor/actions.js +1 -1
  44. package/dist/editor/actor/machine.d.ts +4 -6
  45. package/dist/editor/actor/setup.d.ts +16 -2
  46. package/dist/editor/actor/setup.js +5 -4
  47. package/dist/hooks/index.d.ts +1 -1
  48. package/dist/hooks/safeContext.d.ts +156 -3
  49. package/dist/hooks/safeContext.js +60 -12
  50. package/dist/hooks/useCurrentViewModel.js +1 -1
  51. package/dist/hooks/useDiagram.d.ts +8 -0
  52. package/dist/hooks/useDiagram.js +9 -2
  53. package/dist/hooks/useEditorActor.js +1 -1
  54. package/dist/hooks/useLikeC4ElementsTree.js +1 -1
  55. package/dist/hooks/useLikeC4Model.js +1 -1
  56. package/dist/hooks/useXYFlow.d.ts +1 -0
  57. package/dist/hooks/useXYFlow.js +5 -3
  58. package/dist/index.d.ts +1 -1
  59. package/dist/index.js +2 -2
  60. package/dist/likec4diagram/DiagramUI.js +19 -6
  61. package/dist/likec4diagram/DiagramXYFlow.js +39 -14
  62. package/dist/likec4diagram/convert-to-xyflow.d.ts +3 -5
  63. package/dist/likec4diagram/convert-to-xyflow.js +29 -10
  64. package/dist/likec4diagram/custom/edges/RelationshipEdge.js +13 -4
  65. package/dist/likec4diagram/custom/edges/SequenceStepEdge.js +11 -4
  66. package/dist/likec4diagram/custom/edges/edges.css.js +1 -1
  67. package/dist/likec4diagram/custom/index.d.ts +2 -1
  68. package/dist/likec4diagram/custom/index.js +5 -3
  69. package/dist/likec4diagram/custom/nodes/CompoundActions.js +1 -0
  70. package/dist/likec4diagram/custom/nodes/ElementActions.d.ts +2 -2
  71. package/dist/likec4diagram/custom/nodes/ElementActions.js +13 -3
  72. package/dist/likec4diagram/custom/nodes/NodeNotes.js +0 -4
  73. package/dist/likec4diagram/custom/nodes/SequenceActorNode.js +32 -19
  74. package/dist/likec4diagram/custom/nodes/SequenceSubFlow.d.ts +2 -0
  75. package/dist/likec4diagram/custom/nodes/SequenceSubFlow.js +234 -0
  76. package/dist/likec4diagram/custom/nodes/index.d.ts +1 -0
  77. package/dist/likec4diagram/custom/nodes/nodes.js +20 -5
  78. package/dist/likec4diagram/custom/nodes/toolbar/ColorButton.js +1 -1
  79. package/dist/likec4diagram/custom/nodes/toolbar/_shared.js +1 -1
  80. package/dist/likec4diagram/relationship-popover/RelationshipPopover.js +15 -14
  81. package/dist/likec4diagram/relationship-popover/components.d.ts +1 -1
  82. package/dist/likec4diagram/state/DiagramActorProvider.js +11 -20
  83. package/dist/likec4diagram/state/aligners.js +1 -1
  84. package/dist/likec4diagram/state/assign.d.ts +1 -1
  85. package/dist/likec4diagram/state/assign.js +1 -1
  86. package/dist/likec4diagram/state/createViewChange.js +1 -1
  87. package/dist/likec4diagram/state/diagram-api.d.ts +18 -10
  88. package/dist/likec4diagram/state/diagram-api.js +333 -229
  89. package/dist/likec4diagram/state/machine.actions.d.ts +1026 -332
  90. package/dist/likec4diagram/state/machine.actions.js +115 -44
  91. package/dist/likec4diagram/state/machine.actions.layout.d.ts +123 -51
  92. package/dist/likec4diagram/state/machine.actions.layout.js +40 -33
  93. package/dist/likec4diagram/state/machine.d.ts +154 -16
  94. package/dist/likec4diagram/state/machine.js +5 -41
  95. package/dist/likec4diagram/state/machine.setup.d.ts +84 -19
  96. package/dist/likec4diagram/state/machine.setup.js +65 -12
  97. package/dist/likec4diagram/state/machine.state.initializing.d.ts +59 -33
  98. package/dist/likec4diagram/state/machine.state.navigating.js +7 -3
  99. package/dist/likec4diagram/state/machine.state.ready.d.ts +1540 -476
  100. package/dist/likec4diagram/state/machine.state.ready.focused.d.ts +294 -53
  101. package/dist/likec4diagram/state/machine.state.ready.focused.js +3 -3
  102. package/dist/likec4diagram/state/machine.state.ready.idle.d.ts +264 -73
  103. package/dist/likec4diagram/state/machine.state.ready.idle.js +31 -6
  104. package/dist/likec4diagram/state/machine.state.ready.js +22 -16
  105. package/dist/likec4diagram/state/machine.state.ready.printing.d.ts +23 -9
  106. package/dist/likec4diagram/state/machine.state.ready.walkthrough.d.ts +288 -84
  107. package/dist/likec4diagram/state/machine.state.ready.walkthrough.js +135 -66
  108. package/dist/likec4diagram/state/types.d.ts +4 -2
  109. package/dist/likec4diagram/state/utils.d.ts +7 -0
  110. package/dist/likec4diagram/state/utils.js +36 -34
  111. package/dist/likec4diagram/types.d.ts +47 -3
  112. package/dist/likec4diagram/ui/FloatingSequenceActors.d.ts +6 -0
  113. package/dist/likec4diagram/ui/FloatingSequenceActors.js +155 -0
  114. package/dist/likec4diagram/ui/LayoutDriftFrame.js +2 -2
  115. package/dist/likec4diagram/ui/index.d.ts +2 -0
  116. package/dist/likec4diagram/ui/notation/NotationPanel.css.js +5 -5
  117. package/dist/likec4diagram/ui/sequence-outline/SequenceOutlinePanel.d.ts +2 -0
  118. package/dist/likec4diagram/ui/sequence-outline/SequenceOutlinePanel.js +519 -0
  119. package/dist/likec4diagram/ui/sequence-outline/state.d.ts +36 -0
  120. package/dist/likec4diagram/ui/sequence-outline/state.js +55 -0
  121. package/dist/likec4diagram/xyflow-diagram/diagram-view.d.ts +1 -1
  122. package/dist/likec4diagram/xyflow-diagram/diagram-view.js +112 -60
  123. package/dist/likec4diagram/xyflow-sequence/_types.d.ts +55 -5
  124. package/dist/likec4diagram/xyflow-sequence/const.d.ts +5 -5
  125. package/dist/likec4diagram/xyflow-sequence/const.js +4 -4
  126. package/dist/likec4diagram/xyflow-sequence/layouter.d.ts +30 -6
  127. package/dist/likec4diagram/xyflow-sequence/layouter.js +561 -0
  128. package/dist/likec4diagram/xyflow-sequence/{sequence-layout.d.ts → sequence-view-to-xy.d.ts} +8 -2
  129. package/dist/likec4diagram/xyflow-sequence/{sequence-layout.js → sequence-view-to-xy.js} +111 -14
  130. package/dist/likec4diagram/xyflow-sequence/sequence-view.d.ts +2 -7
  131. package/dist/likec4diagram/xyflow-sequence/sequence-view.js +144 -0
  132. package/dist/likec4diagram/xyflow-sequence/utils.d.ts +9 -1
  133. package/dist/likec4diagram/xyflow-sequence/utils.js +96 -0
  134. package/dist/navigationpanel/NavigationPanel.d.ts +5 -2
  135. package/dist/navigationpanel/NavigationPanel.js +58 -59
  136. package/dist/navigationpanel/NavigationPanelDropdown.js +45 -38
  137. package/dist/navigationpanel/_common.js +2 -2
  138. package/dist/navigationpanel/actor.actions.d.ts +19 -0
  139. package/dist/navigationpanel/actor.actions.js +45 -0
  140. package/dist/navigationpanel/actor.d.ts +34 -96
  141. package/dist/navigationpanel/actor.js +21 -84
  142. package/dist/navigationpanel/actor.setup.d.ts +98 -0
  143. package/dist/navigationpanel/actor.setup.js +31 -0
  144. package/dist/navigationpanel/comparepanel/DriftsSummary.js +4 -5
  145. package/dist/navigationpanel/controls/DetailsControls.js +7 -8
  146. package/dist/navigationpanel/dropdown/ProjectsMenu.js +1 -1
  147. package/dist/navigationpanel/editorpanel/styles.js +8 -8
  148. package/dist/navigationpanel/hooks.d.ts +20 -5
  149. package/dist/navigationpanel/hooks.js +4 -18
  150. package/dist/navigationpanel/styles.css.d.ts +1 -1
  151. package/dist/navigationpanel/walkthrough/ActiveWalkthroughControls.js +2 -2
  152. package/dist/navigationpanel/walkthrough/DynamicViewControls.d.ts +4 -4
  153. package/dist/navigationpanel/walkthrough/DynamicViewControls.js +23 -25
  154. package/dist/navigationpanel/walkthrough/WalkthroughPanel.js +5 -5
  155. package/dist/overlays/Overlays.d.ts +4 -2
  156. package/dist/overlays/Overlays.js +10 -10
  157. package/dist/overlays/element-details/ElementDetailsCard.css.js +17 -17
  158. package/dist/overlays/element-details/MetadataValue.js +15 -15
  159. package/dist/overlays/element-details/TabPanelDeployments.css.js +5 -5
  160. package/dist/overlays/element-details/TabPanelRelationships.css.js +11 -11
  161. package/dist/overlays/element-details/TabPanelRelationships.js +1 -1
  162. package/dist/overlays/element-details/TabPanelStructure.css.js +2 -2
  163. package/dist/overlays/element-details/TabPanelStructure.js +1 -1
  164. package/dist/overlays/element-details/actor.d.ts +2 -3
  165. package/dist/overlays/hooks.d.ts +28 -0
  166. package/dist/overlays/hooks.js +5 -0
  167. package/dist/overlays/overlay/Overlay.js +34 -25
  168. package/dist/overlays/overlaysActor.js +0 -1
  169. package/dist/overlays/relationship-details/custom/nodeTypes.js +1 -1
  170. package/dist/overlays/relationship-details/layout.js +1 -1
  171. package/dist/overlays/relationships-browser/SelectElement.css.js +2 -2
  172. package/dist/overlays/relationships-browser/actor.js +79 -78
  173. package/dist/overlays/relationships-browser/custom/nodeTypes.js +1 -1
  174. package/dist/overlays/relationships-browser/hooks.js +1 -1
  175. package/dist/overlays/relationships-browser/layout.js +2 -2
  176. package/dist/projects-overview/actor.js +4 -4
  177. package/dist/search/Search.js +1 -1
  178. package/dist/search/components/ElementsColumn.css.js +2 -2
  179. package/dist/search/components/ViewsColum.js +1 -1
  180. package/dist/search/components/_shared.css.d.ts +1 -1
  181. package/dist/search/components/_shared.css.js +23 -23
  182. package/dist/search/components/styles.css.js +4 -4
  183. package/dist/shadowroot/ShadowRoot.d.ts +1 -1
  184. package/dist/shadowroot/ShadowRoot.js +76 -28
  185. package/dist/styles2.js +1 -1
  186. package/dist/utils/defineActors.d.ts +21 -0
  187. package/dist/utils/defineActors.js +13 -0
  188. package/dist/utils/index.d.ts +1 -0
  189. package/dist/utils/index.js +5 -4
  190. package/dist/utils/readableText.d.ts +11 -0
  191. package/dist/utils/readableText.js +18 -0
  192. package/package.json +18 -30
  193. package/panda.buildinfo.json +267 -288
  194. package/styles-min.css +1 -1
  195. package/styles.css +1 -1
  196. package/adhoc-editor/package.json +0 -4
  197. package/dist/adhoc-editor/EditorPanel.d.ts +0 -1
  198. package/dist/adhoc-editor/EditorPanel.js +0 -106
  199. package/dist/adhoc-editor/ElementsTree.d.ts +0 -2
  200. package/dist/adhoc-editor/ElementsTree.js +0 -112
  201. package/dist/adhoc-editor/LikeC4AdHocViewEditor.d.ts +0 -4
  202. package/dist/adhoc-editor/LikeC4AdHocViewEditor.js +0 -83
  203. package/dist/adhoc-editor/components/Tree.d.ts +0 -48
  204. package/dist/adhoc-editor/components/Tree.js +0 -213
  205. package/dist/adhoc-editor/hooks.d.ts +0 -14
  206. package/dist/adhoc-editor/hooks.js +0 -34
  207. package/dist/adhoc-editor/index.d.ts +0 -2
  208. package/dist/adhoc-editor/index.js +0 -2
  209. package/dist/adhoc-editor/state/ActorProvider.d.ts +0 -5
  210. package/dist/adhoc-editor/state/ActorProvider.js +0 -37
  211. package/dist/adhoc-editor/state/actor.d.ts +0 -13
  212. package/dist/adhoc-editor/state/actor.editor.d.ts +0 -56
  213. package/dist/adhoc-editor/state/actor.editor.js +0 -167
  214. package/dist/adhoc-editor/state/actor.js +0 -14
  215. package/dist/adhoc-editor/state/actor.layouter.d.ts +0 -51
  216. package/dist/adhoc-editor/state/actor.layouter.js +0 -54
  217. package/dist/adhoc-editor/state/actor.types.d.ts +0 -63
  218. package/dist/adhoc-editor/state/actor.types.js +0 -25
  219. package/dist/adhoc-editor/state/panel.d.ts +0 -95
  220. package/dist/adhoc-editor/state/panel.js +0 -124
  221. package/dist/adhoc-editor/state/utils.d.ts +0 -17
  222. package/dist/adhoc-editor/state/utils.js +0 -25
  223. package/dist/adhoc-editor/useElementsTree.d.ts +0 -18
  224. package/dist/adhoc-editor/useElementsTree.js +0 -98
  225. package/dist/adhoc-editor/viewrules/ViewRulesPanel.d.ts +0 -6
  226. package/dist/context/ShadowRootContext.d.ts +0 -3
  227. package/dist/context/ShadowRootContext.js +0 -5
  228. package/dist/shadowroot/styles.d.ts +0 -13
  229. 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,6 +0,0 @@
1
- import { AdhocRule } from '../state/actor.types';
2
- export declare function ViewRulesPanel({ rules, onToggle, onDelete, }: {
3
- rules: AdhocRule[];
4
- onToggle: (rule: AdhocRule) => void;
5
- onDelete: (rule: AdhocRule) => void;
6
- }): import("react").JSX.Element;
@@ -1,3 +0,0 @@
1
- import { Context } from 'react';
2
- export declare const ShadowRootContext: Context<ShadowRoot | null>;
3
- export declare function useShadowRoot(): ShadowRoot;
@@ -1,5 +0,0 @@
1
- import { createContext } from "react";
2
- //#region src/context/ShadowRootContext.tsx
3
- var ShadowRootContext = createContext(null);
4
- //#endregion
5
- export { ShadowRootContext };
@@ -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 };