likec4 0.56.0 → 0.57.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/__app__/App.d.ts +3 -0
- package/dist/__app__/components/CopyToClipboard.d.ts +7 -0
- package/dist/__app__/{src/components → components}/CopyToClipboard.jsx +9 -8
- package/dist/__app__/components/DiagramNotFound.d.ts +5 -0
- package/dist/__app__/components/ThemePanelToggle.d.ts +3 -0
- package/dist/__app__/components/index.d.ts +6 -0
- package/dist/__app__/components/sidebar/DiagramsTree.d.ts +3 -0
- package/dist/__app__/{src/components → components}/sidebar/DiagramsTree.jsx +1 -1
- package/dist/__app__/components/sidebar/Sidebar.d.ts +3 -0
- package/dist/__app__/components/view-page/DisplayModeSelector.d.ts +3 -0
- package/dist/__app__/components/view-page/ExportDiagram.d.ts +9 -0
- package/dist/__app__/components/view-page/Header.d.ts +8 -0
- package/dist/__app__/components/view-page/ShareDialog.d.ts +6 -0
- package/dist/__app__/components/view-page/ViewActions.d.ts +6 -0
- package/dist/__app__/{src/components → components}/view-page/ViewActions.jsx +1 -0
- package/dist/__app__/const.d.ts +2 -0
- package/dist/__app__/data/atoms.d.ts +5 -0
- package/dist/__app__/data/hooks.d.ts +10 -0
- package/dist/__app__/data/index-page.d.ts +17 -0
- package/dist/__app__/data/index.d.ts +2 -0
- package/dist/__app__/data/sidebar-diagram-tree.d.ts +3 -0
- package/dist/__app__/likec4-views.d.ts +5 -0
- package/dist/__app__/main.d.ts +2 -0
- package/dist/__app__/pages/embed.page.d.ts +9 -0
- package/dist/__app__/pages/export.page.d.ts +8 -0
- package/dist/__app__/pages/index-page/index.d.ts +3 -0
- package/dist/__app__/pages/index.d.ts +5 -0
- package/dist/__app__/pages/useTransparentBackground.d.ts +2 -0
- package/dist/__app__/pages/view-page/ViewAsReact.d.ts +8 -0
- package/dist/__app__/pages/view-page/index.d.ts +4 -0
- package/dist/__app__/pages/view-page/other-formats/ViewAsD2.d.ts +7 -0
- package/dist/__app__/{src/pages → pages}/view-page/other-formats/ViewAsD2.jsx +1 -1
- package/dist/__app__/pages/view-page/other-formats/ViewAsDot.d.ts +7 -0
- package/dist/__app__/{src/pages → pages}/view-page/other-formats/ViewAsDot.jsx +1 -1
- package/dist/__app__/pages/view-page/other-formats/ViewAsMmd.d.ts +7 -0
- package/dist/__app__/{src/pages → pages}/view-page/other-formats/ViewAsMmd.jsx +1 -1
- package/dist/__app__/pages/view-page/other-formats.d.ts +9 -0
- package/dist/__app__/pages/view.page.d.ts +10 -0
- package/dist/__app__/{src/pages → pages}/view.page.jsx +2 -1
- package/dist/__app__/router.d.ts +69 -0
- package/dist/__app__/utils/index.d.ts +2 -0
- package/dist/__app__/utils/utils.d.ts +3 -0
- package/dist/cli/index.js +238 -232
- package/package.json +7 -7
- package/dist/__app__/tsconfig.json +0 -32
- /package/dist/__app__/{src/App.jsx → App.jsx} +0 -0
- /package/dist/__app__/{src/components → components}/DiagramNotFound.jsx +0 -0
- /package/dist/__app__/{src/components → components}/ThemePanelToggle.jsx +0 -0
- /package/dist/__app__/{src/components → components}/index.js +0 -0
- /package/dist/__app__/{src/components → components}/sidebar/Sidebar.jsx +0 -0
- /package/dist/__app__/{src/components → components}/view-page/DisplayModeSelector.jsx +0 -0
- /package/dist/__app__/{src/components → components}/view-page/ExportDiagram.jsx +0 -0
- /package/dist/__app__/{src/components → components}/view-page/Header.jsx +0 -0
- /package/dist/__app__/{src/components → components}/view-page/ShareDialog.jsx +0 -0
- /package/dist/__app__/{src/const.js → const.js} +0 -0
- /package/dist/__app__/{src/data → data}/atoms.js +0 -0
- /package/dist/__app__/{src/data → data}/hooks.js +0 -0
- /package/dist/__app__/{src/data → data}/index-page.js +0 -0
- /package/dist/__app__/{src/data → data}/index.js +0 -0
- /package/dist/__app__/{src/data → data}/sidebar-diagram-tree.js +0 -0
- /package/dist/__app__/{src/likec4-views.js → likec4-views.js} +0 -0
- /package/dist/__app__/{src/main.jsx → main.jsx} +0 -0
- /package/dist/__app__/{src/pages → pages}/embed.page.jsx +0 -0
- /package/dist/__app__/{src/pages → pages}/export.page.jsx +0 -0
- /package/dist/__app__/{src/pages → pages}/index-page/index.jsx +0 -0
- /package/dist/__app__/{src/pages → pages}/index.js +0 -0
- /package/dist/__app__/{src/pages → pages}/useTransparentBackground.js +0 -0
- /package/dist/__app__/{src/pages → pages}/view-page/ViewAsReact.jsx +0 -0
- /package/dist/__app__/{src/pages → pages}/view-page/index.js +0 -0
- /package/dist/__app__/{src/pages → pages}/view-page/other-formats.jsx +0 -0
- /package/dist/__app__/{src/router.js → router.js} +0 -0
- /package/dist/__app__/{src/utils → utils}/index.js +0 -0
- /package/dist/__app__/{src/utils → utils}/utils.js +0 -0
|
@@ -12,17 +12,18 @@ export function CopyToClipboard({ text }) {
|
|
|
12
12
|
setCopied(false);
|
|
13
13
|
}, [text]);
|
|
14
14
|
useEffect(() => {
|
|
15
|
-
if (copied) {
|
|
16
|
-
|
|
17
|
-
setCopied(false);
|
|
18
|
-
}, 800);
|
|
19
|
-
return () => clearTimeout(timeout);
|
|
15
|
+
if (!copied) {
|
|
16
|
+
return;
|
|
20
17
|
}
|
|
18
|
+
const timeout = setTimeout(() => {
|
|
19
|
+
setCopied(false);
|
|
20
|
+
}, 800);
|
|
21
|
+
return () => clearTimeout(timeout);
|
|
21
22
|
}, [copied]);
|
|
22
|
-
return (<Box position=
|
|
23
|
+
return (<Box position="absolute" top={'0'} right={'0'} p={'4'}>
|
|
23
24
|
<Tooltip content={copied ? 'Copied!' : 'Copy to clipboard'} {...(copied ? { open: true } : {})}>
|
|
24
|
-
<IconButton variant=
|
|
25
|
-
{copied ?
|
|
25
|
+
<IconButton variant="soft" color={copied ? 'green' : undefined} size={'2'} radius="large" onClick={copy} data-copied={copied} className={styles.copyButton}>
|
|
26
|
+
{copied ? <CheckCircledIcon width={16} height={16}/> : <CopyIcon width={16} height={16}/>}
|
|
26
27
|
</IconButton>
|
|
27
28
|
</Tooltip>
|
|
28
29
|
</Box>);
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { Sidebar } from './sidebar/Sidebar';
|
|
2
|
+
export { ViewActions } from './view-page/ViewActions';
|
|
3
|
+
export { ThemePanelToggle } from './ThemePanelToggle';
|
|
4
|
+
export { DiagramNotFound } from './DiagramNotFound';
|
|
5
|
+
export { CopyToClipboard } from './CopyToClipboard';
|
|
6
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DashboardIcon, TriangleRightIcon } from '@radix-ui/react-icons';
|
|
2
2
|
import { Box, Flex, Text } from '@radix-ui/themes';
|
|
3
|
-
import TreeView from 'react-accessible-treeview';
|
|
3
|
+
import TreeView, {} from 'react-accessible-treeview';
|
|
4
4
|
import { useDiagramsTree } from '../../data';
|
|
5
5
|
import { $pages, useRoute } from '../../router';
|
|
6
6
|
import { cn } from '../../utils';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { DiagramView } from '@likec4/diagrams';
|
|
3
|
+
type Props = {
|
|
4
|
+
diagram: DiagramView;
|
|
5
|
+
onCompleted: () => void;
|
|
6
|
+
};
|
|
7
|
+
declare const ExportDiagram: import("react").MemoExoticComponent<({ diagram, onCompleted }: Props) => JSX.Element>;
|
|
8
|
+
export default ExportDiagram;
|
|
9
|
+
//# sourceMappingURL=ExportDiagram.d.ts.map
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { DiagramView } from '@likec4/core';
|
|
2
|
+
export declare const viewsAtom: import("jotai").WritableAtom<import("rambdax").Dictionary<import("jotai").WritableAtom<DiagramView, [DiagramView], void>>, [update: Record<LikeC4ViewId, DiagramView>], void>;
|
|
3
|
+
export declare const diagramsTreeAtom: import("jotai").Atom<import("react-accessible-treeview").INode<import("react-accessible-treeview/dist/TreeView/utils").IFlatMetadata>[]>;
|
|
4
|
+
export declare const selectLikeC4ViewAtom: (viewId: string) => import("jotai").Atom<DiagramView | null>;
|
|
5
|
+
//# sourceMappingURL=atoms.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { type ViewsGroup } from './index-page';
|
|
2
|
+
export declare const useLikeC4View: (viewId: string) => import("@likec4/core").DiagramView | null;
|
|
3
|
+
export declare const useDiagramsTree: () => import("react-accessible-treeview").INode<import("react-accessible-treeview/dist/TreeView/utils").IFlatMetadata>[];
|
|
4
|
+
export type { ViewsGroup };
|
|
5
|
+
export declare const useViewGroupsAtoms: () => import("jotai").Atom<{
|
|
6
|
+
path: string;
|
|
7
|
+
isRoot: boolean;
|
|
8
|
+
views: [import("jotai").WritableAtom<import("@likec4/core").DiagramView, [import("@likec4/core").DiagramView], void>, ...import("jotai").WritableAtom<import("@likec4/core").DiagramView, [import("@likec4/core").DiagramView], void>[]];
|
|
9
|
+
}>[];
|
|
10
|
+
//# sourceMappingURL=hooks.d.ts.map
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { ExtractAtomValue } from 'jotai';
|
|
2
|
+
/**
|
|
3
|
+
* Views grouped by folder
|
|
4
|
+
*/
|
|
5
|
+
declare const viewGroupsAtom: import("jotai").Atom<{
|
|
6
|
+
path: string;
|
|
7
|
+
isRoot: boolean;
|
|
8
|
+
views: [import("jotai").WritableAtom<import("@likec4/core").DiagramView, [import("@likec4/core").DiagramView], void>, ...import("jotai").WritableAtom<import("@likec4/core").DiagramView, [import("@likec4/core").DiagramView], void>[]];
|
|
9
|
+
}[]>;
|
|
10
|
+
export type ViewsGroup = ExtractAtomValue<typeof viewGroupsAtom>[number];
|
|
11
|
+
export declare const viewsGroupAtomsAtom: import("jotai").Atom<import("jotai").Atom<{
|
|
12
|
+
path: string;
|
|
13
|
+
isRoot: boolean;
|
|
14
|
+
views: [import("jotai").WritableAtom<import("@likec4/core").DiagramView, [import("@likec4/core").DiagramView], void>, ...import("jotai").WritableAtom<import("@likec4/core").DiagramView, [import("@likec4/core").DiagramView], void>[]];
|
|
15
|
+
}>[]>;
|
|
16
|
+
export {};
|
|
17
|
+
//# sourceMappingURL=index-page.d.ts.map
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
import type { DiagramView } from '@likec4/core';
|
|
2
|
+
export declare function buildDiagramTreeAtom(views: DiagramView[]): import("react-accessible-treeview").INode<import("react-accessible-treeview/dist/TreeView/utils").IFlatMetadata>[];
|
|
3
|
+
//# sourceMappingURL=sidebar-diagram-tree.d.ts.map
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
type EmbedPageProps = {
|
|
3
|
+
viewId: string;
|
|
4
|
+
padding: number;
|
|
5
|
+
transparentBg?: boolean | undefined;
|
|
6
|
+
};
|
|
7
|
+
export declare function EmbedPage({ viewId, padding, transparentBg }: EmbedPageProps): JSX.Element;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=embed.page.d.ts.map
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { DiagramView } from '@likec4/diagrams';
|
|
3
|
+
type ViewAsReactProps = {
|
|
4
|
+
diagram: DiagramView;
|
|
5
|
+
};
|
|
6
|
+
export declare function ViewAsReact({ diagram }: ViewAsReactProps): JSX.Element;
|
|
7
|
+
export {};
|
|
8
|
+
//# sourceMappingURL=ViewAsReact.d.ts.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Box, Button, Code, ScrollArea } from '@radix-ui/themes';
|
|
1
|
+
import { Box, Button, Code, Flex, ScrollArea } from '@radix-ui/themes';
|
|
2
2
|
import { useAsync } from '@react-hookz/web';
|
|
3
3
|
import { d2Source } from 'virtual:likec4/d2-sources';
|
|
4
4
|
import { CopyToClipboard } from '../../../components';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Box, Code, ScrollArea } from '@radix-ui/themes';
|
|
1
|
+
import { Box, Code, Grid, ScrollArea } from '@radix-ui/themes';
|
|
2
2
|
import { dotSource, svgSource } from 'virtual:likec4/dot-sources';
|
|
3
3
|
import { CopyToClipboard } from '../../../components';
|
|
4
4
|
import { Panel, PanelGroup, PanelResizeHandle } from 'react-resizable-panels';
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { type ViewMode } from '../../router';
|
|
3
|
+
type Props = {
|
|
4
|
+
viewMode: Exclude<ViewMode, 'react'>;
|
|
5
|
+
viewId: string;
|
|
6
|
+
};
|
|
7
|
+
export default function ViewDiagramInOtherFormats({ viewId, viewMode }: Props): JSX.Element;
|
|
8
|
+
export {};
|
|
9
|
+
//# sourceMappingURL=other-formats.d.ts.map
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { ViewMode } from '../router';
|
|
3
|
+
type ViewPageProps = {
|
|
4
|
+
viewId: string;
|
|
5
|
+
viewMode: ViewMode;
|
|
6
|
+
showUI?: boolean;
|
|
7
|
+
};
|
|
8
|
+
export declare function ViewPage({ viewId, viewMode, showUI }: ViewPageProps): JSX.Element;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=view.page.d.ts.map
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { Suspense } from 'react';
|
|
1
|
+
import { Fragment, Suspense } from 'react';
|
|
2
2
|
import { DiagramNotFound } from '../components';
|
|
3
3
|
import { Header } from '../components/view-page/Header';
|
|
4
4
|
import { useLikeC4View } from '../data';
|
|
5
|
+
import { useSearchParams } from '../router';
|
|
5
6
|
import { ViewAs, ViewAsReact } from './view-page';
|
|
6
7
|
export function ViewPage({ viewId, viewMode, showUI = true }) {
|
|
7
8
|
const diagram = useLikeC4View(viewId);
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import type { ViewID } from '@likec4/core';
|
|
2
|
+
export declare const $router: import("@nanostores/router").Router<{
|
|
3
|
+
readonly index: string;
|
|
4
|
+
readonly view: `${string}view/:viewId?`;
|
|
5
|
+
readonly export: `${string}export/:viewId`;
|
|
6
|
+
readonly embed: `${string}embed/:viewId`;
|
|
7
|
+
}>;
|
|
8
|
+
export type ViewMode = 'react' | 'dot' | 'mmd' | 'd2';
|
|
9
|
+
declare const searchParams: import("nanostores").ReadableAtom<{
|
|
10
|
+
theme: "light" | "dark" | undefined;
|
|
11
|
+
padding: number | undefined;
|
|
12
|
+
mode: ViewMode | undefined;
|
|
13
|
+
showUI: boolean | undefined;
|
|
14
|
+
}>;
|
|
15
|
+
type SearchParams = ReturnType<(typeof searchParams)['get']>;
|
|
16
|
+
export declare function updateSearchParams(update: Partial<SearchParams>): void;
|
|
17
|
+
export declare const useSearchParams: () => {
|
|
18
|
+
theme: "light" | "dark" | undefined;
|
|
19
|
+
padding: number | undefined;
|
|
20
|
+
mode: ViewMode | undefined;
|
|
21
|
+
showUI: boolean | undefined;
|
|
22
|
+
};
|
|
23
|
+
export declare const useRoute: () => {
|
|
24
|
+
route: "view";
|
|
25
|
+
params: {
|
|
26
|
+
viewId: ViewID;
|
|
27
|
+
theme: "light" | "dark";
|
|
28
|
+
mode: ViewMode;
|
|
29
|
+
padding?: never;
|
|
30
|
+
};
|
|
31
|
+
showUI: boolean;
|
|
32
|
+
} | {
|
|
33
|
+
route: "export" | "embed";
|
|
34
|
+
params: {
|
|
35
|
+
viewId: ViewID;
|
|
36
|
+
padding: number;
|
|
37
|
+
theme: "light" | "dark" | undefined;
|
|
38
|
+
mode?: never;
|
|
39
|
+
};
|
|
40
|
+
showUI: boolean;
|
|
41
|
+
} | {
|
|
42
|
+
route: "index";
|
|
43
|
+
params: {
|
|
44
|
+
theme: "light" | "dark";
|
|
45
|
+
viewId?: never;
|
|
46
|
+
mode?: never;
|
|
47
|
+
padding?: never;
|
|
48
|
+
};
|
|
49
|
+
showUI: boolean;
|
|
50
|
+
};
|
|
51
|
+
export type Route = NonNullable<ReturnType<typeof useRoute>>;
|
|
52
|
+
export declare const isCurrentDiagram: <V extends {
|
|
53
|
+
id: string;
|
|
54
|
+
}>(view: V) => boolean;
|
|
55
|
+
export declare const $pages: {
|
|
56
|
+
readonly index: {
|
|
57
|
+
readonly url: () => string;
|
|
58
|
+
readonly open: () => void;
|
|
59
|
+
};
|
|
60
|
+
readonly view: {
|
|
61
|
+
readonly url: (viewId: string) => string;
|
|
62
|
+
readonly open: (viewId: string) => void;
|
|
63
|
+
};
|
|
64
|
+
readonly embed: {
|
|
65
|
+
readonly path: (viewId: string) => string;
|
|
66
|
+
};
|
|
67
|
+
};
|
|
68
|
+
export {};
|
|
69
|
+
//# sourceMappingURL=router.d.ts.map
|