likec4 1.18.0 → 1.19.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.
Files changed (49) hide show
  1. package/LICENSE +1 -1
  2. package/__app__/index.html +0 -1
  3. package/__app__/react/likec4.tsx +11 -8
  4. package/__app__/src/chunks/-index-overview-C9eO_hFX.js +309 -0
  5. package/__app__/src/chunks/-view-lazy-data-CI4xD57c.js +9 -0
  6. package/__app__/src/chunks/index-KI-kE60c.js +465 -0
  7. package/__app__/src/chunks/likec4-CusAw_j6.js +6106 -0
  8. package/__app__/src/chunks/main-DY2KbFcO.js +24136 -0
  9. package/__app__/src/chunks/mantine-B_6mKFFA.js +13671 -0
  10. package/__app__/src/chunks/tanstack-router-BBWuTKWO.js +2373 -0
  11. package/__app__/src/icons.js +6 -6
  12. package/__app__/src/main.js +1 -1
  13. package/__app__/src/style.css +1 -1
  14. package/__app__/webcomponent/webcomponent.js +21699 -21851
  15. package/dist/chunks/prompt.cjs +45 -0
  16. package/dist/chunks/prompt.mjs +35 -35
  17. package/dist/cli/index.cjs +469 -0
  18. package/dist/cli/index.d.cts +1 -0
  19. package/dist/cli/index.mjs +91 -88
  20. package/dist/index.cjs +1 -0
  21. package/dist/index.d.cts +16459 -0
  22. package/dist/index.d.mts +546 -2526
  23. package/dist/index.d.ts +546 -2526
  24. package/dist/index.mjs +1 -1
  25. package/dist/model/index.cjs +1 -0
  26. package/dist/model/index.d.cts +258 -0
  27. package/dist/model/index.d.mts +258 -0
  28. package/dist/model/index.d.ts +258 -0
  29. package/dist/model/index.mjs +1 -0
  30. package/dist/shared/likec4.1r1CQuHw.mjs +9 -0
  31. package/dist/shared/likec4.CLgnaOeL.mjs +1856 -0
  32. package/dist/shared/likec4.CfqfZIn-.cjs +1856 -0
  33. package/dist/shared/likec4.D81G5JV4.cjs +9 -0
  34. package/dist/shared/likec4.DCwaTTuF.d.cts +1625 -0
  35. package/dist/shared/likec4.DCwaTTuF.d.mts +1625 -0
  36. package/dist/shared/likec4.DCwaTTuF.d.ts +1625 -0
  37. package/package.json +72 -62
  38. package/react/index.d.ts +150 -918
  39. package/react/index.js +39830 -0
  40. package/react/style.css +1 -1
  41. package/__app__/src/chunks/-index-overview-CBnvpD1d.js +0 -309
  42. package/__app__/src/chunks/-view-lazy-data-WZmbIsHq.js +0 -9
  43. package/__app__/src/chunks/index-CIsxIzOH.js +0 -465
  44. package/__app__/src/chunks/likec4-DslTxitT.js +0 -6109
  45. package/__app__/src/chunks/main-ByUdz_Be.js +0 -24285
  46. package/__app__/src/chunks/mantine-oFa3ZrEq.js +0 -13658
  47. package/__app__/src/chunks/tanstack-router-BWjXKr0n.js +0 -2373
  48. package/dist/shared/likec4.lgHXhASw.mjs +0 -1832
  49. package/react/index.mjs +0 -41515
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2023-2024 Denis Davydkov
3
+ Copyright (c) 2023-2025 Denis Davydkov
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
@@ -5,7 +5,6 @@
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no" />
6
6
  <link rel="icon" type="image/svg+xml" href="/favicon.svg">
7
7
  <link rel="stylesheet" href="/src/style.css">
8
- <script src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?version=4.8.0&features=structuredClone%2Ces2022%2Ces2023%2CqueueMicrotask%2CrequestAnimationFrame%2Cdefault"></script>
9
8
  <title>LikeC4</title>
10
9
  </head>
11
10
  <body>
@@ -1,15 +1,15 @@
1
+ import type { LikeC4Model } from '@likec4/core/model'
1
2
  import {
3
+ type LikeC4ViewProps as BaseLikeC4ViewProps,
4
+ type ReactLikeC4Props as GenericReactLikeC4Props,
2
5
  LikeC4Browser,
3
- type LikeC4Model,
4
6
  LikeC4ModelProvider as GenericLikeC4ModelProvider,
5
7
  LikeC4ViewEmbedded,
6
- type LikeC4ViewProps as BaseLikeC4ViewProps,
7
8
  ReactLikeC4 as GenericReactLikeC4,
8
- type ReactLikeC4Props as GenericReactLikeC4Props,
9
9
  useColorScheme,
10
- ViewNotFound
10
+ ViewNotFound,
11
11
  } from 'likec4/react'
12
- import { memo, type PropsWithChildren, useCallback, useState } from 'react'
12
+ import { type PropsWithChildren, memo, useCallback, useState } from 'react'
13
13
  import { Icons } from 'virtual:likec4/icons'
14
14
  import type { DiagramView, LikeC4ElementKind, LikeC4Tag, LikeC4ViewId } from 'virtual:likec4/model'
15
15
  import { likeC4Model, LikeC4Views, useLikeC4Model } from 'virtual:likec4/model'
@@ -29,10 +29,13 @@ export function RenderIcon({ node }: IconRendererProps) {
29
29
 
30
30
  export { likeC4Model, LikeC4Views, useLikeC4Model }
31
31
 
32
- export const useLikeC4ViewModel = (viewId: LikeC4ViewId): LikeC4Model.View => useLikeC4Model().view(viewId as any)
32
+ export function useLikeC4ViewModel(viewId: LikeC4ViewId): LikeC4Model.View {
33
+ return useLikeC4Model().view(viewId as any)
34
+ }
33
35
 
34
- export const useLikeC4View = (viewId: LikeC4ViewId): DiagramView =>
35
- useLikeC4Model().view(viewId as any).$view as DiagramView
36
+ export function useLikeC4View(viewId: LikeC4ViewId): DiagramView {
37
+ return useLikeC4Model().view(viewId as any).$view as DiagramView
38
+ }
36
39
 
37
40
  export type LikeC4ViewProps = BaseLikeC4ViewProps<LikeC4ViewId, LikeC4Tag, LikeC4ElementKind>
38
41
 
@@ -0,0 +1,309 @@
1
+ import { jsx as t, jsxs as u, Fragment as z } from "react/jsx-runtime";
2
+ import { useOverviewGraph as L } from "virtual:likec4/overview-graph";
3
+ import { c as b, I as R, n as S, u as B, i as V, a as G } from "./main-DY2KbFcO.js";
4
+ import { u as $ } from "./tanstack-router-BBWuTKWO.js";
5
+ import { B as K, H as v, P as g, u as U, a as A, i as X, b as Y, c as q } from "./likec4-CusAw_j6.js";
6
+ import { memo as k, useRef as J, useMemo as j } from "react";
7
+ import { P as O, c as I, G as C, T as F, a as y, C as Q, b as W, d as ee, I as te, B as P, u as se } from "./mantine-B_6mKFFA.js";
8
+ import { usePreviewUrl as ae } from "virtual:likec4/previews";
9
+ /**
10
+ * @license @tabler/icons-react v3.17.0 - MIT
11
+ *
12
+ * This source code is licensed under the MIT license.
13
+ * See the LICENSE file in the root directory of this source tree.
14
+ */
15
+ var oe = b("outline", "loader", "IconLoader", [["path", { d: "M12 6l0 -3", key: "svg-0" }], ["path", { d: "M16.25 7.75l2.15 -2.15", key: "svg-1" }], ["path", { d: "M18 12l3 0", key: "svg-2" }], ["path", { d: "M16.25 16.25l2.15 2.15", key: "svg-3" }], ["path", { d: "M12 18l0 3", key: "svg-4" }], ["path", { d: "M7.75 16.25l-2.15 2.15", key: "svg-5" }], ["path", { d: "M6 12l-3 0", key: "svg-6" }], ["path", { d: "M7.75 7.75l-2.15 -2.15", key: "svg-7" }]]);
16
+ /**
17
+ * @license @tabler/icons-react v3.17.0 - MIT
18
+ *
19
+ * This source code is licensed under the MIT license.
20
+ * See the LICENSE file in the root directory of this source tree.
21
+ */
22
+ var re = b("filled", "file-filled", "IconFileFilled", [["path", { d: "M12 2l.117 .007a1 1 0 0 1 .876 .876l.007 .117v4l.005 .15a2 2 0 0 0 1.838 1.844l.157 .006h4l.117 .007a1 1 0 0 1 .876 .876l.007 .117v9a3 3 0 0 1 -2.824 2.995l-.176 .005h-10a3 3 0 0 1 -2.995 -2.824l-.005 -.176v-14a3 3 0 0 1 2.824 -2.995l.176 -.005h5z", key: "svg-0" }], ["path", { d: "M19 7h-4l-.001 -4.001z", key: "svg-1" }]]), ie = "mxt2a80";
23
+ function ne(r) {
24
+ return r.reduce((e, [s, a], o) => e + `${o === 0 ? "M" : " L"} ${s},${a}`, "");
25
+ }
26
+ function de({
27
+ id: r,
28
+ data: e,
29
+ ...s
30
+ }) {
31
+ if (!e)
32
+ return null;
33
+ const a = ne(e.points);
34
+ return /* @__PURE__ */ t(
35
+ K,
36
+ {
37
+ id: r,
38
+ path: a,
39
+ ...s
40
+ }
41
+ );
42
+ }
43
+ var h = "_1n8mzjc0", _ = "_1n8mzjc1", D = "_1n8mzjc2", M = "_1n8mzjc3", le = "_1n8mzjc4", ce = "_1n8mzjc5", me = "_1n8mzjc6", ue = "_1n8mzjc7", pe = "_1n8mzjc8";
44
+ const fe = /* @__PURE__ */ k(function({
45
+ data: e,
46
+ parentId: s,
47
+ id: a
48
+ }) {
49
+ const o = S(s);
50
+ return /* @__PURE__ */ u(z, { children: [
51
+ /* @__PURE__ */ t(v, { type: "target", position: g.Top, className: h }),
52
+ /* @__PURE__ */ t(
53
+ O,
54
+ {
55
+ p: "sm",
56
+ pt: "xs",
57
+ radius: "md",
58
+ withBorder: !0,
59
+ shadow: o ? "lg" : "xs",
60
+ className: I(
61
+ le,
62
+ o ? _ : D,
63
+ e.dimmed && M
64
+ ),
65
+ children: /* @__PURE__ */ u(C, { gap: 8, children: [
66
+ /* @__PURE__ */ t(F, { size: 24, variant: "transparent", color: "dark.4", children: /* @__PURE__ */ t(R, { size: "100%" }) }),
67
+ /* @__PURE__ */ t(y, { size: "lg", fw: 500, children: e.label })
68
+ ] })
69
+ }
70
+ ),
71
+ /* @__PURE__ */ t(v, { type: "source", position: g.Bottom, className: h })
72
+ ] });
73
+ }), ve = /* @__PURE__ */ k(function({
74
+ data: e,
75
+ parentId: s,
76
+ id: a
77
+ }) {
78
+ const o = S(s);
79
+ return /* @__PURE__ */ u(z, { children: [
80
+ /* @__PURE__ */ t(v, { type: "target", position: g.Top, className: h }),
81
+ /* @__PURE__ */ t(
82
+ O,
83
+ {
84
+ p: "sm",
85
+ pt: "xs",
86
+ radius: "md",
87
+ withBorder: !0,
88
+ shadow: o ? "lg" : "xs",
89
+ className: I(
90
+ ce,
91
+ o ? _ : D,
92
+ e.dimmed && M
93
+ ),
94
+ children: /* @__PURE__ */ u(C, { gap: 8, children: [
95
+ /* @__PURE__ */ t(F, { size: 24, variant: "transparent", color: "dark.3", children: /* @__PURE__ */ t(re, { size: "100%" }) }),
96
+ /* @__PURE__ */ t(y, { size: "lg", fw: 500, children: e.label })
97
+ ] })
98
+ }
99
+ ),
100
+ /* @__PURE__ */ t(v, { type: "source", position: g.Bottom, className: h })
101
+ ] });
102
+ }), ge = /* @__PURE__ */ k(function({
103
+ data: e,
104
+ height: s = 320
105
+ }) {
106
+ const o = ae(e.viewId);
107
+ return /* @__PURE__ */ u(z, { children: [
108
+ /* @__PURE__ */ t(v, { type: "target", position: g.Top, className: h }),
109
+ /* @__PURE__ */ u(
110
+ Q,
111
+ {
112
+ className: I(
113
+ me,
114
+ e.dimmed && M
115
+ ),
116
+ withBorder: !0,
117
+ shadow: "xs",
118
+ padding: 0,
119
+ children: [
120
+ /* @__PURE__ */ t(W, { className: ue, children: o ? /* @__PURE__ */ t(
121
+ te,
122
+ {
123
+ src: o,
124
+ fit: "contain",
125
+ h: s - 60
126
+ }
127
+ ) : /* @__PURE__ */ t(ee, { h: s - 60, children: /* @__PURE__ */ u(C, { children: [
128
+ /* @__PURE__ */ t(F, { size: 60, variant: "transparent", color: "dark", children: /* @__PURE__ */ t(oe, { stroke: 1.5, size: "100%" }) }),
129
+ /* @__PURE__ */ t(y, { size: "xl", fw: 500, c: "dimmed", children: "Preview not available" })
130
+ ] }) }) }),
131
+ /* @__PURE__ */ t(P, { className: pe, h: 60, p: "sm", pl: "md", children: /* @__PURE__ */ t(y, { component: "div", size: "lg", fw: 500, children: e.label }) })
132
+ ]
133
+ }
134
+ ),
135
+ /* @__PURE__ */ t(v, { type: "source", position: g.Bottom, className: h })
136
+ ] });
137
+ }), he = {
138
+ folder: fe,
139
+ file: ve,
140
+ view: ge
141
+ }, we = {
142
+ link: de
143
+ }, ye = (r) => ({
144
+ nodes: r.nodes.map(({ id: e, parentId: s, position: a, width: o, height: c, ...l }) => {
145
+ const i = s ? r.nodes.find((N) => N.id === s) : null, w = {
146
+ ...a,
147
+ width: o,
148
+ height: c
149
+ };
150
+ i && (a = {
151
+ x: a.x - i.position.x,
152
+ y: a.y - i.position.y
153
+ });
154
+ const p = i ? { parentId: i.id } : {};
155
+ switch (l.type) {
156
+ case "file":
157
+ case "folder":
158
+ return {
159
+ id: e,
160
+ type: l.type,
161
+ data: {
162
+ dimmed: !1,
163
+ label: l.label,
164
+ path: l.path,
165
+ rect: w
166
+ },
167
+ deletable: !1,
168
+ position: a,
169
+ width: o,
170
+ height: c,
171
+ zIndex: 1,
172
+ ...p
173
+ };
174
+ case "view":
175
+ return {
176
+ id: e,
177
+ type: "view",
178
+ data: {
179
+ dimmed: !1,
180
+ label: l.label,
181
+ viewId: l.viewId,
182
+ rect: w
183
+ },
184
+ selectable: !1,
185
+ deletable: !1,
186
+ position: a,
187
+ width: o,
188
+ height: c,
189
+ zIndex: 3,
190
+ ...p
191
+ };
192
+ default:
193
+ G(l);
194
+ }
195
+ }),
196
+ edges: r.edges.map((e) => ({
197
+ id: e.id,
198
+ source: e.source,
199
+ target: e.target,
200
+ type: "link",
201
+ zIndex: 2,
202
+ hidden: !0,
203
+ data: {
204
+ points: e.points
205
+ }
206
+ }))
207
+ });
208
+ function Ne({
209
+ graph: r,
210
+ fitViewPadding: e = 0.1,
211
+ zoomable: s = !0,
212
+ pannable: a = !0
213
+ }) {
214
+ const o = $(), c = J(), { colorScheme: l } = se(), i = j(() => ye(r), [r]), [w, p, N] = U(i.nodes), [E, H, Z] = A(i.edges);
215
+ B(() => {
216
+ p(
217
+ (n) => i.nodes.map((d) => {
218
+ const f = n.find((m) => m.id === d.id);
219
+ return f ? { ...V(f, ["selected", "hidden"]), ...d } : d;
220
+ })
221
+ ), H(i.edges);
222
+ }, [i.nodes, i.edges]);
223
+ const x = w.find((n) => n.selected);
224
+ return B(() => {
225
+ const n = c.current;
226
+ n && (x ? n.fitView({
227
+ maxZoom: 1,
228
+ padding: e,
229
+ nodes: [x],
230
+ duration: 450
231
+ }) : n.fitView({
232
+ maxZoom: 1,
233
+ padding: e,
234
+ duration: 800
235
+ }));
236
+ }, [x?.id ?? null]), /* @__PURE__ */ t(
237
+ X,
238
+ {
239
+ colorMode: l === "auto" ? "system" : l,
240
+ className: ie,
241
+ nodeTypes: he,
242
+ edgeTypes: we,
243
+ nodes: w,
244
+ onNodesChange: N,
245
+ edges: E,
246
+ onEdgesChange: Z,
247
+ fitView: !0,
248
+ fitViewOptions: j(() => ({
249
+ minZoom: 0.05,
250
+ maxZoom: 1,
251
+ padding: e,
252
+ includeHiddenNodes: !0
253
+ }), [e]),
254
+ nodesDraggable: !1,
255
+ nodesConnectable: !1,
256
+ nodesFocusable: !0,
257
+ edgesReconnectable: !1,
258
+ edgesFocusable: !1,
259
+ multiSelectionKeyCode: null,
260
+ zoomOnPinch: s,
261
+ zoomOnScroll: !a && s,
262
+ zoomOnDoubleClick: !1,
263
+ ...!s && {
264
+ zoomActivationKeyCode: null
265
+ },
266
+ maxZoom: s ? 2 : 1,
267
+ minZoom: s ? 0.01 : 1,
268
+ preventScrolling: s || a,
269
+ noDragClassName: "nodrag",
270
+ noPanClassName: "nopan",
271
+ panOnScroll: a,
272
+ panOnDrag: a,
273
+ ...!a && {
274
+ selectionKeyCode: null
275
+ },
276
+ onInit: (n) => c.current = n,
277
+ onNodeClick: (n, d) => {
278
+ if (d.type === "view") {
279
+ n.stopPropagation(), p((f) => f.map(({ data: m, ...T }) => ({ ...T, data: { ...m, dimmed: T.id !== d.id } }))), c.current?.fitView({
280
+ maxZoom: 10,
281
+ padding: 0,
282
+ nodes: [d],
283
+ duration: 1200
284
+ }), setTimeout(() => {
285
+ c.current?.updateNodeData(d.id, { dimmed: !0 });
286
+ }, 400), setTimeout(() => {
287
+ o.navigate({
288
+ to: "/view/$viewId/",
289
+ params: {
290
+ viewId: d.data.viewId
291
+ },
292
+ search: !0
293
+ });
294
+ }, 800);
295
+ return;
296
+ }
297
+ d.selected && (n.stopPropagation(), p((f) => f.map((m) => m.id === d.id ? { ...m, selected: !1 } : m)));
298
+ },
299
+ children: /* @__PURE__ */ t(Y, { variant: q.Dots, size: 4, gap: 50 })
300
+ }
301
+ );
302
+ }
303
+ function Be() {
304
+ const r = L();
305
+ return /* @__PURE__ */ t(P, { pos: "fixed", inset: 0, children: /* @__PURE__ */ t(Ne, { graph: r }) });
306
+ }
307
+ export {
308
+ Be as default
309
+ };
@@ -0,0 +1,9 @@
1
+ import { d2Source as e } from "virtual:likec4/d2-sources";
2
+ import { dotSource as c, svgSource as t } from "virtual:likec4/dot-sources";
3
+ import { mmdSource as S } from "virtual:likec4/mmd-sources";
4
+ export {
5
+ e as d2Source,
6
+ c as dotSource,
7
+ S as mmdSource,
8
+ t as svgSource
9
+ };